From cbca93ec1e8b60b812643acaf245b5835c63503f Mon Sep 17 00:00:00 2001 From: Elliott Marquez <5981958+e111077@users.noreply.github.com> Date: Tue, 1 Sep 2026 12:05:06 -0700 Subject: [PATCH 1/4] [site] Replace theme menu with synced toggle --- packages/lit-dev-content/rollup.config.js | 3 +- .../site/_includes/default.html | 2 +- .../site/_includes/header.html | 7 +- .../site/playground/index.html | 9 +- .../src/components/litdev-drawer.ts | 6 +- .../src/components/litdev-playground-page.ts | 31 +- .../components/litdev-ripple-icon-button.ts | 77 +++-- .../src/components/litdev-tutorial.ts | 8 +- .../src/components/theme-switcher.ts | 306 +++--------------- .../src/global/apply-saved-theme.ts | 21 -- .../src/global/initialize-theme.ts | 10 + .../src/global/mobile-drawer.ts | 28 +- .../src/global/theme-worker.ts | 76 +++++ packages/lit-dev-content/src/global/theme.ts | 162 ++++++++-- .../src/icons/auto-mode-icon.ts | 24 -- .../lit-dev-content/src/icons/check-icon.ts | 19 -- .../lit-dev-tests/src/playwright/home.spec.ts | 130 ++++++++ .../src/playwright/playground.spec.ts | 27 ++ ...ntroToLitTutorialFirstStep-dark-darwin.png | Bin 239516 -> 240307 bytes .../introToLitTutorialFirstStep-darwin.png | Bin 239208 -> 240289 bytes .../src/playwright/tutorials.spec.ts | 32 ++ 21 files changed, 574 insertions(+), 404 deletions(-) delete mode 100644 packages/lit-dev-content/src/global/apply-saved-theme.ts create mode 100644 packages/lit-dev-content/src/global/initialize-theme.ts create mode 100644 packages/lit-dev-content/src/global/theme-worker.ts delete mode 100644 packages/lit-dev-content/src/icons/auto-mode-icon.ts delete mode 100644 packages/lit-dev-content/src/icons/check-icon.ts diff --git a/packages/lit-dev-content/rollup.config.js b/packages/lit-dev-content/rollup.config.js index a5a1f3094..b90fcc7b1 100644 --- a/packages/lit-dev-content/rollup.config.js +++ b/packages/lit-dev-content/rollup.config.js @@ -35,6 +35,7 @@ export default [ // lit-hydrate-support MUST be loaded first to make sure lit hydration // helpers are bundled before LitElement attempts to use hydration support 'lib/global/lit-hydrate-support.js', + 'lib/global/theme-worker.js', 'lib/components/copy-button.js', 'lib/components/litdev-banner.js', 'lib/components/litdev-drawer.js', @@ -151,7 +152,7 @@ export default [ // the asynchronously-loaded module bundles above. { input: [ - 'lib/global/apply-saved-theme.js', + 'lib/global/initialize-theme.js', 'lib/global/apply-mods.js', 'lib/global/initialize-typescript-mode.js', 'lib/global/mobile-drawer.js', diff --git a/packages/lit-dev-content/site/_includes/default.html b/packages/lit-dev-content/site/_includes/default.html index 2dd961279..8503731fd 100644 --- a/packages/lit-dev-content/site/_includes/default.html +++ b/packages/lit-dev-content/site/_includes/default.html @@ -15,7 +15,7 @@ - {% inlinejs "global/apply-saved-theme.js" %} + {% inlinejs "global/initialize-theme.js" %} {% inlinecss "colors.css" %} {% inlinecss "global.css" %} diff --git a/packages/lit-dev-content/site/_includes/header.html b/packages/lit-dev-content/site/_includes/header.html index da634b79f..4c66276ab 100644 --- a/packages/lit-dev-content/site/_includes/header.html +++ b/packages/lit-dev-content/site/_includes/header.html @@ -17,9 +17,12 @@ - + diff --git a/packages/lit-dev-content/site/playground/index.html b/packages/lit-dev-content/site/playground/index.html index 1566310ef..7f32d3eef 100644 --- a/packages/lit-dev-content/site/playground/index.html +++ b/packages/lit-dev-content/site/playground/index.html @@ -55,21 +55,22 @@

{{ section.name }}

diff --git a/packages/lit-dev-content/src/components/litdev-drawer.ts b/packages/lit-dev-content/src/components/litdev-drawer.ts index 34fcc1554..f98689399 100644 --- a/packages/lit-dev-content/src/components/litdev-drawer.ts +++ b/packages/lit-dev-content/src/components/litdev-drawer.ts @@ -22,6 +22,7 @@ const closeIcon = html`
`; } + + private _handleAnchorClick(event: MouseEvent) { + if (this.disabled) { + event.preventDefault(); + event.stopImmediatePropagation(); + } + } } diff --git a/packages/lit-dev-content/src/components/litdev-tutorial.ts b/packages/lit-dev-content/src/components/litdev-tutorial.ts index 81ac65a99..9e2a99727 100644 --- a/packages/lit-dev-content/src/components/litdev-tutorial.ts +++ b/packages/lit-dev-content/src/components/litdev-tutorial.ts @@ -363,11 +363,9 @@ export class LitDevTutorial extends LitElement { protected renderHeader() { return html`
- - - ${catalogIcon} - - + + ${catalogIcon} +