Full deployment history for this project.
🎨 Palette: Accessibility improvements for project toggles and dynamic content 💡 What: Added ARIA attributes to the mobile menu and project view toggles, and made the project count dynamically announce changes. 🎯 Why: Screen readers were previously unaware of the active list/grid view, and wouldn't read out changes to the filtered project counts. The mobile menu lacked explicit accessibility controls as well. ♿ Accessibility: - Added `aria-controls` and `aria-expanded` to the mobile menu button. - Added `id="mobile-menu"` to the mobile menu container. - Wrapped the grid/list toggles in a `role="group"` with an `aria-label`. - Added explicit `aria-pressed` state to the view toggles. - Added `aria-live="polite"` to the dynamic project results count paragraph.
🎨 Palette: Enhance header keyboard accessibility and add missing ARIA labels - Added `aria-label="GitHub"` to the mobile GitHub icon link to ensure screen readers announce it properly. - Applied consistent `focus-visible` styles (`focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50 rounded-sm`) to all navigation links and tags within the header to improve keyboard navigation accessibility. - Added a learning entry to `.jules/palette.md` noting the importance of ensuring interactive elements and icon links have proper focus states and ARIA labels, especially across responsive breakpoints.
🎨 Palette: Improve empty state and view toggle UX/a11y - Added visual anchor (Search icon) and helpful messaging to projects empty state - Improved screen reader accessibility of grid/list view toggles using `role="group"` and `aria-pressed` attributes - Logged UX learnings in `.jules/palette.md`
🎨 Palette: Add keyboard shortcut to focus search input - Added a document-level event listener that focuses the search input when the `/` key is pressed. - Provided a visual hint (`/`) inside the empty search input field to educate users. - Replaced the visual hint with the standard clear button when text is entered. - Appended a new critical learning entry to `.jules/palette.md` detailing the benefit of inline keyboard shortcuts for feature discoverability.
🎨 Palette: Improve keyboard navigation and screen reader support 💡 What: Added `aria-live` regions for dynamic project counts, `aria-expanded` and `aria-controls` for mobile menu, and explicit `focus-visible` styling for navigation links and project cards. 🎯 Why: Enhances screen reader experience when filtering projects and makes keyboard navigation across the site clear and accessible. ♿ Accessibility: - Dynamic count announcements via `aria-live="polite"` - Correct ARIA attributes for mobile menu toggle - Clear visual focus states using `focus-visible` utility classes
Merge pull request #9 from mbarbine/bolt-performance-skunkworks-optimization-16937110298850749122 ⚡ Bolt: Eliminate matrix rain layout thrashing and hydration mismatch
⚡ Bolt: Extract skunkworks matrix generation to useEffect to prevent hydration layout thrashing Co-authored-by: mbarbine <3211492+mbarbine@users.noreply.github.com>
UX: Improve mobile menu accessibility and UX - Add scroll lock to body when mobile menu is open. - Add `aria-expanded` and `aria-controls` to menu toggle button. - Add `id` to menu container for proper ARIA relationship. - Add `aria-label` to icon-only GitHub link. - Close menu when GitHub link is clicked. Co-authored-by: mbarbine <3211492+mbarbine@users.noreply.github.com>
🎨 Palette: Make hero scroll indicator interactive and improve mobile menu a11y - Transformed the purely decorative hero section scroll down arrow into a fully functional, keyboard-navigable anchor link. - Added hover and focus visible states to the scroll indicator. - Improved mobile menu accessibility by replacing the static `aria-label` with dynamic ones and adding `aria-expanded` state. - Journaled learning about decorative scroll indicators to `.jules/palette.md`. Co-authored-by: mbarbine <3211492+mbarbine@users.noreply.github.com>
🛡️ Sentinel: [MEDIUM] Add security headers to Next.js config Co-authored-by: mbarbine <3211492+mbarbine@users.noreply.github.com>
Merge pull request #1 from mbarbine/bolt/optimize-image-and-filter-92038006111047287 ⚡ Bolt: Optimize ProjectCard images and useMemo filter
⚡ Bolt: Optimize ProjectCard images and useMemo filter - Added `sizes` prop to `next/image` in `ProjectCard` to prevent downloading `100vw` images when rendered in smaller grid columns. Reduces image payload by ~50-70% on desktop viewports. - Extracted `searchQuery.toLowerCase()` outside the `.filter` loop in `ProjectsSection` to prevent O(N) redundant string allocations. - Added early returns in the `.filter` loop to skip expensive string matching for items failing type/status checks. - Created `.jules/bolt.md` to document the learning about Next.js `<Image fill />` behavior without the `sizes` prop. - Added `.next/` and `node_modules` to `.gitignore`. Co-authored-by: mbarbine <3211492+mbarbine@users.noreply.github.com>
chore: sync project with latest changes from main Update project files and assets to latest main branch. Co-authored-by: Michael Barbine <3211492+mbarbine@users.noreply.github.com>
feat: sync changes from main to v0-barbine-portfolio-webby Update project files, components, and assets from main branch. Co-authored-by: Michael Barbine <3211492+mbarbine@users.noreply.github.com>