valknar/palina-theme
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Implement light theme, mobile menu, font and image fallback

Browse Source
This commit is contained in:
Sebastian Krüger
2026-02-17 18:54:09 +01:00
parent a781249c1a
commit 64f48f82c0
8 changed files with 141 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
index.hbs
View File

@@ -1,15 +1,15 @@
{{!< default}}
<header class="container mx-auto px-4 py-8 text-center">
<h1 class="text-5xl font-bold tracking-tight text-white">Palina Photo Blog</h1>
<p class="mt-2 text-xl text-gray-400">{{@site.description}}</p>
<h1 class="text-5xl font-bold tracking-tight text-[var(--text-primary)]">Palina Photo Blog</h1>
<p class="mt-2 text-xl text-[var(--text-secondary)]">{{@site.description}}</p>
</header>
<div class="container mx-auto px-4">
{{#if posts}}
<div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-6">
{{#foreach posts}}
<article class="post-grid-item opacity-0 relative bg-gray-800 rounded-lg shadow-lg overflow-hidden group">
<article class="post-grid-item opacity-0 relative bg-[var(--bg-secondary)] rounded-lg shadow-lg overflow-hidden group">
<a href="{{url}}" class="block">
{{#if feature_image}}
<img
@@ -24,10 +24,10 @@
loading="lazy"
>
{{else}}
<div class="w-full h-72 flex items-center justify-center bg-gray-700 text-gray-300 text-2xl">No Image</div>
<div class="w-full h-72 flex items-center justify-center bg-[var(--bg-tertiary)] text-[var(--text-tertiary)] text-2xl">No Image</div>
{{/if}}
<div class="absolute inset-0 bg-black bg-opacity-50 flex items-end p-4 opacity-0 group-hover:opacity-100 transition-opacity duration-300 ease-in-out">
<h2 class="text-white text-xl font-semibold leading-tight">{{title}}</h2>
<h2 class="text-[var(--text-primary)] text-xl font-semibold leading-tight">{{title}}</h2>
</div>
</a>
</article>
@@ -36,6 +36,6 @@
{{pagination}}
{{else}}
<p class="text-center text-gray-400 text-2xl py-20">No posts found.</p>
<p class="text-center text-[var(--text-secondary)] text-2xl py-20">No posts found.</p>
{{/if}}
</div>