moodist/src/components/menu/menu.module.css
2024-06-16 18:44:35 +03:30

41 lines
911 B
CSS

.wrapper {
& .menuButton {
display: flex;
align-items: center;
justify-content: center;
width: 45px;
height: 45px;
font-size: var(--font-md);
color: var(--color-foreground);
cursor: pointer;
background-color: var(--color-neutral-100);
border: 1px solid var(--color-neutral-300);
border-radius: 50%;
transition: 0.2s;
&:focus-visible {
outline: 2px solid var(--color-neutral-400);
outline-offset: 2px;
}
&:hover,
&:focus-visible {
background-color: var(--color-neutral-200);
}
}
}
.menu {
z-index: 15;
display: flex;
flex-direction: column;
row-gap: 4px;
width: 270px;
height: max-content;
max-height: var(--radix-dropdown-menu-content-available-height);
padding: 4px;
overflow: auto;
background-color: var(--color-neutral-100);
border: 1px solid var(--color-neutral-300);
border-radius: 4px;
}