Relocate the light/dark toggle button out of #app1 and into a new
#app3 mount just before the back-to-top element so keyboard focus
reaches it near the end of the page instead of right after the main
nav. Replace the library logo's reactive :src binding with a plain
src plus data-light-src/data-dark-src so app1 no longer needs any
theme state; app3 now owns toggleTheme, overlay updates, logo swap,
and the OS preference listener.
The .fade transition (one class) was being overridden by a later
.dropdown-menu rule (also one class) that set transition to only
background-color. Moving the opacity transition into .dropdown-menu.fade
(two classes) ensures it wins regardless of cascade order.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
The .fade rule only set transition-duration without specifying
transition-property, so opacity changes were instant. Also fixes
a typo where the webkit duration was 5s instead of 0.5s.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Add null check before accessing innerHTML, since the element may not
exist in the DOM when the CMS renders the page.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Use onesearch_logo2.png (black text) in light mode and
onesearch_logo3.png (white text) in dark mode via MutationObserver.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Change dark-mode --focus-outline from #6ea8fe to #ff4e00 (kbccorange)
- Replace enumerated focus selectors with broad rule covering all a, button,
input, select, and [tabindex] elements with !important
- Add display:block to a.ga-by-jumbotron to prevent width shrinking on focus
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Adds border-radius: 5px and horizontal margins to align the dark
mode nav bar with the background image below it. Uses margin-left
and margin-right to preserve the existing margin-top: -20px.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Repositions the dark/light mode button from the header to a fixed
position in the bottom-right corner (always visible). Bumps size
to 44px for WCAG touch target compliance. Also makes login text
and icon white in dark mode.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
- Card bodies use page background color instead of surface color
- Hours container matches page background in dark mode
- Main nav uses kbccblue background with white text in dark mode
- Radio buttons and labels are white in dark mode
- Library links are white in dark mode
- Search input stays white with dark text in dark mode
- Slick carousel arrows are white in dark mode
- LibGuides boxes use page background in dark mode
- Logo swaps to inverted version (white on dark) in dark mode
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Uses Bootstrap 5.3 data-bs-theme attribute for automatic component
theming. Adds CSS custom properties for dark mode, a toggle button
in the header, localStorage persistence, and a flash-prevention
script. Background image overlay adjusts per theme.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Combine the two inline script blocks into a single try/catch
using new Function() so old browsers fail gracefully.
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Renovate Bot