Header
Header Background Color
.Header {
background-color: #ff0000;
}
Header Background Color (Specific Page)
First, you need to find Page ID.
Then, use
body#collection-56e070e59f726659e9f1d3fb .Header {
background-color: #ff0000;
}
Sticky Header (Desktop/Tablet)
.Header {
position: fixed;
left: 0;
right: 0;
z-index: 999;
}
Sticky Announcement Bar
.sqs-announcement-bar-dropzone {
position: fixed;
top: 0;
left: 0;
right: 0;
z-index: 999;
}
.Header {
position: fixed;
left: 0;
right: 0;
z-index: 999;
top: 40px;
}
Force the Hamburger Nav for All Devices
[data-nc-base="mobile-bar"] {
display: block;
}
.Header {
display: none !important;
}
Turn Final Nav item into a button
.Header-nav-item:last-child {
background: #000;
color: #fff !important;
padding: 10px 20px !important;
font-size: 15px;
border-radius: 20px;
}
Vertical Line Dividers between Primary Navigation links
.Header-nav a {
border-right: 1px solid #000;
padding-right: 5px !important;
padding-top: 1px;
padding-bottom: 1px;
}
.Header-nav a:last-child {
border: none;
}
Scale the Heading 1 font for mobile
@media screen and (max-width:640px) {
h1 {
font-size: 20px !important;
}
}
Change Header Navigation Font
.Header-nav-item {
font-family: font-name !important;
}
Turn off click on navigation
.Header-nav-inner a {
pointer-events: none;
}
Underline Active Links on Navigation
.Header-nav-item--active {
text-decoration: underline;
}
Turn off click on Navigation Active Links
.Header-nav-item--active {
pointer-events: none;
}
Remove Header (One Page)
First, you need to find Page ID.
Then, use
body#collection-56e070e59f726659e9f1d3fb .Header {
display: none;
}
Other
Background Color (One Page)
First, you need to find Page ID.
Then, use
body#collection-56e070e59f726659e9f1d3fb {
background-color: #ff0000 !important;
}