Commit Graph

24 Commits

Author SHA1 Message Date
svemagie
e8ba3b9ae6 feat: nested tags (Obsidian-style) for categories system
Adds hierarchical tag support using "/" separator (e.g. "tech/programming/js").
- New filters: nestedSlugify, categoryMatches, categoryBreadcrumb,
  categoryGroupByRoot, categoryDirectChildren
- categories collection auto-generates ancestor pages for nested tags
- categories.njk: breadcrumb nav, sub-tags section, ancestor-aware post matching
- categories-index.njk: grouped tree view (root + indented children)
- categories widget: shows root tags only with child count badge
- All category links updated from slugify → nestedSlugify (backward-compatible)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-03-15 10:56:34 +01:00
svemagie
04b6ed1217 feat: derive gardenStage from nested tags (garden/cultivate)
- eleventyComputed in content.11tydata.js resolves gardenStage from
  category/tags at build time — no explicit gardenStage frontmatter needed
- withoutGardenTags filter strips garden/* from category pill rendering
- categories collection excludes garden/* entries (no phantom category pages)
- All list templates and post layout use withoutGardenTags filter
2026-03-15 09:41:18 +01:00
svemagie
01a36d4163 feat: show garden badge in all post list views and overviews
- garden-badge.njk now resolves stage from post.data.gardenStage in
  list contexts (no set required), or gardenStage in post page context
- Badge added after categories in: blog, articles, notes, photos,
  bookmarks, likes, replies, reposts, recent-posts section
- Badge is clickable, links to /garden/#<stage>
2026-03-15 09:04:29 +01:00
svemagie
d2fa2fb809 fix(a11y): improve colour contrast and fix semantic heading elements
- Bump all post-type label colours from -600 to -700 (light) and
  -400 to -300 (dark) in blog.njk to meet WCAG AA/AAA contrast
  ratios (green/teal/sky labels were failing AA at ~3-4:1)
- Replace four <p role="heading" aria-level="2"> in footer with
  real <h2> elements for robust screen-reader support
- Bump footer link text from surface-600 to surface-700 (light)
  and surface-400 to surface-300 (dark)
- Update hero.njk accent job-title and "Read more" link from
  accent-600 to accent-700 / accent-400 to accent-300
- Update Tailwind typography prose link token from accent-600/400
  to accent-700/300
- Tighten .p-category and .post-meta base styles in tailwind.css
  (surface-600→700 light, surface-300→200 / surface-400→300)
- Bump hashtag link colours in tailwind.css (accent-600→700)
- Fix sparkline colour in notes.njk (teal-600→700 / teal-400→300)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-03-14 15:28:43 +01:00
svemagie
5ee87e11a9 feat: make tags clickable in all overview/listing pages
Replace plain <span class="p-category"> with <a href="/categories/{slug}/"> across all post listing pages and the recent-posts component.

Affected: articles, blog, notes, likes, reposts, replies, bookmarks, photos, recent-posts.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
2026-03-12 12:13:24 +01:00
svemagie
9088f3b01d Revert "fix: hide private and where/Loc notes from public overviews and collections"
This reverts commit f04c48e3cb.
2026-03-12 12:01:13 +01:00
svemagie
f04c48e3cb fix: hide private and where/Loc notes from public overviews and collections 2026-03-12 11:28:23 +01:00
svemagie
182d0fd26e feat(listings): hide unlisted posts from blog and notes 2026-03-08 16:52:54 +01:00
svemagie
44eca63f10 Merge remote-tracking branch 'theme-upstream/main' 2026-03-07 23:22:52 +01:00
svemagie
519a7cb36f fix: render notes with content.html if present (web interface compatibility) 2026-03-07 21:00:36 +01:00
Ricardo
1026d728af a11y: fix all remaining WCAG 2.1 AA issues from audit round 2
- Focus traps for fediverse modal and lightbox dialogs (C3, C4)
- Search widget input label (C5)
- Blogroll widget tab ARIA semantics (C6)
- Footer social links "opens in new tab" warning (S5)
- Reply context aria-label on aside (S8)
- Photo alt text fallback includes post title (S10)
- Post categories use list markup (M3)
- Funkwhale now-playing bars aria-hidden (M7)
- TOC uses static Tailwind classes instead of dynamic (M9)
- Footer headings use proper aria heading roles (M15)
- Header anchor opacity increased to 1 for contrast (M18)
- Custom HTML widgets labeled as regions (M19)
- Empty collection placeholder role=status (M22)
- GitHub widget loading state announced (N5)
- Subscribe icon contrast improved (m1)
- All Permalink links have aria-label with post context (m3)
- Podroll audio element aria-label (m4)
- Obfuscated email link aria-label (m6)
- Fediverse follow button uses aria-label (M10)

Score: 53.6% → 92.9% (26/28 WCAG criteria passing)

Confab-Link: http://localhost:8080/sessions/0ec83454-d346-4329-8aaf-6b12139bf596
2026-03-07 19:34:25 +01:00
Ricardo
e236b4bf65 a11y: comprehensive WCAG 2.1 Level AA accessibility audit
- Add skip-to-main-content link and main content ID target
- Add prefers-reduced-motion media queries for all animations
- Enhance visible focus indicators (2px offset, high-contrast ring)
- Replace ~160 text-surface-500 instances with text-surface-600/dark:text-surface-400
  for 4.5:1+ contrast ratio compliance
- Add aria-hidden="true" to ~30+ decorative SVG icons across sidebars/widgets
- Convert facepile containers from div to semantic ul/li with role="list"
- Add aria-label to icon-only buttons (share, sort controls)
- Add sr-only labels to form inputs (webmention, search)
- Add aria-live="polite" to dynamically loaded webmentions
- Add aria-label with relative+absolute date to time-difference component
- Add keyboard handlers (Enter/Space) to custom interactive elements
- Add aria-label to nav landmarks (table of contents)
- Fix modal focus trap and dialog accessibility
- Fix lightbox keyboard navigation and screen reader announcements

Confab-Link: http://localhost:8080/sessions/edb1b7b0-da66-4486-bd9c-d1cfa7553b88
2026-03-07 18:58:08 +01:00
Ricardo
db75bd05ea fix: give each post type a unique domain color
Articles, notes, and bookmarks were all sharing amber, which
defeats the purpose of per-type color identity.

New complete color map (7 unique colors):
- Articles: indigo (long-form writing)
- Notes: teal (short posts)
- Bookmarks: amber (saved links)
- Likes: red (heart)
- Replies: sky (conversation)
- Reposts: green (sharing)
- Photos: purple (visual)

Updated across collection pages, blog.njk mixed view,
recent-posts widget (now shows type-specific icons and colors
for all 7 types), and design system documentation.

Confab-Link: http://localhost:8080/sessions/0ec83454-d346-4329-8aaf-6b12139bf596
2026-03-07 18:03:06 +01:00
Ricardo
7d8b039ba7 fix: harmonize domain colors across all collection templates
Each post type now has a unique, consistent color applied across
sparkline, card border, icon, label, hover state, and permalink:
- Articles/Notes/Bookmarks: amber
- Likes: red (was rose)
- Replies: sky (was rose)
- Reposts: green (was rose)
- Photos: purple

Replaces generic accent/rose colors with type-specific colors in
blog.njk mixed-type view and all individual collection pages.

Confab-Link: http://localhost:8080/sessions/0ec83454-d346-4329-8aaf-6b12139bf596
2026-03-07 17:48:49 +01:00
Ricardo
0da3780c77 fix: sparkline sizing — use div wrapper instead of span in flex context
The sparkline SVG containers were using <span> elements as flex items.
While a span's outer display is blockified in flex context, its inner
display remains inline, causing SVG width:100% to resolve against the
inline content width (~22px) instead of the flex-allocated width (~670px).
Switching to <div> provides block inner display, allowing the SVG to
fill the available space correctly.

Confab-Link: http://localhost:8080/sessions/0ec83454-d346-4329-8aaf-6b12139bf596
2026-03-07 17:05:52 +01:00
Ricardo
f5e6dfbc8a fix: sparkline width regression, dark mode pill contrast, interaction icons
- Sparkline: change from fixed 120/180px to fluid width (flex-1 min-w-0)
  filling the content area next to page titles across all 8 post type pages
- Blog filter: fix dark mode active pill contrast (dark:bg-accent-700)
- Interactions: replace wrong share icon with correct ActivityPub logo
- Interactions: add IndieWeb webmention provenance badge (globe icon)
- Interactions: improve platform detection (Bridgy Fed, more Fediverse instances)

Confab-Link: http://localhost:8080/sessions/0ec83454-d346-4329-8aaf-6b12139bf596
2026-03-07 16:31:30 +01:00
Ricardo
dacf819b99 fix(dates): add font-mono text-sm to all <time> elements
System convention: every rendered date gets font-mono class.
CSS base layer handles font-family, but classes ensure consistency
and proper text-sm sizing across all templates.

Confab-Link: http://localhost:8080/sessions/0ec83454-d346-4329-8aaf-6b12139bf596
2026-03-07 15:59:17 +01:00
Ricardo
14dcfba50a feat: fix sparkline calculation, redesign with domain colors, add post-graph
- Fix sparkline downward trend by extrapolating partial current month
- Redesign sparkline SVG with gradient fill and responsive sizing
- Apply domain-specific colors (amber/rose/emerald/purple) via currentColor
- Add eleventy-plugin-post-graph for GitHub-style contribution grids
- Homepage: posting activity graph in Tier 2 default layout
- AI page (/ai/): stats dashboard + AI-involved posts graph injected via layout
- New filters: aiPosts (filter by AI level), aiStats (total/count/percentage)

Confab-Link: http://localhost:8080/sessions/956f4251-b4a9-4bc9-b214-53402ad1fe63
2026-03-05 14:21:27 +01:00
Ricardo
155816a0bc feat: replace all primary (blue) with contextual colors across entire theme
Eliminate monotonous blue by replacing ~290 primary- references in 60 files
with semantically appropriate colors:

- accent (teal): links, CTAs, buttons, tabs, focus rings, spinners
- purple: Funkwhale/music, photos, Mastodon/fediverse
- surface (neutral): GitHub, dates/metadata, info boxes
- amber: bookmarks, blogroll categories
- red: likes
- green: reposts
- sky: replies
- orange: RSS/feeds, podcasts
- #0085ff: Bluesky brand
- #a730b8: Mastodon brand

Also updates prose link colors in tailwind.config.js, pagefind UI
primary color to teal, and client-side JS color references.

Confab-Link: http://localhost:8080/sessions/bd3f7012-c703-47e9-bfe2-2ad04ce1842d
2026-03-04 12:50:19 +01:00
Ricardo
91ed859a35 feat: harmonize blog views with homepage UI/UX
Add color-coded left borders to post cards on all blog listing and
category pages, and make sidebar widgets collapsible with localStorage
persistence on both listing and single-post sidebars.
2026-02-24 16:58:46 +01:00
Ricardo
f7bc5d9112 feat: add posting frequency sparklines to all post type pages
Each collection page (articles, notes, photos, bookmarks, likes,
replies, reposts) now shows its own sparkline next to the heading,
showing that specific post type's frequency over the last 12 months.
2026-02-18 12:02:49 +01:00
rmdes
32aea5ace9 feat: neutralize theme for fresh deployments
Strip personal data from templates so the theme ships clean for any
deployer. Collection pages now use generatePageOnEmptyData so empty
post types show encouraging placeholders instead of 404s. Navigation
is conditional on enabled post types and installed plugins. Sidebar
widgets split into individual components with plugin-aware visibility.
Slashes page explains required plugins for root-level page creation.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-08 15:16:29 +01:00
Ricardo
96182cb1e4 fix: comprehensive mobile responsive design audit
- Make all headings responsive (text-2xl sm:text-3xl pattern)
- Make all section headings responsive (text-xl sm:text-2xl)
- Add responsive margins (mb-6 sm:mb-8 pattern)
- Fix flex layouts to stack on mobile (flex-col sm:flex-row)
- Make images responsive (w-20 sm:w-24 pattern)
- Add responsive padding (p-4 sm:p-6)
- Improve grid gaps for mobile (gap-3 sm:gap-4)
- Add CSS utilities for table overflow and touch scrolling
- Restyle 404 page with proper responsive design

Files updated: 22 template and CSS files across all pages

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
2026-01-24 15:48:23 +01:00
Ricardo
2b225197b4 Initial commit: Indiekit Eleventy theme 2026-01-24 12:13:34 +01:00