app/assets/stylesheets/sulHeader.scss
$masthead-color: $stanford-white;
$navbar-dark-color: $stanford-cool-grey;
$navbar-background-color: $stanford-cool-grey;
.navbar {
--bs-navbar-hover-color: rgba(255, 255, 255, 1);
padding-top: 0.75rem;
}
.bg-navbar {
background-color: $navbar-background-color;
}
header .h1 a {
text-decoration: none;
}
header a {
&:hover,
&:active,
&:focus {
text-decoration: underline;
}
}
.navbar-logo {
background: transparent url("sul-logo-white.svg") no-repeat top left;
background-size: 258px 41px;
color: white!important;
height: 41px;
overflow: hidden;
text-indent: 100%;
white-space: nowrap;
width: 258px;
}
header .topbar > .container,
header .topbar > .container-fluid {
padding: 0;
}
.al-masthead {
color: $masthead-color;
.h1 {
--al-masthead-title-size: 1.5rem;
display: inline;
font-weight: 600;
padding-left: 0;
// @include media-breakpoint-up(lg) {
// --al-masthead-title-size: 2rem;
// }
// @include media-breakpoint-up(xl) {
// --al-masthead-title-size: 2.25rem;
// }
}
.navbar-nav {
list-style-type: none;
padding-left: 0;
margin-right: 0.5rem;
flex-direction: row;
font-weight: 700;
li.active a {
color: $navbar-dark-color;
}
li {
display: inline-block;
position: relative;
white-space: nowrap;
}
li:not(:last-child) {
margin-right: 1rem;
}
li:not(:first-child)::before {
content: "•";
position: absolute;
left: -1.165rem;
top: 0.5rem;
}
}
}
.input-group {
.search-btn {
background-color: $navbar-dark-color;
border-color: #dee2e6; // Border color of Blacklight inputs
border-left: none;
padding: 0;
color: $stanford-palo-alto-dark;
padding-right: 5px;
.blacklight-icons {
margin-top: 0.5rem;
}
&.btn:active {
background-color: $stanford-palo-alto-light;
border-color: $stanford-palo-alto-light;
}
}
> .search-autocomplete-wrapper ul li:active {
color: $stanford-black;
background-color: var(--grey-lighter);
}
}
.al-masthead ~ .navbar-search {
border-top: none;
background-color: $navbar-background-color;
margin-bottom: 0;
.input-group-text {
background-color: $navbar-background-color;
border: none;
color: $navbar-dark-color;
font-weight: 700;
padding-top: 0.25rem;
padding-bottom: 0.25rem;
}
.within-collection-dropdown {
padding-right: 0.25rem;
.input-group-text {
padding-left: 0;
padding-right: 1.25rem;
}
}
.form-select {
background-size: 1.125rem 1.125rem;
padding-top: 0;
padding-bottom: 0;
// @include media-breakpoint-up(lg) {
// padding-right: 5rem;
// }
// @include media-breakpoint-up(xl) {
// padding-right: 8rem;
// }
}
// Search field selector and full text search box input group
.input-group:nth-of-type(2) {
// @include media-breakpoint-up(lg) {
// min-width: 87%;
// }
}
#search_field {
margin-right: 0.825rem;
}
}
.beta-banner {
background-color: $stanford-illuminating;
// These aren't official stanford colors
// but no combination of official interactive colors
// meet accessibility contrast requirements on this background.
color: #000;
a {
color: #0065ad;
}
}
.su-brand-bar__logo {
color: $stanford-cardinal;
display: inline-block;
font-size: 1rem;
font-family: $font-family-serif;
font-weight: 400;
font-variant-ligatures: discretionary-ligatures;
font-feature-settings: "liga";
margin-top: 0.125rem;
white-space: nowrap;
text-decoration: none;
&:hover,
&:active,
&:focus {
color: $stanford-black;
text-decoration: none;
}
}