Files
palina-theme/default.hbs
2026-02-19 20:03:51 +01:00

61 lines
1.9 KiB
Handlebars

<!DOCTYPE html>
<html lang="{{@site.lang}}"
x-data="{
theme: localStorage.getItem('theme') || (window.matchMedia('(prefers-color-scheme: light)').matches ? 'light' : 'dark'),
init() {
$watch('theme', val => {
localStorage.setItem('theme', val);
document.documentElement.setAttribute('data-theme', val);
});
document.documentElement.setAttribute('data-theme', this.theme);
document.documentElement.classList.remove('hidden');
}
}"
:data-theme="theme"
class="hidden">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>{{meta_title}}</title>
<link rel="stylesheet" href="{{asset "built/screen.css"}}">
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;700&family=Playfair+Display:wght@700&display=swap" rel="stylesheet">
<script defer src="https://cdn.jsdelivr.net/npm/alpinejs@3.x.x/dist/cdn.min.js"></script>
<script src="https://unpkg.com/htmx.org@2.0.0"></script>
<script>
document.addEventListener('alpine:init', () => {
Alpine.store('mobileMenu', {
open: false,
close() { this.open = false; },
openMenu() { this.open = true; }
});
});
document.addEventListener('htmx:beforeRequest', () => {
if (window.Alpine) Alpine.store('mobileMenu').close();
});
</script>
{{ghost_head}}
</head>
<body class="{{body_class}} font-sans antialiased" hx-boost="true">
<div class="min-h-screen flex flex-col">
{{> header}}
<main class="flex-grow">
{{{body}}}
</main>
{{> footer}}
{{> mobile-menu}}
</div>
{{ghost_foot}}
<script src="{{asset "js/ghost-config.js"}}"></script>
<script src="{{asset "js/main.js"}}"></script>
</body>
</html>