Open
Conversation
Implements a full dark mode across all ORK3 pages with toggle persistence. - Add CSS custom property architecture (--ork-* vars) in orkui.css so dark mode vars are available on every page (home, reports, legacy templates, revised-frontend) - Add html[data-theme="dark"] overrides and @media (prefers-color-scheme: dark) block - revised.css: convert all base element rules (.kn-stat-card, .kn-card, .kn-tabs, .kn-tab-nav, .kn-park-tile, calendar, map sidebar, modals) from hardcoded #fff to CSS vars so dark mode redefines at root — no per-component override wars - Kingdomnew, Parknew, Playernew templates: inline style specificity fixes scoped with #theme_container for officer/sidebar accent link colors; hero stat numbers use extracted hue vars - default.theme: FOUC-prevention inline script in <head> sets data-theme before render; #ork-theme-toggle button in nav; self-contained toggle JS with sun/moon SVG icons and localStorage persistence for all non-revised-frontend pages - default.tpl (home page): hm-* classes converted to CSS vars; dark mode card/stat text with subtle shadow - reports.css: DataTables rows, pagination, filter cards, sidebar all dark mode aware - revised.js: orkIsDarkMode(), orkInitTheme(), orkUpdateThemeIcon() helpers; hero color extraction adjusted for dark vs light; toggle reapplies all hero colors Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Add comprehensive dark mode support using CSS custom properties. Covers DataTables, reports, search, attendance, login, admin pages, and revised-frontend profiles (Player, Kingdom, Park, Unit). Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
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.
Summary
prefers-color-scheme: dark--ork-*) for all colors, with light/dark value sets inorkui.cssPages covered
Key changes
orkui.css: ~1,400 lines of dark mode variable definitions and overrides (DataTables, jQuery UI, information tables, nav, footer, global elements)revised.css: ~2,700 lines of dark mode support for all revised-frontend components (heroes, cards, stat rows, tabs, modals, tables, charts, maps, autocomplete)reports.css: ~800 lines of dark mode for Highcharts, report tables, filter controls, and stat cardsdefault.tpl: Theme toggle button in nav, earlydata-themeattribute injection to prevent flashdefault.theme: Dark mode overrides for nav bar, dropdowns, search, footer, What's New modalrevised.js:orkInitTheme()function for theme state management and toggle wiring.tplfiles: Hardcoded inlinecolor/backgroundvalues replaced withvar(--ork-*)equivalentsTest plan
prefers-color-scheme: darkauto-detection works when no explicit theme is set🤖 Generated with Claude Code