kevin/KevinK.dev.js
1
0
Fork 0
mirror of https://github.com/Unkn0wnCat/KevinK.dev.js.git synced 2025-06-18 18:42:05 +02:00
Code Issues Projects Releases Wiki Activity

Run prettier

Browse source
This commit is contained in:
Kevin Kandlbinder 2021-07-26 13:15:39 +00:00
parent 79b6120522
commit 839ea26e92
10 changed files with 875 additions and 870 deletions
Download patch file Download diff file Expand all files Collapse all files

150
src/components/navigation.module.scss
View file

@ -1,75 +1,75 @@
@import "../variables";
@import "../mixins";
.topBar {
position: fixed;
top: 0;
left: 0;
display: flex;
width: 100%;
background: rgba($background, 0.95);
color: $textColor;
backdrop-filter: blur(5px);
z-index: 999;
transition: background-color .25s, color .25s;
@supports (backdrop-filter: blur(5px)) {
background: rgba($background, 0.9);
}
@media(prefers-color-scheme: light) {
background: rgba($lightBackground, 0.95);
color: $lightTextColor;
@supports (backdrop-filter: blur(5px)) {
background: rgba($lightBackground, 0.9);
}
}
.topBarInner {
display: flex;
width: 100%;
max-width: $layoutWidth;
margin: auto;
> :first-child {
padding-left: $layoutPadding;
}
> :last-child {
padding-right: $layoutPadding;
}
a {
display: block;
padding: 10px $layoutPadding;
color: inherit;
text-decoration: none;
border-top: 2px solid transparent;
&:hover {
border-color: rgba(255, 255, 255, 0.25);
}
&.active {
border-color: white;
transition: border-color .25s;
@media(prefers-color-scheme: light) {
border-color: $accentColor;
}
}
}
}
}
.homeBar.homeBarTransparent {
background: transparent;
color: $textColor;
backdrop-filter: blur(0);
}
.flexSpacer {
flex-grow: 1;
text-align: center;
}
@import "../variables";
@import "../mixins";
.topBar {
position: fixed;
top: 0;
left: 0;
display: flex;
width: 100%;
background: rgba($background, 0.95);
color: $textColor;
backdrop-filter: blur(5px);
z-index: 999;
transition: background-color 0.25s, color 0.25s;
@supports (backdrop-filter: blur(5px)) {
background: rgba($background, 0.9);
}
@media (prefers-color-scheme: light) {
background: rgba($lightBackground, 0.95);
color: $lightTextColor;
@supports (backdrop-filter: blur(5px)) {
background: rgba($lightBackground, 0.9);
}
}
.topBarInner {
display: flex;
width: 100%;
max-width: $layoutWidth;
margin: auto;
> :first-child {
padding-left: $layoutPadding;
}
> :last-child {
padding-right: $layoutPadding;
}
a {
display: block;
padding: 10px $layoutPadding;
color: inherit;
text-decoration: none;
border-top: 2px solid transparent;
&:hover {
border-color: rgba(255, 255, 255, 0.25);
}
&.active {
border-color: white;
transition: border-color 0.25s;
@media (prefers-color-scheme: light) {
border-color: $accentColor;
}
}
}
}
}
.homeBar.homeBarTransparent {
background: transparent;
color: $textColor;
backdrop-filter: blur(0);
}
.flexSpacer {
flex-grow: 1;
text-align: center;
}