Motschen/midnightdust-eu
1
0
Fork 0
mirror of https://github.com/Motschen/midnightdust-eu.git synced 2025-12-15 10:05:09 +01:00
Code Issues Packages Projects Releases Wiki Activity

Sticky headerbar (with blur :D)

Browse Source
This commit is contained in:
Martin Prokoph
2024-09-18 19:34:05 +02:00
parent 04b741b133
commit e7f77b9ea9
1 changed files with 6 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/components/Header.astro
View File

@@ -4,7 +4,7 @@ import { SkipLinks } from 'accessible-astro-components'
import { Icon } from 'astro-icon/components' import { Icon } from 'astro-icon/components'
--- ---
<header> <header class="sticky top-0 z-50 backdrop-blur-md">
<SkipLinks /> <SkipLinks />
<Navigation> <Navigation>
<li class="menu-item"> <li class="menu-item">
@@ -58,6 +58,8 @@ import { Icon } from 'astro-icon/components'
@use '../assets/scss/base/outline' as *; @use '../assets/scss/base/outline' as *;
header { header {
background-color: rgb(255, 255, 255, 0.75);
.type-icon a { .type-icon a {
display: block; display: block;
@@ -78,4 +80,7 @@ import { Icon } from 'astro-icon/components'
} }
} }
} }
header:is(.darkmode *) {
background-color: rgba(24, 24, 37, 0.75);
}
</style> </style>