feat(filters): Complete filter consistency and interactive UX improvements#17
Merged
JacksonR64 merged 35 commits intomainfrom Jun 17, 2025
Merged
feat(filters): Complete filter consistency and interactive UX improvements#17JacksonR64 merged 35 commits intomainfrom
JacksonR64 merged 35 commits intomainfrom
Conversation
…ck with GitHub-inspired soft colors - Update all components to use CSS custom properties - Much more pleasant and readable dark mode experience
…ure next-themes - Update CSS to use .dark class - Create ThemeToggle component - Update core components for dark mode
…rdcoded gray colors with CSS custom properties - Update text colors to use muted-foreground variables - Fix Past event badges to use proper theming
…pages - Move Navigation component to root layout - Remove duplicate navigation from HomePageClient - Theme toggle now appears on every page
… Navigation to root layout - Remove duplicate imports - Fix component paths - Theme toggle now on every page
…duplicate Navigation components from all pages - Fix hardcoded colors for proper dark mode support - Update components with CSS custom properties - Fix about/contact page layouts and add Footer - Fix authentication error handling - All dark mode and navigation issues resolved
…eplace long sort labels with compact versions using arrows - Add tooltip support to show full descriptions on hover - Fix text wrapping issue in sort filter dropdown - Improve accessibility and follow established UX patterns
…ed colors with CSS custom properties - Update button and dropdown backgrounds for dark mode - Update text colors to use foreground/muted-foreground - Update borders to use border custom property - Ensure proper contrast and readability in dark mode
…g-white/bg-gray-50 with bg-card/bg-muted - Update text colors to use foreground/muted-foreground - Fix ticket card backgrounds for proper dark mode display - Update borders to use border custom property - Ensure consistent theming across all ticket components
…structure quantity controls and subtotal to use vertical stacking - Add border separator between quantity controls and subtotal - Use flex layout for subtotal to prevent text overflow - Ensure proper spacing and alignment within ticket cards - Fix layout issues when subtotal text extends beyond card width
…ose-gray with proper CSS custom properties - Update About This Event section for better dark mode readability - Fix hardcoded colors in event description display
…- Update StaffDashboard status badges and text colors - Fix staff pages (create/edit event) backgrounds and headers - Update LoadingSpinner to use CSS custom properties - Modernize Badge component with proper variant system - Fix Dialog component backgrounds, borders, and text colors - Update Alert component with proper variant system - Fix Textarea component for consistent theming - Replace all hardcoded grays with semantic color tokens - Ensure consistent dark mode support across all UI components
…sive color improvements - Fixed Event Details section hardcoded gray colors causing invisible text in dark mode - Updated EventDetailClient.tsx Event Stats section to use semantic color tokens - Fixed CheckoutForm.tsx hardcoded colors for better dark mode support - Updated EventCard.tsx text colors throughout all card variants - Replaced text-gray-* classes with text-foreground/text-muted-foreground - Improved form inputs with proper dark mode border and background colors - Enhanced payment success section with dark mode variants - All changes use CSS custom properties for proper theme adaptation
… EventList empty state, loading skeletons, and timeline connector colors - Updated EventListWithHeader and GroupedEventList text colors - Fixed SortControl dropdown with proper dark mode support including tooltips - Updated EventFilters search icon and summary text colors - Replaced all hardcoded gray colors with semantic CSS custom properties - All components now properly adapt to dark/light theme changes
…ode improvements across staff dashboard, app pages, and demo components with semantic color tokens replacing hardcoded gray colors following SOLID principles
…ated reusable FilterButton, FilterDropdown, FilterContainer components - Refactored all filter components to use modular architecture - Fixed text color consistency issues in DateFilter - Replaced harsh border-input with softer border-border styling - Applied DRY principles to eliminate code duplication - Fixed TypeScript aria-haspopup type issues - Build status: Passing - Session handoff: Ready for continuation
…filter text color consistency across all 4 filter components by fixing DateFilter's manual color override. Removed manual text color classes from DateFilter span element. All filters now consistently use FilterButton's built-in text color handling. Maintains SOLID principles and DRY architecture. Build Status: Production build passing. Completes Filter Consistency Task.
…tency - Updated all filter button text to use text-muted-foreground for softer appearance in dark mode. Changed FilterButton placeholder logic and added text-muted-foreground to all filter content spans. Filters now match grey tone used in search box and other page elements. Improves visual harmony and reduces bright white text in dark mode. Build Status: Production build passing.
…ns - Added hover:text-foreground to all filter button text for grey to white transition on hover. Added transition-colors for smooth animations matching My Events button behavior. Filters now have polished interactive states that match top navigation UX. Updated FilterButton component and all 4 individual filter components. Build Status: Production build passing.
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
🚀 PR Quick Check Results
This is a quick check for immediate feedback. Full testing will run in the main CI pipeline. |
… - Updated vercel.json with deployment protection settings - Added production-deploy workflow that waits for CI success - Disabled automatic main branch deployment in Vercel - Added GitHub integration settings for better PR feedback - Ensures only successful CI runs trigger production deployments
🚀 PR Quick Check Results
This is a quick check for immediate feedback. Full testing will run in the main CI pipeline. |
…ct functionality - Critical Google Calendar fixes: removed excessive debug logs, implemented proper disconnect API call, cleaned up performance issues. Root causes resolved: useGoogleCalendarStatus auto-running with verbose logging, incomplete handleDisconnect function causing errors. Build passes, critical MVP feature restored.
… callback incorrectly using Google Calendar tokens as Supabase auth tokens. All Google Calendar functionality should now work properly.
🚀 PR Quick Check Results
This is a quick check for immediate feedback. Full testing will run in the main CI pipeline. |
🚀 PR Quick Check Results
🎉 All quick checks passed! Your PR is ready for full CI pipeline. This is a quick check for immediate feedback. Full testing will run in the main CI pipeline. |
…memory caching for RSVP checks (5 minutes) - Add in-memory caching for event details (10 minutes) - Optimize database queries with specific field selection - Improve RSVP route with query optimization and result limits - Fix TypeScript build errors from timeout wrapper - Clean up duplicate email sending logic - Add cache invalidation on data updates/deletes Build Status: ✅ PASSING, Test Status: ✅ All 93 tests passing, Dev Server: ✅ Running successfully
🚀 PR Quick Check Results
🎉 All quick checks passed! Your PR is ready for full CI pipeline. This is a quick check for immediate feedback. Full testing will run in the main CI pipeline. |
…holds and improved config
🚀 PR Quick Check Results
This is a quick check for immediate feedback. Full testing will run in the main CI pipeline. |
🚀 PR Quick Check Results
This is a quick check for immediate feedback. Full testing will run in the main CI pipeline. |
🚀 PR Quick Check Results
This is a quick check for immediate feedback. Full testing will run in the main CI pipeline. |
🚀 PR Quick Check Results
🎉 All quick checks passed! Your PR is ready for full CI pipeline. This is a quick check for immediate feedback. Full testing will run in the main CI pipeline. |
🚀 PR Quick Check Results
🎉 All quick checks passed! Your PR is ready for full CI pipeline. This is a quick check for immediate feedback. Full testing will run in the main CI pipeline. |
…ding hierarchy, remove duplicate h1 elements, replace hardcoded colors with CSS custom properties, improve color contrast for category pills
🚀 PR Quick Check Results
🎉 All quick checks passed! Your PR is ready for full CI pipeline. This is a quick check for immediate feedback. Full testing will run in the main CI pipeline. |
…--primary from #3b82f6 to #1d4ed8 for better contrast ratio - Addresses Lighthouse color-contrast audit failures - Ensures WCAG AA compliance for text on white backgrounds
🚀 PR Quick Check Results
🎉 All quick checks passed! Your PR is ready for full CI pipeline. This is a quick check for immediate feedback. Full testing will run in the main CI pipeline. |
…ing - Create dedicated performance-profiling.yml workflow for deep analysis - Remove expensive resource profiling from main performance-testing.yml - Reduce PR pipeline time from ~2-3 minutes to ~30 seconds per check - New workflow runs nightly at 2 AM UTC with manual trigger options
🚀 PR Quick Check Results
🎉 All quick checks passed! Your PR is ready for full CI pipeline. This is a quick check for immediate feedback. Full testing will run in the main CI pipeline. |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
🎯 Filter Component Consistency & Interactive UX Complete
📋 Summary
This PR resolves all filter text color inconsistencies and implements polished interactive states matching the top navigation UX. The implementation follows SOLID principles with a fully modular filter architecture.
🔧 Changes Made
1. Filter Text Color Consistency Fix
2. Dark Mode Color Harmony
text-muted-foregroundfor softer dark mode appearance3. Interactive Hover States
hover:text-foregroundto match navigation button behavior (grey → white on hover)transition-colorsanimations for polished user experience🏗️ Technical Implementation
Modular Architecture
Color Pattern Applied
📊 Components Updated
🎨 UX Improvements
🚀 Testing Status
📈 Impact
🔗 Related Issues
Resolves filter text color inconsistencies and implements navigation-matching interactive UX.
Ready for Review & Merge 🚀