From 5384ae0cd14e9d3218a2ce02f009e60a9bb84a6b Mon Sep 17 00:00:00 2001 From: spleenftw Date: Fri, 10 Jul 2026 12:31:56 +0200 Subject: [PATCH] changes --- README.md | 6 ++- css/style.css | 109 +++++++++++++++++++++++++++++++++++++++++++++- languages/en.json | 4 ++ metadata.json | 6 +-- php/head.php | 19 +++++++- php/home.php | 23 ++++++++-- php/page.php | 42 ++++++++++++++++++ 7 files changed, 198 insertions(+), 11 deletions(-) diff --git a/README.md b/README.md index 12ef7a1..9c07e8d 100644 --- a/README.md +++ b/README.md @@ -3,7 +3,7 @@ A clean, minimal theme for [Bludit](https://www.bludit.com) inspired by the [Blowfish](https://blowfish.page/) Hugo theme. -![Bludit](https://img.shields.io/badge/Bludit-3.22+-informational) ![License](https://img.shields.io/badge/license-MIT-green) ![Version](https://img.shields.io/badge/version-1.6.0-blue) +![Bludit](https://img.shields.io/badge/Bludit-3.22+-informational) ![License](https://img.shields.io/badge/license-MIT-green) ![Version](https://img.shields.io/badge/version-1.7.0-blue) ## Features @@ -16,6 +16,8 @@ A clean, minimal theme for [Bludit](https://www.bludit.com) inspired by the - **Keyboard shortcuts** — `/` (search), `g h` (go home), `t` (back to top), `Esc` (close overlay). - **Randomized navigation** — the Navigation/Pages plugin list is shuffled on every load. - **Reading time & dates** shown on the post list and single posts. +- **Post-list excerpts** — the page description renders as a 2-line excerpt; tags are capped at 5 with a `+N` badge. +- **Older / newer post navigation** — chronological links under every article, above the related posts. - **Social icons** in the navbar and hero (SVG files in `img/`). - **Tags & categories** rendered as pill badges. - **Image lightbox** — clicking any article image opens it full-screen with a dark overlay and zoom hint. @@ -24,7 +26,7 @@ A clean, minimal theme for [Bludit](https://www.bludit.com) inspired by the - **Code block header bar** — language label + copy-to-clipboard button on every code block. - **Callout/admonition boxes** — `> [!NOTE]`, `> [!TIP]`, `> [!WARNING]`, `> [!DANGER]`, `> [!IMPORTANT]`. - **Series navigation** — posts tagged `series-*` display an ordered series box. -- **SEO** — Open Graph, Twitter Card, JSON-LD (WebSite, Article, BreadcrumbList, sameAs), canonical URL, theme-color meta, cover-image preload. +- **SEO** — Open Graph, Twitter Card, JSON-LD (WebSite, Article, BreadcrumbList, sameAs), canonical URL, theme-color meta, cover-image preload. Duplicate OG/Twitter/canonical tags emitted by Bludit plugins are stripped automatically. - **Accessibility** — skip link, ARIA labels, `:focus-visible`, heading anchor links, print stylesheet. - **PWA** — web app manifest included. - Fully responsive; no jQuery, no Bootstrap JS, no webfont requests. diff --git a/css/style.css b/css/style.css index fa9fbdb..5ff9307 100644 --- a/css/style.css +++ b/css/style.css @@ -355,13 +355,45 @@ h2.title { margin-bottom: var(--space-md); } -/* Justify body paragraphs; hyphenate so the inter-word gaps stay tidy */ +/* Justified body text on wide screens, where long lines keep the word gaps + tidy — helped by auto-hyphenation. Below 576px the lines are too short for + justification (rivers of whitespace), so mobile falls back to left-aligned. */ .content p { text-align: justify; + text-align-last: left; /* never stretch a paragraph's final line */ hyphens: auto; -webkit-hyphens: auto; } +@media (max-width: 575.98px) { + .content p { + text-align: left; + hyphens: none; + -webkit-hyphens: none; + } +} + +/* In-content links: underlined so they're distinguishable from body text. + The palette is monochrome (accent ≈ text colour), so colour alone can't + signal a link — the underline does. Heading anchors and image links opt out. */ +.content a:not(.heading-anchor) { + text-decoration: underline; + text-decoration-color: var(--text-muted); + text-decoration-thickness: 1px; + text-underline-offset: 0.18em; +} + +.content a:not(.heading-anchor):hover { + color: var(--text-primary); + text-decoration-color: var(--accent); + text-decoration-thickness: 2px; +} + +/* Links that wrap an image (lightbox) shouldn't draw an underline stub */ +.content a:has(> img) { + text-decoration: none; +} + .content img { border-radius: var(--radius-md); margin: var(--space-md) 0; @@ -847,10 +879,29 @@ img.nav-svg-icon { margin-right: 0.25rem; } +/* Excerpt: 1-2 lines of the page description, clamped so long ones can't + push the list around */ +.post-list-excerpt { + margin: 0.6rem 0 0; + color: var(--text-secondary); + font-size: 0.95rem; + line-height: 1.55; + display: -webkit-box; + -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + overflow: hidden; +} + .post-list-item .post-taxonomy { margin-top: var(--space-sm); } +/* "+N" overflow badge — muted, links to the post (where all tags are shown) */ +.taxonomy-badge-more { + color: var(--text-muted); + border-style: dashed; +} + /* ======================================== POST CARDS (single page / post) ======================================== */ @@ -2043,6 +2094,62 @@ button:focus:not(:focus-visible) { /* Separate the comments widget from the share row so it doesn't feel cramped. */ .utterances { margin-top: var(--space-xl) !important; } +/* ======================================== + PREV / NEXT POST NAVIGATION + ======================================== */ +.post-nav { + display: grid; + grid-template-columns: 1fr 1fr; + gap: var(--space-sm); + margin: var(--space-lg) 0 0; +} + +.post-nav-item { + display: flex; + flex-direction: column; + gap: 0.25rem; + padding: var(--space-sm) var(--space-md); + border: 1px solid var(--border-color); + border-radius: var(--radius-md); + background: var(--bg-surface); + transition: border-color 0.2s ease, background 0.2s ease; +} + +.post-nav-item:hover { + background: var(--bg-hover); + border-color: var(--text-muted); +} + +.post-nav-newer { text-align: right; align-items: flex-end; } + +.post-nav-label { + display: inline-flex; + align-items: center; + gap: 0.3rem; + color: var(--text-muted); + font-size: var(--font-size-xs); + text-transform: uppercase; + letter-spacing: 0.04em; +} + +.post-nav-title { + color: var(--text-primary); + font-weight: 600; + font-size: 0.95rem; + line-height: 1.35; +} + +.post-nav-empty { + border: none; + background: transparent; + pointer-events: none; +} + +@media (max-width: 575.98px) { + .post-nav { grid-template-columns: 1fr; } + .post-nav-empty { display: none; } +} + /* ======================================== RELATED POSTS ======================================== */ diff --git a/languages/en.json b/languages/en.json index 6c19cd4..a865d5f 100644 --- a/languages/en.json +++ b/languages/en.json @@ -29,6 +29,10 @@ "Back to home": "Back to home", "Previous": "Previous", "Next": "Next", + "Older post": "Older post", + "Newer post": "Newer post", + "Post navigation": "Post navigation", + "All tags": "All tags", "Updated": "Updated", "Copy": "Copy", "Copied": "Copied", diff --git a/metadata.json b/metadata.json index 47e5cd7..0f5a64f 100644 --- a/metadata.json +++ b/metadata.json @@ -2,9 +2,9 @@ "author": "spleenftw", "email": "", "website": "https://github.com/Spleenftw/bludit-blowfish", - "version": "1.6.0", - "releaseDate": "2026-06-03", + "version": "1.7.0", + "releaseDate": "2026-07-10", "license": "MIT", "compatible": "3.22.0", - "notes": "A Bludit theme inspired by the Blowfish Hugo theme. Five-theme swatch picker (Light/Dark/Nord/Dracula/Catppuccin), sticky ToC sidebar on articles, image lightbox with zoom, image carousel (```carousel fence), tabbed code blocks (```tabs fence), smart sidebar per page type, and clean responsive typography. v1.3.0: SEO (Open Graph, Twitter Card, JSON-LD, theme-color, cover preload), per-theme syntax highlighting (self-hosted highlight.js), copy-to-clipboard on code blocks, numbered pagination, inline-SVG icons (dropped the Bootstrap Icons webfont), removed jQuery/Bootstrap JS, deferred cached JS bundle, reading progress bar, back-to-top, randomised sidebar selection, lazy-loaded images, accessibility (skip link, ARIA, :focus-visible) and a print stylesheet. v1.4.0: canonical URL, WebSite + BreadcrumbList + author sameAs JSON-LD, og:image:alt / twitter:site+creator, cover-image aspect-ratio (CLS), heading anchor links, prev/next article nav, related posts, share buttons (X/LinkedIn/copy-link), mailto social icon, PWA web app manifest, 'updated on' date, and outbound-link hardening (noopener noreferrer). v1.5.0: callout/admonition boxes (> [!NOTE]/[!TIP]/[!WARNING]/...), code-block header bar with language label + copy button, visual breadcrumbs, custom 404 page, image figure/figcaption from the markdown title, a mobile table-of-contents drawer, and third-party resource hints. v1.6.0: self-hosted Inter (no Google Fonts), client-side search overlay (\"/\" key + navbar button), keyboard shortcuts (/ , g h, t, Esc), a tabbed-code copy button, series navigation (series-* tag), and content typography (keycaps, task-list checkboxes, , external-link icon, footnote/definition-list styling). the navbar search icon only appears once the on-page search box scrolls out of view, and code blocks use a header bar (language + copy) with tighter line-height." + "notes": "A Bludit theme inspired by the Blowfish Hugo theme. Five-theme swatch picker (Light/Dark/Nord/Dracula/Catppuccin), sticky ToC sidebar on articles, image lightbox with zoom, image carousel (```carousel fence), tabbed code blocks (```tabs fence), smart sidebar per page type, and clean responsive typography. v1.3.0: SEO (Open Graph, Twitter Card, JSON-LD, theme-color, cover preload), per-theme syntax highlighting (self-hosted highlight.js), copy-to-clipboard on code blocks, numbered pagination, inline-SVG icons (dropped the Bootstrap Icons webfont), removed jQuery/Bootstrap JS, deferred cached JS bundle, reading progress bar, back-to-top, randomised sidebar selection, lazy-loaded images, accessibility (skip link, ARIA, :focus-visible) and a print stylesheet. v1.4.0: canonical URL, WebSite + BreadcrumbList + author sameAs JSON-LD, og:image:alt / twitter:site+creator, cover-image aspect-ratio (CLS), heading anchor links, prev/next article nav, related posts, share buttons (X/LinkedIn/copy-link), mailto social icon, PWA web app manifest, 'updated on' date, and outbound-link hardening (noopener noreferrer). v1.5.0: callout/admonition boxes (> [!NOTE]/[!TIP]/[!WARNING]/...), code-block header bar with language label + copy button, visual breadcrumbs, custom 404 page, image figure/figcaption from the markdown title, a mobile table-of-contents drawer, and third-party resource hints. v1.6.0: self-hosted Inter (no Google Fonts), client-side search overlay (\"/\" key + navbar button), keyboard shortcuts (/ , g h, t, Esc), a tabbed-code copy button, series navigation (series-* tag), and content typography (keycaps, task-list checkboxes, , external-link icon, footnote/definition-list styling). the navbar search icon only appears once the on-page search box scrolls out of view, and code blocks use a header bar (language + copy) with tighter line-height. v1.7.0: readability pass - underlined in-content links, justified paragraphs with auto-hyphenation (left-aligned on mobile), post-list excerpts from the page description with a 5-tag cap (+N badge), older/newer post navigation under articles, and de-duplication of Open Graph / Twitter Card / canonical tags emitted by plugins." } diff --git a/php/head.php b/php/head.php index 7e4e79b..9de70f1 100644 --- a/php/head.php +++ b/php/head.php @@ -261,5 +261,20 @@ ?> - - + + / / + $bdPluginHead = preg_replace('/]*\b(?:property|name)=["\'](?:og:|twitter:|article:)[^"\']*["\'][^>]*>\s*/i', '', $bdPluginHead); + // duplicate + $bdPluginHead = preg_replace('/]*\brel=["\']canonical["\'][^>]*>\s*/i', '', $bdPluginHead); + echo $bdPluginHead; +?> diff --git a/php/home.php b/php/home.php index 8847bf7..b05b234 100644 --- a/php/home.php +++ b/php/home.php @@ -69,8 +69,18 @@ - - tags(true); $categoryKey = $page->categoryKey(); ?> + + description()); ?> + +

+ + + + tags(true); + $categoryKey = $page->categoryKey(); + $bdMaxTags = 5; // tags shown per post on the list; the rest collapse into "+N" + ?>
@@ -78,9 +88,16 @@ category()); ?> + $tagName) : ?> - + + + + + 0) : ?> + + +
diff --git a/php/page.php b/php/page.php index 7bda1b9..fb60154 100644 --- a/php/page.php +++ b/php/page.php @@ -144,6 +144,48 @@ +isStatic() && !$url->notFound()) { + $bdOlder = null; $bdNewer = null; + try { + global $pages; + if (isset($pages) && method_exists($pages, 'getList')) { + $bdNavKeys = array(); + foreach ($pages->getList(1, 10000, true) as $bdNk) { + $bdNp = new Page($bdNk); + if (!$bdNp->isStatic()) { $bdNavKeys[] = $bdNp; } + } + foreach ($bdNavKeys as $bdNi => $bdNp) { + if ($bdNp->key() === $page->key()) { + if ($bdNi > 0) { $bdNewer = $bdNavKeys[$bdNi - 1]; } + if ($bdNi < count($bdNavKeys) - 1) { $bdOlder = $bdNavKeys[$bdNi + 1]; } + break; + } + } + } + } catch (\Throwable $e) { $bdOlder = null; $bdNewer = null; } +?> + + + + +