Files
newwalls.pl/themes/ayon_/_dev/css/components/mainmenu.scss
2024-12-17 13:43:22 +01:00

207 lines
3.8 KiB
SCSS

#_desktop_top_menu {
width:100%;
ul#top-menu {
position: relative;
padding: 0;
width: 100%;
background: $menu-bg;
border-radius: 5px;
box-shadow: 0 12px 30px 0 rgba(0,0,0,0.07);
display: inline-block;
padding:0 0 0 10px;
margin:0;
li {
padding:0;
a[data-depth="0"] {
font-family: $font-menu;
line-height: 68px;
font-size: 1.25rem;
text-transform: uppercase;
color:$menu-link;
padding:0 24px;
@include trans-fast;
&:hover {
color:$menu-link-h;
}
}
}
}
}
.top-menu {
&[data-depth="1"] {
margin: 0;
padding: 1.25rem 0.75rem ;
}
a:not([data-depth="0"]) {
display: block;
padding: 0.625rem;
color: $menu-link;
font-weight: 400;
}
a.dropdown-submenu {
color: $menu-link;
text-transform: uppercase;
font-weight: 600;
}
a[data-depth="0"] {
font-weight: 600;
padding: 0.1875rem $small-space 0.375rem;
&:hover {
#header & {
color: $menu-link-h;
text-decoration: none;
}
}
}
a[data-depth="1"],
a[data-depth="2"] {
padding: 0 0.625rem 0.625rem 0;
}
.collapse {
display: inherit;
}
.sub-menu {
&.collapse {
display: none;
}
box-shadow: 0 12px 30px 0 rgba(0,0,0,0.07);
background: $menu-bg;
border-radius: 5px;
border: none;
width: 100%;
min-width: 100%;
z-index: 18;
display: block!important;
opacity:0;
visibility:hidden;
ul[data-depth="1"] > li {
float: left;
margin: 0 1.25rem 1.5rem;
}
a:hover {
color: #00c293;
}
}
& > li:hover .sub-menu {
top:68px!important;
@include trans-fast;
}
.popover {
max-width: inherit;
border-radius: 0;
}
}
.popover.bs-tether-element-attached-top {
margin-top: 0;
}
#mobile_top_menu_wrapper {
margin-top: 0.625rem;
padding-bottom: 0.625rem;
background: $menu-bg;
#top-menu {
margin-bottom: 0.625rem;
}
.top-menu {
color: $menu-link;
.collapse-icons[aria-expanded="true"] {
.add {
display: none;
}
.remove {
display: block;
}
}
.collapse-icons .remove {
display: none;
}
.navbar-toggler {
display: inline-block;
padding: 0;
}
a[data-depth="0"] {
padding: 0.625rem;
border-bottom: 1px solid $gray-lighter;
}
.collapse {
display: none;
&.in {
display: block;
}
}
.sub-menu {
&.collapse {
display: none;
&.in {
display: block;
}
}
box-shadow: none;
z-index: inherit;
display: block;
position: static;
overflow: hidden;
margin-left: 0;
width: 100%;
min-width: 100%;
background: $gray-lighter;
ul[data-depth="0"] > li {
border-bottom: 1px solid $gray;
}
ul[data-depth="1"] {
margin: 0;
> li {
float: none;
margin: 0;
a {
text-transform: none;
}
}
}
ul {
padding: 0;
}
li > a {
padding: 0.625rem;
border-bottom: 1px solid white;
font-weight: bold;
}
ul[data-depth="2"] li a {
padding-left: 1.25rem;
}
ul[data-depth="3"] li a {
padding-left: 2.5rem;
}
ul[data-depth="4"] li a {
padding-left: 3.75rem;
}
}
}
.js-top-menu-bottom {
a {
color: $gray;
}
.language-selector-wrapper {
padding: 0.625rem;
.language-selector {
display: inline;
}
}
.currency-selector {
padding: 0.625rem;
}
#contact-link {
padding: 0.625rem;
}
.user-info {
padding: 0 0.625rem;
a {
padding: 0.625rem 0;
display: block;
width: 100%;
}
}
}
}