hacklab/strudel
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

only invert prose for dark themes

Browse source
This commit is contained in:
Felix Roos 2023-02-10 18:34:02 +01:00
parent 46f70e6a5e
commit 6db2c0bf93
6 changed files with 42 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

16
website/src/components/HeadCommon.astro
View file

@ -46,14 +46,20 @@ const base = BASE_URL;
};
}
function setTheme(name) {
console.log('setTheme', name);
const { settings } = getTheme(name);
const cssVariables = Object.entries(settings)
.map(([key, value]) => `--${key}: ${value};`)
.join('\n');
// set css variables
themeStyle.innerHTML = `:root {
${cssVariables}
${Object.entries(settings)
.map(([key, value]) => `--${key}: ${value};`)
.join('\n')}
}`;
// tailwind dark mode
if (settings.light) {
document.documentElement.classList.remove('dark');
} else {
document.documentElement.classList.add('dark');
}
// persist theme name
localStorage.setItem('strudel-theme', name);
}
setTheme(localStorage.getItem('strudel-theme'));

2
website/src/components/PageContent/PageContent.astro
View file

@ -22,7 +22,7 @@ const currentPage = Astro.url.pathname;
<span>On this Page:</span>
<TableOfContents client:media="(max-width: 50em)" headings={headings} currentPage={currentPage} />
</nav> -->
<div class="prose prose-invert max-w-full pb-8">
<div class="prose dark:prose-invert max-w-full pb-8">
<slot />
</div>
</section>