mirror of
https://github.com/He4eT/elseifplayer.git
synced 2026-05-04 17:07:22 +00:00
MenuButton: add svg icon
This commit is contained in:
parent
3931685b08
commit
d01dd59598
2 changed files with 18 additions and 4 deletions
|
|
@ -7,9 +7,15 @@ export default MenuButton = ({ onClick }) => {
|
|||
<button
|
||||
aria-label='Menu'
|
||||
className={s.menuButton}
|
||||
onClick={() => setMenuOpen(true)}
|
||||
onClick={onClick}
|
||||
>
|
||||
=
|
||||
<svg
|
||||
class={s.menuIcon}
|
||||
viewBox='0 0 24 24'
|
||||
xmlns='http://www.w3.org/2000/svg'
|
||||
>
|
||||
<path d='M10 10h4v4h-4zm0-6h4v4h-4zm0 12h4v4h-4z'/>
|
||||
</svg>
|
||||
</button>
|
||||
)
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,14 +1,22 @@
|
|||
.menuButton {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background: none;
|
||||
border-left: none;
|
||||
border: none;
|
||||
outline-offset: -8px;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
height: 100%;
|
||||
padding: 0;
|
||||
aspect-ratio: 1;
|
||||
|
||||
&:focus-visible {
|
||||
outline-offset: -4px;
|
||||
}
|
||||
|
||||
.menuIcon {
|
||||
height: 32px;
|
||||
width: 32px;
|
||||
fill: CurrentColor;
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue