granblue.team/hensei-web
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix tap targets in header menu

Browse source
This commit is contained in:
Justin Edmund 2022-02-23 15:16:31 -08:00
parent 06eef3c248
commit d688ade570
3 changed files with 21 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
components/AboutModal/index.tsx
View file

@ -8,7 +8,9 @@ const AboutModal = () => {
return (
<Dialog.Root>
<Dialog.Trigger asChild>
<li className="MenuItem">About</li>
<li className="MenuItem">
<span>About</span>
</li>
</Dialog.Trigger>
<Dialog.Portal>
<Dialog.Content className="About Dialog" onOpenAutoFocus={ (event) => event.preventDefault() }>

6
components/HeaderMenu/index.scss
View file

@ -11,7 +11,6 @@
.MenuItem {
color: $grey-10;
font-weight: $normal;
padding: 12px;
&:hover {
background: $grey-100;
@ -26,6 +25,11 @@
a {
color: $grey-10;
}
a, span {
display: block;
padding: 12px;
}
}
.MenuGroup {

17
components/HeaderMenu/index.tsx
View file

@ -47,8 +47,12 @@ const HeaderMenu = (props: Props) => {
</div>
<div className="MenuGroup">
<AboutModal />
<li className="MenuItem">Settings</li>
<li className="MenuItem" onClick={props.logout}>Logout</li>
<li className="MenuItem">
<span>Settings</span>
</li>
<li className="MenuItem" onClick={props.logout}>
<span>Logout</span>
</li>
</div>
</ul>
</nav>
@ -71,13 +75,18 @@ const HeaderMenu = (props: Props) => {
</li>
</div>
<div className="MenuGroup">
<li className="MenuItem" onClick={openLoginModal}>Log in</li>
<li className="MenuItem" onClick={openLoginModal}>
<span>Log in</span>
</li>
{loginOpen ? (
<LoginModal
close={closeLoginModal}
/>
) : null}
<li className="MenuItem" onClick={openSignupModal}>Sign up</li>
<li className="MenuItem" onClick={openSignupModal}>
<span>Sign up</span>
</li>
{signupOpen ? (
<SignupModal
close={closeSignupModal}