dhorn/Protocol-oral-history-project
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

enhance wompum grid layout; add aspect ratio support and improve height management

Browse Source
This commit is contained in:
Drew
2025-04-07 16:51:21 -06:00
parent 80e9b781e5
commit 93e66d5b5c
6 changed files with 21 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
layouts/_default/single.html
View File

@ -1,7 +1,7 @@
{{ define "main" }}
<article class="single-default">
<header class="mb-8 wompum-container wompum-container--wide-gap">
<div class="wompum-grid h-96" data-text="{{ .Params.wompum | default .Title }}" data-columns="7" data-rows="5"></div>
<header class="mb-8 wompum-container wompum-container--wide-gap wompum-container--aspect-ratio">
<div class="wompum-grid" data-text="{{ .Params.wompum | default .Title }}" data-columns="7" data-rows="5"></div>
</header>
<div class="prose lg:prose-xl p-4 mx-auto mt-4">

2
layouts/articles/single.html
View File

@ -2,7 +2,7 @@
<article class="single-article">
<header class="mb-4 wompum-container wompum-container--wide-gap">{{ partial "article-wompum.html" . }}</header>
<header class="mb-4 wompum-container wompum-container--wide-gap wompum-container--aspect-ratio">{{ partial "article-wompum.html" . }}</header>
<div class="flex gap-4 mt-4">
<aside class="lg:sticky lg:top-0 lg:h-screen lg:overflow-y-auto lg:w-1/3 p-4 font-iosevka">

4
layouts/partials/article-list.html
View File

@ -5,13 +5,13 @@
{{- $page = .page -}}
{{- end -}}
<li class="flex gap-4 items-center">
<a class="flex-1 min-w-0 wompum-container" href="{{ $page.RelPermalink }}">{{ partial "article-wompum.html" $page }}</a>
<a class="flex-1 min-w-0 wompum-container h-full" href="{{ $page.RelPermalink }}">{{ partial "article-wompum.html" $page }}</a>
<time class="text-gray-800 font-iosevka w-12 flex-shrink-0" datetime="{{ $page.Date.Format "2006-01-02" }}">
<p>{{ $page.Date.Format "Jan" }}</p>
<p>{{ $page.Date.Format "02" }}</p>
<p>{{ $page.Date.Format "2006" }}</p>
</time>
<div class="w-3/5 flex-shrink-0">
<div class="w-3/5 flex-shrink-0 py-8">
<a class="article-title article-title--list text-2xl font-bold hover:text-green-900 underline" href="{{ $page.RelPermalink }}">{{ partial "article-title" $page }}</a>
{{ if $page.Params.location }}
<p class="text-gray-800 italic">{{ $page.Params.location }}</p>

4
layouts/partials/header.html
View File

@ -15,8 +15,8 @@
</ul>
</nav>
</div>
<div class="wompum-container wompum-container--wide-gap px-4">
<div class="wompum-grid h-1"
<div class="wompum-container wompum-container--wide-gap px-4 h-1">
<div class="wompum-grid"
data-text="{{ .Site.Title }}"
data-columns="7"
data-rows="1">