Feature - Dark Mode Generator tool#720
Open
markmead wants to merge 12 commits into
Open
Conversation
Extracts SHADE_MAP, COLOR_MAP, COLOR_FAMILIES into src/constants/dark-mode.js and creates src/lib/dark-mode/ with transform-class.js, transform-html.js, and config.js (with localStorage persistence, normalizer, import/export). Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Replaces the TypeScript consts file with a plain ESM JS module and updates all 8 importers to use the new path. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Replaces inline SHADE_MAP/COLOR_MAP/transform logic in generate-dark-variants.js with imports from src/lib/dark-mode/. Behavior is unchanged. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Adds a Tools entry to the desktop header and mobile dropdown menu. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Introduces the /tools section with a Dark Mode Generator: a browser-based tool that transforms Tailwind HTML to include dark: variants. Features a configurable sidebar (shade map, utility toggles, rules), sandboxed light/dark/split/code preview, and localStorage persistence. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Deploying with
|
| Status | Name | Latest Commit | Preview URL | Updated (UTC) |
|---|---|---|---|---|
| ✅ Deployment successful! View logs |
hyperui | d65bd70 | Commit Preview URL Branch Preview URL |
Jun 06 2026, 01:44 PM |
config.shadeMap was never read — both the shade gate and the dark shade fallback were referencing the imported SHADE_MAP constant directly. Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
…aking Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Apply defensive coding and formatting across dark-mode utilities and the generator UI. Key changes: - Add ESLint rules (curly, eqeqeq). - Add explicit braces and block returns to many functions (normalizeConfig, normalizeShadeMap, normalizeColorMap, normalizeUtilities, normalizeRule, loadConfig, saveConfig, transform-class, transform-html, and component methods) to improve readability and avoid ambiguous control flow. - Strengthen null/undefined checks and early returns (file import, clipboard copy, dialog close, iframe handling, element queries, etc.). - Minor DOM/markup formatting and class/attribute reflows in DarkModeGenerator.astro (line wrapping, small class name tweak for alignment, SVG path inline). - Small behavior/comments tweak: avoid clearing timers without braces and make clipboard catch a no-op. - Update git metadata newline at EOF. No core algorithm changes — these edits are primarily safety, style, and maintainability improvements.
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
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
/toolssection to HyperUI, evolving the site from a component library into a component and tools librarydark:variants added — fully browser-based, nothing leaves the clientsrc/lib/dark-mode/) used by both the GUI and the existing CLI scriptWhat's included
Shared core
src/constants/dark-mode.js—SHADE_MAP,COLOR_MAP,COLOR_FAMILIESsrc/lib/dark-mode/transform-class.js— per-class transform logic with element-aware rule matchingsrc/lib/dark-mode/transform-html.js—transformHtmlString(regex, CLI/Node) +transformHtmlDom(DOMParser, browser)src/lib/dark-mode/config.js—DEFAULT_CONFIG, localStorage persistence, normalizer, import/exportPages & component
src/pages/tools/index.astro— tools landing pagesrc/pages/tools/dark-mode-generator.astro— page wrappersrc/components/DarkModeGenerator.astro— full GUI with sidebar config, live preview, and code outputOther
src/constants/seo.js— replaces deletedsrc/consts.ts; all 8 importers updatedscripts/generate-dark-variants.js— refactored to import from shared core (behavior unchanged)src/components/SiteHeader.astro+DropdownMenu.astro— Tools nav link addedSafety model
textContent, neverinnerHTMLDOMParserbuilds a detached document — no scripts run<iframe sandbox="allow-scripts">withoutallow-same-origin— cannot reach parentnormalizeConfig()always returns a safe defaultTest plan
/tools— landing card present/tools/dark-mode-generator— tool loads, config persists across reloadbg-white→bg-white dark:bg-gray-900)buttonfor shade600—<button class="bg-blue-600">is untouched<script>alert(1)</script>and<img src=x onerror=alert(1)>— nothing executespnpm generate:dark-variantsoutput is identical to before the refactor🤖 Generated with Claude Code