diff --git a/src/components/Header.astro b/src/components/Header.astro index 8971d8c..41024d5 100644 --- a/src/components/Header.astro +++ b/src/components/Header.astro @@ -54,14 +54,14 @@ const path = pagePath(Astro.url); margin: 0 calc(var(--gutter) * -1); padding: var(--header-space) var(--gutter); background: color-mix(in srgb, var(--bg) 80%, transparent); - -webkit-backdrop-filter: blur(16px) saturate(1.4); - backdrop-filter: blur(16px) saturate(1.4); + -webkit-backdrop-filter: blur(8px); + backdrop-filter: blur(8px); box-shadow: 0 1px 0 transparent; transition: box-shadow 0.2s ease; } header[data-scrolled] { - box-shadow: 0 1px 0 var(--rule); + box-shadow: 0 1px 0 color-mix(in srgb, var(--rule) 60%, transparent); } .bar { diff --git a/src/layouts/Base.astro b/src/layouts/Base.astro index e3b7ed1..d4e8611 100644 --- a/src/layouts/Base.astro +++ b/src/layouts/Base.astro @@ -9,9 +9,11 @@ interface Props { description: string; /** Off for pages search engines should skip, such as the 404 page. */ indexable?: boolean; + /** Less space above the title, for a longer page. */ + compact?: boolean; } -const { title, description, indexable = true } = Astro.props; +const { title, description, indexable = true, compact = false } = Astro.props; const canonical = new URL(pagePath(Astro.url), Astro.site); const image = new URL('/og.png', Astro.site).href; --- @@ -44,7 +46,7 @@ const image = new URL('/og.png', Astro.site).href;
-
+