714 lines
20 KiB
SCSS
Executable File
714 lines
20 KiB
SCSS
Executable File
/*************************************
|
|
* MENU MODULE
|
|
*************************************/
|
|
@mixin dropdown-menu-base {
|
|
position: static;
|
|
float: none;
|
|
list-style: none;
|
|
border-radius: 0;
|
|
border:0;
|
|
margin: 0;
|
|
padding: 0;
|
|
font-size: inherit;
|
|
|
|
//mobile up breakpoint -> min-width:768px
|
|
@include media-breakpoint-up( 'md' ) {
|
|
position: absolute;
|
|
display: none;
|
|
top: 100%;
|
|
@if ( true == $is_rtl ) {
|
|
right: 0;
|
|
}
|
|
@else {
|
|
left: 0;
|
|
}
|
|
z-index: 1000;
|
|
min-width: 10rem;
|
|
max-width: 50vw;
|
|
}
|
|
}
|
|
|
|
|
|
.sek-nav-wrap {
|
|
position: relative;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
align-items: center;
|
|
justify-content: flex-end;
|
|
padding: .5rem 0;
|
|
|
|
// https://github.com/presscustomizr/nimble-builder/issues/368
|
|
.sek-mobile-menu-expanded-below & {
|
|
padding: 0;
|
|
}
|
|
}
|
|
.sek-nav-collapse {
|
|
flex-basis: 100%;
|
|
flex-grow: 1;
|
|
align-items: center;
|
|
// justify-content property should be consistent with the default value in sek_get_module_params_for_czr_menu_content_child()
|
|
// justify-content: flex-start;
|
|
// -webkit-box-pack: start;
|
|
// -ms-flex-pack: start;
|
|
}
|
|
.sek-nav {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
flex-direction: column;
|
|
|
|
.sek-module .sek-module-inner & {
|
|
&,
|
|
& ul {
|
|
list-style: none !important;
|
|
padding: 0 !important;
|
|
margin: 0 !important;
|
|
}
|
|
margin-right: -10px !important;
|
|
margin-left: -10px !important;
|
|
li {
|
|
list-style: none;
|
|
padding: 0;
|
|
& > ul li {
|
|
padding: 0;
|
|
}
|
|
}
|
|
}
|
|
|
|
li {
|
|
font-size: 16px;// consistent with defaults
|
|
a {
|
|
line-height: 1.5em;// consistent with default registration params
|
|
padding: .6em .8em;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
color: inherit;
|
|
overflow:hidden;
|
|
.sek-nav-wrap & {
|
|
text-decoration: none;
|
|
}
|
|
&:hover {
|
|
.sek-nav__title {
|
|
text-decoration: underline;
|
|
}
|
|
}
|
|
}
|
|
|
|
&:not(:last-of-type) {
|
|
border-bottom: 1px solid;
|
|
//customizable
|
|
border-color: rgba(49,49,49,.09);
|
|
}
|
|
}
|
|
|
|
.menu-item-has-children,
|
|
.page_item_has_children {
|
|
position: relative;
|
|
& > a::after {
|
|
// Feb 2020 => replaced font awesome by a unicode character well supported
|
|
// see https://github.com/presscustomizr/nimble-builder/issues/602
|
|
content: "\203A";//https://unicode-table.com/en/203A/
|
|
font-family: "Arial Unicode MS", Arial;//<= https://www.fileformat.info/info/unicode/char/203A/fontsupport.htm
|
|
moz-osx-font-smoothing: grayscale;
|
|
-webkit-font-smoothing: antialiased;
|
|
display: none;
|
|
font-style: normal;
|
|
font-variant: normal;
|
|
text-rendering: auto;
|
|
font-weight: 900;
|
|
transition: all 0.3s ease;
|
|
transform-style: preserve-3d;
|
|
backface-visibility: hidden;
|
|
perspective: 1000px;
|
|
padding: 0 .45em;
|
|
font-size: 1em;
|
|
position: relative;
|
|
transform: translateZ(0) rotate(90deg);
|
|
-ms-transform: rotate(90deg);
|
|
}
|
|
&.show > a::after {
|
|
@if ( true == $is_rtl ) {
|
|
transform: translateZ(0) rotate(90deg) !important;
|
|
-ms-transform: rotate(90deg)!important;
|
|
}
|
|
@else {
|
|
transform: translateZ(0) rotate(-90deg)!important;
|
|
-ms-transform: rotate(-90deg)!important;
|
|
}
|
|
}
|
|
}
|
|
& .sub-menu,
|
|
& .children {
|
|
@include dropdown-menu-base();
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
// RULES FOR HORIZONTAL DESKTOP MENU
|
|
//mobile up breakpoint -> min-width:768px
|
|
@include media-breakpoint-up( 'md' ) {
|
|
.sek-nav {
|
|
flex-direction: row;
|
|
.menu-item-has-children,
|
|
.page_item_has_children {
|
|
& > a::after {
|
|
display:inline-block;
|
|
}
|
|
}
|
|
& > li:not(:last-of-type) {
|
|
border-bottom: none;
|
|
}
|
|
& > li > a {
|
|
padding: 5px;
|
|
}
|
|
.sek-module .sek-module-inner & {
|
|
li {
|
|
margin: 0 5px;
|
|
& > ul li {
|
|
@if ( true == $is_rtl ) {
|
|
padding: 0 .9rem 0 0;
|
|
} @else {
|
|
padding: 0 0 0 .9rem;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
.sek-nav-collapse {
|
|
display: flex!important;// <= !important because the php template sets this selector to display:none with inline style. This hack allows us to prevent a Content Layout Shift on page load
|
|
flex-basis: auto;
|
|
// justify-content property should be consistent with the default value in sek_get_module_params_for_czr_menu_content_child()
|
|
justify-content: flex-end;
|
|
-webkit-box-pack: end;
|
|
-ms-flex-pack: end;
|
|
}
|
|
// https://github.com/presscustomizr/nimble-builder/issues/368
|
|
.sek-mobile-menu-expanded-below {
|
|
display: none!important;
|
|
}
|
|
.sek-nav-toggler {
|
|
display: none;
|
|
}
|
|
|
|
.sek-dropdown-menu {
|
|
|
|
.sek-nav & li {
|
|
padding: 0 10px !important;
|
|
margin: 0 !important;
|
|
a {
|
|
padding: 10px 12px;
|
|
}
|
|
}
|
|
|
|
// following two should be customizable...
|
|
background: white;
|
|
box-shadow: 1px 2px 2px 2px rgba(0,0,0,.15);
|
|
|
|
ul {
|
|
@if ( true == $is_rtl ) {
|
|
right: 100%;
|
|
}
|
|
@else {
|
|
left: 100%;
|
|
}
|
|
}
|
|
|
|
.sek-menu-link__row-reverse {
|
|
flex-direction: row-reverse !important;
|
|
}
|
|
|
|
|
|
.sek-nav__title {
|
|
word-break: normal;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.sek-dropdown-submenu & {
|
|
top: 15px;
|
|
}
|
|
}
|
|
|
|
@at-root .sek-submenu-fade .sek-dropdown-menu a {
|
|
transition: all 0.25s ease;
|
|
transform: translate(0, 0);
|
|
&:hover {
|
|
transform: translate(3px, 0);
|
|
}
|
|
}
|
|
|
|
// submenu revealing fade effect
|
|
// lets use a trick to make this not impact on the snake
|
|
// basically we know that assigning a perspective to an element
|
|
// plus position:relative creates a new system
|
|
// where fixed elements behave like absolute elements relative to the parent
|
|
// this way the actual visual position of the dropdown will not be impacted
|
|
// though, as fixed element, even if overflowing the tc-page-wrap, will not
|
|
// make the orizontal scrollbar appear!
|
|
@at-root .sek-submenu-fade {
|
|
.page_item_has_children,
|
|
.menu-item-has-children {
|
|
perspective: 1000px;
|
|
> ul {
|
|
position: fixed;
|
|
opacity: 0;
|
|
visibility: hidden;
|
|
display: block;
|
|
transition: all 0.25s ease-in-out;
|
|
transform: translate( 0, -10px );
|
|
}
|
|
|
|
&:not(.show) {
|
|
//temporary fix for Firefox : https://github.com/presscustomizr/customizr/issues/1083
|
|
//the perspective thing seems to not work with this browser
|
|
//need further investigation
|
|
overflow: hidden;
|
|
|
|
//because of the fact the submenu is displayed
|
|
//it might still grab the the hover while fading out
|
|
//let's avoid this resetting its pointer-events
|
|
//when the li parent hasn't the show class
|
|
ul {
|
|
pointer-events: none;
|
|
cursor: $cursor-disabled;
|
|
}
|
|
}
|
|
}
|
|
|
|
li.show {
|
|
perspective: none;
|
|
> ul {
|
|
position: absolute;
|
|
visibility: visible;
|
|
opacity: 1;
|
|
transform: translate( 0, 0);
|
|
}
|
|
}
|
|
}
|
|
// end fade effect
|
|
|
|
.nb-collapsible-mobile-menu .nb-dd-mm-toggle-wrapper {
|
|
display: none;
|
|
}
|
|
}//@include media-breakpoint-up( 'md' )
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// ANIMATION : ROTATING ARROWS FOR SUBMENU PARENTS
|
|
.sek-dropdown-submenu {
|
|
& > a{
|
|
&::after {
|
|
@if ( true == $is_rtl ) {
|
|
transform: translateZ(0) rotate(0deg)!important;
|
|
-ms-transform: rotate(0deg)!important;
|
|
}
|
|
@else {
|
|
transform: translateZ(0) rotate(0deg)!important;
|
|
-ms-transform: rotate(0deg)!important;
|
|
}
|
|
}
|
|
//TODO: row reverse
|
|
&[class*=-reverse]::after {
|
|
top: .1em;
|
|
@if ( true == $is_rtl ) {
|
|
transform: translateZ(0) rotate(180deg)!important;
|
|
-ms-transform: rotate(180deg)!important;
|
|
}
|
|
@else {
|
|
transform: translateZ(0) rotate(-180deg)!important;
|
|
-ms-transform: rotate(-180deg)!important;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
.sek-dropdown-menu {
|
|
@include dropdown-menu-base();
|
|
|
|
.show > & {
|
|
display: block;
|
|
}
|
|
|
|
.sek-nav .sek-nav__title {
|
|
//the sidemenu and mobile menu should NOT break lines
|
|
word-break: break-word;// was break-all; Fixed in dec-2017 @see https://github.com/presscustomizr/customizr/issues/1339
|
|
white-space: normal;
|
|
}
|
|
//SNAKE
|
|
&.open-right {
|
|
left: 0;
|
|
right: auto;
|
|
}
|
|
@at-root &.open-right ul:not(.open-left),
|
|
& ul.open-right {
|
|
left: 100%;
|
|
right: auto;
|
|
top: 0;
|
|
}
|
|
|
|
&.open-left {
|
|
left: auto;
|
|
right: 0;
|
|
}
|
|
@at-root &.open-left ul:not(.open-right),
|
|
& ul.open-left {
|
|
right: 100%;
|
|
left: auto;
|
|
}
|
|
// progressive background filling on hover not activated when releasing the menu module initial version, in v1.4.0
|
|
// li {
|
|
// position: relative;
|
|
// &::before {
|
|
// content: '';
|
|
// position: absolute;
|
|
// width: 0%;
|
|
// height: 100%;
|
|
// top: 0;
|
|
// left: 0;
|
|
// transition-delay: 0s;
|
|
// transition-duration: .6s;
|
|
// transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
|
|
// transform-origin: 0 100%;
|
|
// background-color: rgba(0, 0, 0, 0.045);
|
|
// }
|
|
// &:hover::before {
|
|
// width: 100%;
|
|
// }
|
|
// }
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// Janv 2021 NEW COLLAPSIBLE MOBILE MENU
|
|
// June 2020 for https://github.com/presscustomizr/nimble-builder/issues/721
|
|
// Note that [data-sek-is-mobile-vertical-menu] value is set on page load and dynamically on window resize
|
|
nav.nb-collapsible-mobile-menu {
|
|
[data-sek-mm-state="expanded"] {
|
|
overflow: auto;
|
|
max-height: 80vh;
|
|
padding-bottom: 10px;
|
|
//background: #ffffff;
|
|
}
|
|
li .sub-menu {
|
|
li a { font-size: 0.88em; }
|
|
li > a { padding: .6em 32px; }
|
|
li li > a { padding: .6em 60px; }
|
|
li li li > a { padding: .6em 80px; }
|
|
li li li li > a { padding: .6em 100px; }
|
|
}
|
|
}
|
|
|
|
|
|
nav.nb-collapsible-mobile-menu [data-sek-mm-state] { display: none }
|
|
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] { display: block; }
|
|
|
|
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"],
|
|
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] li,
|
|
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] ul { background: #ffffff; }
|
|
|
|
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] .sub-menu,
|
|
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] li {
|
|
position: relative;
|
|
}
|
|
|
|
[data-sek-is-mobile-vertical-menu="yes"] .sek-nav li a {
|
|
min-height: 45px;//<= which is also the height if the toggle button when there are children items ( .nb-dd-mm-toggle )
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
// Janv 2021 : default alignment of vertical mobile menu items
|
|
// consistent with registration params
|
|
// see in sek_get_module_params_for_czr_menu_content_child()
|
|
justify-content: flex-start;
|
|
-webkit-box-pack: start;
|
|
-ms-flex-pack: start;
|
|
}
|
|
// nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] > li > a {
|
|
// min-height: 43px;
|
|
// }
|
|
// Hide sub-menus for mobile vertical menu
|
|
// show sub-menus when .expanded class is added
|
|
[data-sek-is-mobile-vertical-menu="yes"] .sub-menu { display: none; }
|
|
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] .sub-menu { display: none; }
|
|
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] .sub-menu.expanded { display: block; }
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// MOBILE MENU ARROW TOGGLE WHEN THERE IS A SUBMENU
|
|
/*
|
|
* Mobile dropdown on click
|
|
*/
|
|
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] .page_item_has_children > a,
|
|
nav.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] .menu-item-has-children > a {
|
|
// this padding gives the necessary space for the toggle arrow button
|
|
padding-right: 60px;
|
|
}
|
|
.nb-dd-mm-toggle-wrapper {
|
|
position: absolute;
|
|
top: 1px;
|
|
right: 0;
|
|
text-align: center;
|
|
line-height: 1;
|
|
bottom: 1px;
|
|
height: 45px;
|
|
width: 60px;
|
|
}
|
|
|
|
.nb-collapsible-mobile-menu [data-sek-mm-state="expanded"] .nb-dd-mm-toggle-wrapper {
|
|
display: block;
|
|
}
|
|
|
|
.nb-dd-mm-toggle {
|
|
background: none!important;
|
|
-webkit-appearance: none;
|
|
outline: none;
|
|
border: none;
|
|
padding: 0;
|
|
cursor: pointer;
|
|
display: block;
|
|
height: 45px;
|
|
width: 60px;
|
|
-webkit-box-sizing: border-box;
|
|
-moz-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.nb-dd-mm-toggle i {
|
|
display: block;
|
|
-webkit-transition: all .3s ease;
|
|
-o-transition: all .3s ease;
|
|
transition: all .3s ease;
|
|
-webkit-transform-style: preserve-3d;
|
|
-moz-transform-style: preserve-3d;
|
|
transform-style: preserve-3d;
|
|
-webkit-backface-visibility: hidden;
|
|
-moz-backface-visibility: hidden;
|
|
backface-visibility: hidden;
|
|
width: 100%;
|
|
color:#000000;
|
|
}
|
|
|
|
li.expanded > .nb-dd-mm-toggle-wrapper .nb-arrow-for-mobile-menu {
|
|
-webkit-transform: rotate(-180deg);
|
|
-moz-transform: rotate(-180deg);
|
|
transform: rotate(-180deg);
|
|
}
|
|
|
|
.nb-arrow-for-mobile-menu::after {
|
|
content: "\25BE";//https://unicode-table.com/en/25BE/
|
|
font-family: "Arial Unicode MS", Arial;//<= https://www.fileformat.info/info/unicode/char/203A/fontsupport.htm
|
|
moz-osx-font-smoothing: grayscale;
|
|
-webkit-font-smoothing: antialiased;
|
|
// display: none;
|
|
font-style: normal;
|
|
font-variant: normal;
|
|
text-rendering: auto;
|
|
font-weight: 900;
|
|
transition: all 0.3s ease;
|
|
transform-style: preserve-3d;
|
|
backface-visibility: hidden;
|
|
perspective: 1000px;
|
|
padding: 0 .45em;
|
|
font-size: 18px;
|
|
line-height: 45px;
|
|
position: relative;
|
|
}
|
|
|
|
|
|
|
|
// MOBILE : HAMBURGER BUTTON
|
|
//Hueman inspired nav toggler
|
|
.nb-loc .sek-module-inner nav .sek-nav-toggler {
|
|
-webkit-appearance: none !important;
|
|
cursor: pointer;
|
|
&, &:hover, &:focus {
|
|
//following 3 should be customizable
|
|
background: 0 0;
|
|
background-color: rgba(0, 0, 0, 0);
|
|
color: black;
|
|
outline: none;
|
|
border: none;
|
|
}
|
|
|
|
height: 40px;
|
|
width: 40px;
|
|
padding: 0;
|
|
vertical-align: middle;
|
|
//align to the right (left when rtl)
|
|
// @if ( true == $is_rtl ) {
|
|
// margin-right: auto;
|
|
// margin-left: -10px;
|
|
// }
|
|
// @else {
|
|
// margin-left: auto;
|
|
// margin-right: -10px;
|
|
// }
|
|
@at-root .sek-ham__span-wrapper {
|
|
height: 12px;
|
|
position: relative;
|
|
display: block;
|
|
.line {
|
|
display: block;
|
|
height: 1.5px;
|
|
position: absolute;
|
|
left: 10px;
|
|
border-radius: 5px;
|
|
background-clip: padding-box;
|
|
transition: all ease .35s;
|
|
backface-visibility: hidden;
|
|
border-top: 1.5px solid;
|
|
}
|
|
.line-1 {
|
|
top: 0;
|
|
}
|
|
.line-2 {
|
|
top: 50%;
|
|
}
|
|
.line-3 {
|
|
top: 100%;
|
|
}
|
|
|
|
@at-root .sek-nav-toggler {
|
|
.line-1 {
|
|
transform: translate(-3px, 6px) rotate(45deg);
|
|
width: 28px;
|
|
}
|
|
.line-2 {
|
|
opacity: 0;
|
|
}
|
|
.line-3 {
|
|
transform: translate(-3px, -6px) rotate(-45deg);
|
|
width: 28px;
|
|
}
|
|
}
|
|
@at-root .sek-nav-toggler.sek-collapsed .line {
|
|
width: 20px;
|
|
transform: translate(0,0) rotate(0);
|
|
opacity: 1;
|
|
}
|
|
@at-root .sek-nav-toggler.sek-collapsed.hovering .line {
|
|
transform: translateX(-3px);
|
|
width: 26px;
|
|
}
|
|
}
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
// PRO SEARCH ICON IN DESKTOP + SEARCH FIELD DESKTOP AND MOBILE
|
|
// June 2020 search icon + form in menu module for https://github.com/presscustomizr/nimble-builder-pro/issues/12
|
|
.nb-module-menu-search {
|
|
position: relative;
|
|
}
|
|
// Note that [data-sek-is-mobile-vertical-menu] value is set on page load and dynamically on window resize
|
|
[data-sek-is-mobile-vertical-menu="yes"] .nb-module-menu-search {
|
|
display: none;
|
|
}
|
|
.nb-svg-search-icon {
|
|
cursor: pointer;
|
|
padding: 0;
|
|
}
|
|
.nb-module-menu-search .nb-search-expand {
|
|
display:none;
|
|
background: #fff;
|
|
position: absolute;
|
|
z-index: 100;
|
|
top: 49px;
|
|
right: 0;
|
|
left: 0;
|
|
width: 340px;
|
|
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,.1);
|
|
box-shadow: 0 1px 0 rgba(255,255,255,.1);
|
|
}
|
|
.nb-search-expand .nb-search-expand-inner {
|
|
border: 1px solid #eee;
|
|
box-shadow: 0 0 5px rgba(0,0,0,.2),0 1px 0 rgba(255,255,255,.15);
|
|
transition: -webkit-transform .35s ease-in-out,height .25s ease-in-out,background-color .45s ease-in-out;
|
|
transition: transform .35s ease-in-out,height .25s ease-in-out,background-color .45s ease-in-out;
|
|
padding: 15px;
|
|
// make sure NB cleans any icon printed ::after the label ( like in hueman theme for example )
|
|
[role=search].search-form label::after {
|
|
content: none;
|
|
}
|
|
}
|
|
|
|
[data-sek-module-type="czr_menu_module"] .nb-search-expand .nb-search-expand-inner [role=search].search-form {
|
|
display: flex;
|
|
float: none;
|
|
}
|
|
|
|
[data-sek-module-type="czr_menu_module"] .nb-search-expand .nb-search-expand-inner label input[type=search] {
|
|
max-width: 100%;
|
|
}
|
|
[data-sek-module-type="czr_menu_module"] .nb-search-expand .nb-search-expand-inner input[type=submit], [data-sek-is-mobile-vertical-menu="yes"] .nb-mobile-search form input[type=submit] {
|
|
margin: 0;
|
|
background: #808080!important;
|
|
color: #fff;
|
|
font-size: 16px;
|
|
padding: 10px 10px;
|
|
font-weight: normal;
|
|
display: inline-block;
|
|
border: none;
|
|
cursor: pointer;
|
|
-webkit-border-radius: 3px;
|
|
border-radius: 3px;
|
|
}
|
|
// Note that [data-sek-is-mobile-vertical-menu] value is set on page load and dynamically on window resize
|
|
[data-sek-module-type="czr_menu_module"] .nb-search-expand .nb-search-expand-inner input[type=search], [data-sek-is-mobile-vertical-menu="yes"] .nb-mobile-search input[type=search],
|
|
[data-sek-module-type="czr_menu_module"] .nb-search-expand .nb-search-expand-inner input[type=submit], [data-sek-is-mobile-vertical-menu="yes"] .nb-mobile-search form input[type=submit] {
|
|
text-transform: none!important;
|
|
}
|
|
.nb-mobile-search {
|
|
display: none;
|
|
}
|
|
// Note that [data-sek-is-mobile-vertical-menu] value is set on page load and dynamically on window resize
|
|
[data-sek-is-mobile-vertical-menu="yes"] .nb-mobile-search {
|
|
display: block;
|
|
padding: 6px 14px 15px;
|
|
}
|
|
[data-sek-is-mobile-vertical-menu="yes"] .nb-mobile-search input {
|
|
font-size: 16px;
|
|
}
|
|
.nb-search-expand-inner, .nb-mobile-search {
|
|
input {
|
|
&[type="search"] {
|
|
color: #000000!important;
|
|
}
|
|
&[type="submit"] {
|
|
color: #ffffff!important;
|
|
}
|
|
}
|
|
}
|