Files
brk/website_next/header/style.css
T
2026-06-04 15:38:01 +02:00

89 lines
1.6 KiB
CSS

body {
> header {
position: fixed;
inset: 1.5rem 2rem auto;
z-index: 10;
display: grid;
grid-template-columns: 1fr auto 1fr;
align-items: center;
font-size: var(--font-size-sm);
line-height: 1;
text-transform: uppercase;
> a {
--color: var(--white);
opacity: 0.8;
justify-self: start;
display: flex;
align-items: center;
gap: 0.5rem;
color: var(--color);
font-size: var(--font-size-base);
text-decoration: none;
text-transform: lowercase;
&:hover {
opacity: 1;
}
&:active {
opacity: 1;
--color: var(--orange);
}
> span {
display: inline-grid;
padding: 0.2rem 0.3rem;
color: var(--black);
background-color: var(--color);
border-radius: 0.25rem;
}
.cube {
--size: 0.75rem;
animation: cube-fill 5s linear infinite alternate;
}
}
> nav {
font-size: var(--font-size-xs);
ul {
display: flex;
gap: 0.5rem;
margin: 0;
padding: 0;
list-style: none;
}
a {
display: block;
padding: 0.75rem 1rem;
border-radius: 0.3125rem;
text-decoration: none;
color: var(--white);
background: var(--dark-gray);
&:hover {
background: var(--gray);
}
&:active {
background: var(--orange);
}
&[aria-current="page"] {
color: var(--black);
background: var(--dark-white);
&:hover {
background: var(--white);
}
}
}
}
}
}