Skip to content

v4.0.0
Compare
Choose a tag to compare
@github-actions github-actions released this 04 May 11:33
· 7 commits to main since this release
v4.0.0
79a9ff3
This commit was created on GitHub.com and signed with GitHub’s verified signature.
GPG key ID: B5690EEEBB952194
Verified
Learn about vigilant mode.

Enhanced Accessibility, Developer Experience & UX

This major release transforms the Accessible Astro Starter with a complete overhaul of the design system, significant accessibility improvements, and enhanced developer experience. We've introduced the OKLCH color system, added the highly readable Atkinson Hyperlegible font, and created several new components focused on content presentation and accessibility testing. The project structure has been optimized for better performance, and TypeScript support has been improved throughout. This update represents a substantial step forward in creating accessible, performant, and visually appealing Astro websites.

🎯 Key Highlights

  • Complete redesign with OKLCH color system and Atkinson Hyperlegible font
  • New components including Color Contrast Checker and interactive content elements
  • Enhanced blog and portfolio templates with rich media support
  • Improved TypeScript integration with proper interfaces and types
  • Updated to Astro 5.7.5 and Tailwind CSS 4.0

🎨 Design System Updates

  • Replaced previous color system with OKLCH colors using light-dark() functions (#105, #130)
  • Added Atkinson Hyperlegible font family for improved readability
  • Created a more accessible dark mode with proper color contrast
  • Added <kbd> element styling for better documentation (#136)
  • Added text-wrap: balance to headings and text-wrap: pretty to content (#128)
  • Modernized CSS with logical properties and expanded custom properties (#135)
  • Moved all :root based styles to dedicated _root.scss file (#134)
  • Improved button and hyperlink styling

✨ New Features

  • Added ColorContrast component for accessibility testing
  • Created PageHeader component for consistent page titles
  • Added Logo component for standardized branding
  • Added ExternalLink component with proper attributes (#123)
  • Added BlockQuote component for content citations
  • Created BreakoutImage component for full-width images
  • Added SocialShares component for blog post sharing
  • Designed custom templates for blog posts and portfolio projects (#126)
  • Added import aliases for cleaner component references (#132)
  • Added an Accessibility Statement template page

🔄 Component Updates

Accessibility & UX

  • Footer: Enhanced structure with additional information (#131)
  • Header: Cleaned up structure and improved screen reader support

Content Presentation

  • Blog Components: Added featured images and author details
  • Blog Archive: Enhanced layout with card-based design
  • Blog Single: Added social sharing and breakout images
  • Portfolio: Migrated from MD to MDX for richer content
  • Portfolio Projects: Enhanced with image galleries and descriptions
  • AvatarGroup: Added for showcasing community members

💻 Developer Experience

  • Added TypeScript interfaces and prop typing (#115, #121)
  • Updated to Tailwind CSS 4.0 (#114)
  • Updated to Astro 5.7.5 (#114)
  • Updated accessible-astro-components to version 4.1.1
  • Enhanced CSS architecture with improved base, utility, and mixin files
  • Improved project structure for better maintainability

🐛 Bug Fixes

  • Fixed missing bullet/marker on lists (#122)
Assets 2
Loading