mirror of
https://github.com/danbee/danbarber.me
synced 2025-03-04 08:59:10 +00:00
58 lines
900 B
SCSS
58 lines
900 B
SCSS
$_header-link-focus-text-shadow: 0 0 5px rgba(255, 255, 255, 0.6);
|
|
|
|
.site-header {
|
|
background-color: $header-color;
|
|
padding: 1rem 0;
|
|
|
|
@media (prefers-color-scheme: dark) {
|
|
background-color: $header-color-dark;
|
|
}
|
|
}
|
|
|
|
.site-header__container {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.site-header__logo-link {
|
|
color: $white;
|
|
line-height: 0;
|
|
text-decoration: none;
|
|
}
|
|
|
|
.site-header__logo {
|
|
width: 5rem;
|
|
}
|
|
|
|
.site-header__navigation {
|
|
display: inline;
|
|
position: relative;
|
|
|
|
ul {
|
|
border: 0;
|
|
display: block;
|
|
list-style: none;
|
|
margin: 0;
|
|
padding: 0;
|
|
padding-top: 0.15em;
|
|
|
|
li {
|
|
float: left;
|
|
padding-left: 1.25em;
|
|
}
|
|
|
|
}
|
|
|
|
a {
|
|
color: white;
|
|
text-decoration: none;
|
|
transition: text-shadow 0.25s 0s ease;
|
|
|
|
&:hover,
|
|
&:focus {
|
|
color: $white;
|
|
text-shadow: $_header-link-focus-text-shadow;
|
|
}
|
|
}
|
|
}
|