Danilo M. [Sat, 18 Apr 2026 13:23:31 +0000 (15:23 +0200)]
style: redesign social share widget with terminal-native aesthetic
Replace generic card + h3 + round buttons with a minimal separator line,
mono comment label, and square btn-share buttons that match the site's
hacker identity. Icons scaled to 22px inside 50x50px touch targets.
Hover/focus states use the site's accent glow pattern.
Danilo M. [Fri, 17 Apr 2026 14:34:03 +0000 (16:34 +0200)]
i18n: add social sharing translation keys (EN + IT)
Add 7 new translation keys to all four i18n files for the social sharing
widget feature: reddit, pinterest, whatsapp, telegram, signal, shareViaEmail,
and linkCopied. Updated both theme and root i18n files in English and Italian.
Danilo M. [Fri, 17 Apr 2026 14:02:40 +0000 (16:02 +0200)]
feat: implement Related Articles sidebar widget
Replaces stub implementation with full related content functionality:
- Uses Hugo's .Site.RegularPages.Related API for smart tagging
- Caps at 5 related articles to keep sidebar compact
- Shows 2-line compact card per entry (title + date, excerpt snippet)
- Left border colored by article type (var(--type-<type>))
- Includes empty state message when no related articles found
- Multilingual support via existing i18n keys
- Theme-aware styling via CSS custom properties
The widget shows:
- Line 1: Title (linked) + · Jan 2006 date inline
- Line 2: First ~10 words of excerpt, small font, muted
Previously was a stub with empty placeholder comment.
Danilo M. [Fri, 17 Apr 2026 13:45:10 +0000 (15:45 +0200)]
week-6: complete 404 and repository pages implementation
Deliverables:
- Implemented language-specific 404 pages (404.en.html, 404.it.html)
* Hugo i18n template pattern for automatic language routing
* Full translation support for all UI strings
* Easter egg modal with interactive experience
* Theme-aware styling (dark/light mode)
* Search functionality and recent articles
- Built Repository page with full Slackware package showcase
* Hero section, quick start guide, installation instructions
* Responsive card grid layout for packages
* GitHub repository links with visit buttons
* Complete i18n translations for all content
* Theme-aware styling throughout
- Integrated Repository menu entry
* Added to main navigation in both languages
* Positioned between Contact and Privacy (weight: 4)
* Added missing i18n translation keys
Testing:
- Verified 404 routing works correctly in Hugo dev server
- Validated all translations display without warnings
- Confirmed theme switching works on both pages
- Tested mobile and desktop layouts
- Menu entries render correctly in all views
Cleanup:
- Removed outdated Week 1-5 documentation
- Archived progress reports in git history
- Retained essential technical documentation
Created 404.en.html and 404.it.html in themes/danix-xyz-hacker/layouts/
following Hugo's standard pattern for language-specific templates. Each
layout uses i18n for translations and links to the correct language-specific
sections. Hugo automatically selects the correct template based on request
language.
Danilo M. [Fri, 17 Apr 2026 10:47:03 +0000 (12:47 +0200)]
build: generate language-specific 404.html files
Created content/en/404.md and content/it/404.md with proper front matter to
generate public/404.html and public/it/404.html files. These are ready for
deployment with proper language-aware redirect rules.
Danilo M. [Fri, 17 Apr 2026 10:24:04 +0000 (12:24 +0200)]
fix: use content-based 404 pages with proper language context
Created language-specific 404 content pages (content/en/404.md and
content/it/404.md) that Hugo renders with the correct language context.
Updated redirect rules and created _default/404.html layout that uses
i18n properly. Now .Lang is set correctly for translation strings.
Danilo M. [Fri, 17 Apr 2026 10:18:40 +0000 (12:18 +0200)]
fix: use language-specific 404 layouts with hardcoded strings
Created 404.en.html and 404.it.html with fully hardcoded English and Italian
text. Hugo automatically routes language-specific requests to the correct
layout. No i18n, no hacks, just simple and direct.
Danilo M. [Fri, 17 Apr 2026 10:03:46 +0000 (12:03 +0200)]
fix: simplify 404 page to use Hugo's standard i18n without hacks
Removed JavaScript language detection and Alpine component. Use simple
static links that work with both languages. Hugo's redirect rules and
i18n system handle language context automatically. No JavaScript hacks.
Danilo M. [Fri, 17 Apr 2026 09:58:02 +0000 (11:58 +0200)]
fix: use language-specific 404 layouts for proper i18n support
Created separate 404.html layouts in themes/danix-xyz-hacker/layouts/it/ and
themes/danix-xyz-hacker/layouts/en/ with hardcoded language-specific links.
Hugo automatically routes language requests to the correct layout, enabling
proper i18n context and translations. Removed generic 404.html and all
JavaScript detection hacks.
Danilo M. [Fri, 17 Apr 2026 09:56:14 +0000 (11:56 +0200)]
fix: detect language server-side in 404 template for proper translations
Added language detection at template level to determine language from permalink
and build translation dictionary. All i18n strings now use language-aware
translations instead of relying on .Lang context which isn't available in
404 handler.
Danilo M. [Fri, 17 Apr 2026 09:54:12 +0000 (11:54 +0200)]
fix: use client-side language detection with redirect rules for 404 navigation
Rely on hugo.toml redirect rules to serve correct 404.html and detect language
from window.location.pathname in notFoundNav() Alpine component. Navigation
links now properly route to Italian (/it/*) or English (/*) sections based on
request URL.
Danilo M. [Fri, 17 Apr 2026 09:49:24 +0000 (11:49 +0200)]
fix: use Hugo content-based 404 pages for proper multilingual support
Created language-specific 404 pages (content/en/404.md and content/it/404.md)
instead of using JavaScript detection. Hugo now properly routes 404 errors to
the correct language context, allowing .Lang and i18n to work correctly.
Removed JS language detection hack.
Danilo M. [Fri, 17 Apr 2026 09:47:04 +0000 (11:47 +0200)]
fix: use client-side language detection for 404 navigation links
Added window.currentLang detection based on request URL path to correctly
route 404 page navigation links for Italian and English versions. Created
notFoundNav() Alpine component to dynamically compute language-aware links
based on detected language.
Danilo M. [Fri, 17 Apr 2026 09:44:47 +0000 (11:44 +0200)]
fix: detect language from permalink instead of .Lang in 404 template
Hugo's .Lang is unreliable in 404 context. Changed to detect language from
the request permalink (checking for /it/ prefix) to properly route Italian
404 pages to Italian content sections.
Danilo M. [Fri, 17 Apr 2026 09:43:08 +0000 (11:43 +0200)]
fix: use language-aware URL construction for 404 navigation links
Updated home, articles, and contact links to properly handle IT/EN language
routing by checking .Lang and building URLs without BaseURL prefix, matching
the pattern used in header.html
Danilo M. [Fri, 17 Apr 2026 09:41:04 +0000 (11:41 +0200)]
fix: easter egg modal visibility by removing conflicting hidden class
Changed modal display from static 'hidden' class to conditional binding that
only applies 'hidden' when showEasterEgg is false. This prevents Tailwind's
display: none !important from overriding the flex layout binding.
Danilo M. [Fri, 17 Apr 2026 09:22:02 +0000 (11:22 +0200)]
fix: improve styling and functionality for 404 and Repository pages
- 404.html: Move x-data directive to wrap entire content including modal, fixing Easter egg button click functionality. Add border, glow, and bg styling to main container.
- repository/list.html: Add border, glow, rounded, and bg styling to article container for consistency with other pages.
- Both pages now have consistent visual styling with borders, glows, and proper background colors.
Danilo M. [Fri, 17 Apr 2026 09:18:19 +0000 (11:18 +0200)]
Fix styling issues on 404 and Repository pages
- Add proper container styling (mx-auto, px-4, py-12) to main content wrappers matching single.html pattern
- Replace gray color hardcodes with theme-aware CSS variables:
- bg-gray-50/gray-900 → bg-bg/50 with hover:bg-bg/70 for article cards
- text-gray-600/gray-400 → text-text-dim for text
- border-gray-300/gray-700 → border-border for borders
- bg-gray-200/gray-800 → bg-border/20 for tags
- Fixes color inconsistency in both light and dark modes
- Ensures 404 latest articles and Repository tags use theme colors instead of fixed gray
All comprehensive tests pass:
- Repository page renders title, subtitle, and all content sections
- Quick Start, Installation, Usage, and Available Packages sections display correctly
- GitHub SlackBuild repository cards display in responsive grid (1-2-3 columns)
- All 3 example repositories render with correct titles, descriptions, tags, and GitHub links
- Code blocks are keyboard accessible with proper syntax highlighting
- Dark/light mode supports with proper Tailwind dark: classes
- Images lazy-load with proper alt text
- Responsive design tested: mobile (320px), tablet (768px), desktop (1200px)
- Italian and English translations working correctly
- Keyboard navigation fully functional (Tab, Enter, external link security attributes)
Layout fix: Changed repository layout from single.html to list.html to properly render _index.md section pages
Danilo M. [Fri, 17 Apr 2026 07:27:53 +0000 (09:27 +0200)]
feat: verify semantic HTML - replace div with button in toast-close
Replace div element with actual button element for toast notification close
control. Adds type='button' and aria-label for accessibility. Maintains all
Alpine.js functionality via @click handler.
WCAG 2.1 AA compliance: 1.3.1 Info and Relationships
Danilo M. [Fri, 17 Apr 2026 07:27:05 +0000 (09:27 +0200)]
feat: ensure all form inputs have associated labels (for/id attributes)
- Added id to checkbox: agree-terms
- Added id/for to checkboxes: interest-tech, interest-design
- Added id/for to radio buttons: preference-option-a, preference-option-b
- All 13 form inputs now have matching label associations
- Improves WCAG 2.1 AA compliance (3.3.2 Labels or Instructions)
Danilo M. [Fri, 17 Apr 2026 07:26:26 +0000 (09:26 +0200)]
feat: ensure i18n-based aria-labels on all icon-only buttons
Standardize aria-labels across form-components, hamburger-menu, and header
partials to use i18n keys for multilingual support. Modal close buttons now
consistently use the 'closeMenu' i18n key across all three modals, matching
the accessibility pattern used for menu and theme toggle buttons.
- form-components.html: Update modal close buttons (alert, confirm, content)
- hamburger-menu.html: Already has aria-label with i18n
- header.html: Theme toggle and hamburger menu already have aria-labels
Danilo M. [Fri, 17 Apr 2026 07:25:33 +0000 (09:25 +0200)]
feat: enhance modal focus trap with JavaScript and ARIA attributes
Implements focus trap function that cycles Tab/Shift+Tab within modal boundaries,
adds ARIA attributes (role, aria-modal, aria-labelledby) for accessibility
compliance, and integrates focus initialization on modal display.
- Focus trap prevents tab escape from modal dialog
- ARIA attributes: role=dialog, aria-modal=true, aria-labelledby linking title
- Backdrop marked aria-hidden=true to exclude from accessibility tree
- Close buttons have aria-label for screen readers
- Focus initialization calls createFocusTrap on modal show
Danilo M. [Fri, 17 Apr 2026 07:24:39 +0000 (09:24 +0200)]
feat: add prefers-reduced-motion support (disable animations when motion-reduced)
Adds a CSS media query that respects user motion preferences by:
- Disabling all animations and transitions when prefers-reduced-motion: reduce
- Using !important to override all animation/transition declarations
- Ensuring focus-visible outline remains visible for keyboard navigation
This improves accessibility for users with motion sensitivity.
Danilo M. [Thu, 16 Apr 2026 14:49:36 +0000 (16:49 +0200)]
fix: header sticky positioning regression
Changed header from sticky to fixed positioning and added proper margin offset
(mt-20) to main element to prevent content from being covered. The fixed header
now stays at the top during scroll while content renders below it properly.
- Fixed header: changed from sticky to fixed with left-0 right-0 full width
- Main spacing: added mt-20 margin-top with relative z-10 preserved
- Restored z-index layering for content positioning
Also added Week 3 completion documentation and Week 4 planning files:
- WEEK3-COMPLETION.md: Comprehensive audit of Week 3 implementation
- WEEK3-4-TRANSITION.md: Handoff document with git workflow
- WEEK4-PLAN.md: Full technical roadmap for Week 4 forms & interactions
- PROGRESS-STATUS-WEEK4.txt: Updated cumulative progress tracking
- Updated HANDOFF.md with Week 3 summary and Week 4 readiness
Danilo M. [Thu, 16 Apr 2026 14:29:11 +0000 (16:29 +0200)]
fix: logo link now respects current language
The header logo link was hardcoded to '/' which always returned to the
English homepage when clicked from Italian pages. Now uses language-aware
routing: IT pages link to /it/, EN pages link to /
Danilo M. [Thu, 16 Apr 2026 14:23:50 +0000 (16:23 +0200)]
feat: make breadcrumb navigation multilingual with proper links
- Added language-aware breadcrumb links (IT uses /it/ subdir, EN uses root)
- Added 'home' translation key to both i18n files
- Breadcrumb now displays translated labels and correct URLs for each language
Danilo M. [Thu, 16 Apr 2026 14:21:15 +0000 (16:21 +0200)]
fix: breadcrumb navigation now renders in article pages
The breadcrumb partial was being called but producing no output. Investigation
revealed the issue: Hugo was using layouts/_default/single.html instead of
layouts/articles/single.html. Added the breadcrumb partial call to the actual
layout being used (_default/single.html), fixing the missing navigation.
Danilo M. [Thu, 16 Apr 2026 14:01:56 +0000 (16:01 +0200)]
fix: add x-cloak to prevent menu flash on page load
- Add [x-cloak] { display: none } CSS rule
- Add x-cloak attribute to menu overlay div
- This hides the menu until Alpine.js initializes
- Prevents the menu from appearing briefly on page refresh/load
- Rebuild CSS: main.min.css updated
Danilo M. [Thu, 16 Apr 2026 13:59:51 +0000 (15:59 +0200)]
fix: prevent menu flicker when navigating to new page
- Add beforeunload event listener to close menu before page navigation
- This prevents the menu from briefly appearing on the new page
- Menu state is explicitly set to false before unload
- Rebuild CSS: main.min.css updated
Danilo M. [Thu, 16 Apr 2026 13:51:55 +0000 (15:51 +0200)]
fix: hamburger menu click handler and horizontal scroll issues
- Improve hamburger menu JS with better error handling and console warnings
- Add preventDefault() to button click handlers for reliability
- Handle document ready state check (in case script runs before DOMContentLoaded)
- Add overflow-x-hidden to html and body to prevent horizontal scrolling on mobile
- Rebuild CSS: main.min.css updated
Danilo M. [Thu, 16 Apr 2026 13:29:38 +0000 (15:29 +0200)]
feat: add breadcrumb navigation component
- Create breadcrumb.html partial with Home > Articles > Title structure
- Support both English and Italian language versions
- Add breadcrumb and breadcrumb-separator CSS classes
- Integrate breadcrumb into article detail pages
- Rebuild CSS: main.min.css updated
Danilo M. [Thu, 16 Apr 2026 12:52:16 +0000 (14:52 +0200)]
feat: import 36 articles with assets and create supporting shortcodes
- Migrate all English articles from old site to content/en/articles/
- Organize article assets in static/uppies/year/month/ structure
- Create Italian article stubs with draft=true status
- Add 7 new shortcodes: strike, em, dropcap, figure, highlight, img, youtube, gal-img
- Update article image paths to reference /uppies/ locations
- All 36 articles now build successfully without errors