30 lines
738 B
CSS
30 lines
738 B
CSS
|
@layer components {
|
||
|
|
nav {
|
||
|
|
@apply flex flex-wrap flex-row justify-between items-center py-5;
|
||
|
|
@apply mx-auto max-w-3xl;
|
||
|
|
@apply font-semibold;
|
||
|
|
|
||
|
|
& > .nav-mobile {
|
||
|
|
@apply md:hidden scale-125;
|
||
|
|
}
|
||
|
|
|
||
|
|
& > .nav-home {
|
||
|
|
@apply uppercase font-semibold text-lg;
|
||
|
|
}
|
||
|
|
|
||
|
|
& > .nav-links {
|
||
|
|
@apply hidden flex-row gap-5 md:h-auto md:flex;
|
||
|
|
|
||
|
|
&.open {
|
||
|
|
@apply max-md:flex max-md:flex-col max-md:w-full max-md:my-5 max-md:py-5 max-md:border-y-2;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
& a {
|
||
|
|
@apply transition-colors duration-500;
|
||
|
|
&:hover {
|
||
|
|
@apply text-primary underline;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|