diff --git a/.Jules/palette.md b/.Jules/palette.md new file mode 100644 index 00000000..5fe9cf81 --- /dev/null +++ b/.Jules/palette.md @@ -0,0 +1,4 @@ +## 2024-05-15 - [Filter Pills Accessibility] + +**Learning:** Custom interactive elements like filter pills must have `aria-pressed` for screen readers to recognize them as toggle buttons. Dark theme elements often need explicit `focus-visible` styles (`focus-visible:ring-2 focus-visible:ring-white/50 ...`) because default browser focus rings can be invisible against dark backgrounds. +**Action:** Always add `aria-pressed={isActive}` to toggle elements and explicit dark-theme focus rings to custom buttons. diff --git a/.github/workflows/model-quality.yml b/.github/workflows/model-quality.yml index d5650ca3..a4caa437 100644 --- a/.github/workflows/model-quality.yml +++ b/.github/workflows/model-quality.yml @@ -17,6 +17,8 @@ jobs: REAL_DATA_MIN_DAYS: 7 LEARNED_KFOLDS: 5 LEARNED_MAX_VAL_LOSS: 0.2 + FORECAST_BACKTEST_STALE_DAYS: 7 + FORECAST_BACKTEST_SOURCE: mock steps: - name: Checkout uses: actions/checkout@v4 diff --git a/src/components/dashboard/filter-pills.tsx b/src/components/dashboard/filter-pills.tsx index d09effbe..eb1791f1 100644 --- a/src/components/dashboard/filter-pills.tsx +++ b/src/components/dashboard/filter-pills.tsx @@ -35,8 +35,10 @@ export function FilterPills({ options, selected, onToggle, onClear, className }: key={option.id} onClick={() => onToggle(option.id)} transition={{ duration: 0.15 }} + aria-pressed={isSelected} className={cn( 'inline-flex items-center gap-2 rounded-full px-3 py-1.5 text-xs font-medium transition-all', + 'focus:outline-none focus-visible:ring-2 focus-visible:ring-white/50 focus-visible:ring-offset-2 focus-visible:ring-offset-neutral-900', isSelected ? 'bg-[#4C8BF5] text-white shadow-sm' : 'bg-neutral-800 text-neutral-300 hover:bg-neutral-700' @@ -60,9 +62,13 @@ export function FilterPills({ options, selected, onToggle, onClear, className }: {hasSelection && onClear && ( )}