mikeconrad/blog
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Fix Header with white background on mobile dark

Browse Source
This commit is contained in:
prototypa
2023-07-28 09:12:47 -04:00
parent d6f3055e31
commit bd781b925f
2 changed files with 3 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/assets/styles/tailwind.css
View File

@ -42,12 +42,12 @@
} }
#header.scroll > div:first-child { #header.scroll > div:first-child {
@apply bg-white md:bg-white/90 md:backdrop-blur-md; @apply bg-page md:bg-white/90 md:backdrop-blur-md;
box-shadow: 0 0.375rem 1.5rem 0 rgb(140 152 164 / 13%); box-shadow: 0 0.375rem 1.5rem 0 rgb(140 152 164 / 13%);
} }
.dark #header.scroll > div:first-child, .dark #header.scroll > div:first-child,
#header.scroll.dark > div:first-child { #header.scroll.dark > div:first-child {
@apply bg-white md:bg-[#030621e6] border-b border-gray-500/20; @apply bg-page md:bg-[#030621e6] border-b border-gray-500/20;
box-shadow: none; box-shadow: none;
} }
/* #header.scroll > div:last-child { /* #header.scroll > div:last-child {

2
src/components/widgets/Header.astro
View File

@ -53,7 +53,7 @@ const currentPath = `/${trimSlash(new URL(Astro.url).pathname)}`
<header <header
class:list={[ class:list={[
{ sticky: isSticky, relative: !isSticky, dark: isDark }, { sticky: isSticky, relative: !isSticky, dark: isDark },
"top-0 z-40 flex-none mx-auto w-full border-b border-gray-50/0 transition-[opacity] ease-in-out", "top-0 z-40 flex-none mx-auto w-full border-b border-gray-50/0 transition-[opacity] ease-in-out bg-page",
]} ]}
{...id ? { id } : {}} {...id ? { id } : {}}
> >