STYLE Update navigation styles to improve link visibility and layout, including new styles for secondary menu and menu items with icons
This commit is contained in:
parent
d62ce0054f
commit
f9368052d6
|
|
@ -9,6 +9,10 @@
|
||||||
2xl:px-32
|
2xl:px-32
|
||||||
my-0;
|
my-0;
|
||||||
|
|
||||||
|
a {
|
||||||
|
@apply text-white;
|
||||||
|
}
|
||||||
|
|
||||||
nav#primary-menu-nav {
|
nav#primary-menu-nav {
|
||||||
@apply max-w-screen-2xl w-full mx-auto;
|
@apply max-w-screen-2xl w-full mx-auto;
|
||||||
}
|
}
|
||||||
|
|
@ -30,9 +34,7 @@
|
||||||
gap-x-2
|
gap-x-2
|
||||||
lg:gap-x-4
|
lg:gap-x-4
|
||||||
xl:gap-x-8
|
xl:gap-x-8
|
||||||
pr-0
|
pr-0;
|
||||||
lg:pr-4
|
|
||||||
xl:pr-24;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* Highlight using list element */
|
/* Highlight using list element */
|
||||||
|
|
@ -55,7 +57,7 @@
|
||||||
@apply cursor-pointer
|
@apply cursor-pointer
|
||||||
underline
|
underline
|
||||||
underline-offset-8
|
underline-offset-8
|
||||||
text-secondary;
|
text-white;
|
||||||
}
|
}
|
||||||
a:focus {
|
a:focus {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
|
|
@ -91,6 +93,13 @@
|
||||||
transform: rotate(180deg);
|
transform: rotate(180deg);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
li.menu-item.has-page-icon {
|
||||||
|
@apply flex flex-col items-center justify-end gap-3;
|
||||||
|
.page_icon {
|
||||||
|
@apply w-5 h-5 object-contain object-center;
|
||||||
|
}
|
||||||
|
}
|
||||||
li.menu-item.menu-item-has-children:hover {
|
li.menu-item.menu-item-has-children:hover {
|
||||||
@screen lg {
|
@screen lg {
|
||||||
.menu-item-submenu-toggle:after {
|
.menu-item-submenu-toggle:after {
|
||||||
|
|
@ -135,6 +144,19 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.secondary-menu-container {
|
||||||
|
@apply bg-primary flex justify-between items-center px-8
|
||||||
|
2xl:px-32;
|
||||||
|
a {
|
||||||
|
@apply text-white;
|
||||||
|
}
|
||||||
|
|
||||||
|
.secondary-menu-nav {
|
||||||
|
ul {
|
||||||
|
@apply flex justify-between gap-4;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
button#burger-menu-toggle {
|
button#burger-menu-toggle {
|
||||||
@apply lg:hidden
|
@apply lg:hidden
|
||||||
absolute
|
absolute
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue
Block a user