nvrl/narlblog
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

updated theming and fixed warnings

Browse Source
This commit is contained in:
Nils Pukropp
2026-03-26 10:35:28 +01:00
parent 85549d41f8
commit 63cc84916e
11 changed files with 119 additions and 115 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
frontend/src/layouts/Layout.astro
View File

@@ -1,5 +1,6 @@
---
import '../styles/global.css';
import ThemeSwitcher from '../components/ThemeSwitcher.astro';
interface Props {
title: string;
@@ -45,7 +46,7 @@ try {
</head>
<body class="bg-base text-text selection:bg-surface2 selection:text-text">
<!-- Dynamic Mesh Gradient Background -->
<div class="fixed inset-0 z-[-1] overflow-hidden bg-base">
<div class="fixed inset-0 z-[-1] overflow-hidden bg-base text-text">
<div class="absolute top-[-10%] left-[-10%] w-[60%] h-[50%] rounded-full bg-mauve/15 blur-[120px] opacity-70 animate-pulse" style="animation-duration: 10s;"></div>
<div class="absolute bottom-[-10%] right-[-10%] w-[60%] h-[60%] rounded-full bg-blue/15 blur-[120px] opacity-60 animate-pulse" style="animation-duration: 15s;"></div>
<div class="absolute top-[30%] right-[10%] w-[40%] h-[40%] rounded-full bg-teal/10 blur-[100px] opacity-50 animate-pulse" style="animation-duration: 12s;"></div>
@@ -62,13 +63,7 @@ try {
<div class="flex gap-3 md:gap-4 items-center text-sm md:text-base w-full md:w-auto justify-center md:justify-end">
<a href="/" class="text-subtext0 hover:text-text transition-colors">Home</a>
<a href="/admin" class="text-subtext0 hover:text-mauve transition-colors">Admin</a>
<select id="user-theme-switcher" class="bg-surface0/50 text-text border border-surface1 rounded px-2 py-1 text-xs focus:outline-none focus:border-mauve transition-colors cursor-pointer">
<option value="mocha">Mocha</option>
<option value="macchiato">Macchiato</option>
<option value="frappe">Frappe</option>
<option value="latte">Latte</option>
<option value="scaled-and-icy">Scaled and Icy</option>
</select>
<ThemeSwitcher defaultTheme={siteConfig.theme} />
</div>
</header>
</nav>
@@ -83,21 +78,5 @@ try {
&copy; {new Date().getFullYear()} {siteConfig.title}
</div>
</footer>
<script is:inline define:vars={{ defaultTheme: siteConfig.theme }}>
document.addEventListener('DOMContentLoaded', () => {
const switcher = document.getElementById('user-theme-switcher');
if (switcher) {
const savedTheme = localStorage.getItem('user-theme') || defaultTheme;
switcher.value = savedTheme;
switcher.addEventListener('change', (e) => {
const newTheme = e.target.value;
localStorage.setItem('user-theme', newTheme);
document.documentElement.className = newTheme;
});
}
});
</script>
</body>
</html>