From 8abe3d6e77b7c4e292ee2ac98391416b41b98b4a Mon Sep 17 00:00:00 2001 From: Cory LaViska Date: Mon, 16 Jun 2025 13:00:17 -0400 Subject: [PATCH] themer data --- packages/webawesome/docs/.eleventy.js | 17 +++------------ .../docs/_includes/theme-selector.njk | 21 ++++++------------- packages/webawesome/docs/docs/themes.njk | 16 ++++++++------ .../webawesome/docs/docs/themes/awesome.md | 7 ------- .../webawesome/docs/docs/themes/default.md | 7 ------- .../webawesome/docs/docs/themes/shoelace.md | 7 ------- 6 files changed, 19 insertions(+), 56 deletions(-) delete mode 100644 packages/webawesome/docs/docs/themes/awesome.md delete mode 100644 packages/webawesome/docs/docs/themes/default.md delete mode 100644 packages/webawesome/docs/docs/themes/shoelace.md diff --git a/packages/webawesome/docs/.eleventy.js b/packages/webawesome/docs/.eleventy.js index 8126371b2..fd9e83b6f 100644 --- a/packages/webawesome/docs/.eleventy.js +++ b/packages/webawesome/docs/.eleventy.js @@ -54,6 +54,8 @@ export default async function (eleventyConfig) { // eleventyConfig.addGlobalData('themer', { colors: ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'indigo', 'purple', 'rose', 'gray'], + hues: ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'indigo', 'purple', 'pink', 'gray'], + tints: ['95', '90', '80', '70', '60', '50', '40', '30', '20', '10', '05'], themes: [ // Free { @@ -72,7 +74,7 @@ export default async function (eleventyConfig) { name: 'Shoelace', description: 'The original, familiar look you know and love from Shoelace.', filename: 'shoelace.css', - isPro: true, + isPro: false, }, // Pro { @@ -174,9 +176,6 @@ export default async function (eleventyConfig) { isPro: true, }, ], - - hues: ['red', 'orange', 'yellow', 'green', 'cyan', 'blue', 'indigo', 'purple', 'pink', 'gray'], - tints: ['95', '90', '80', '70', '60', '50', '40', '30', '20', '10', '05'], }); // Template filters - {{ content | filter }} @@ -212,11 +211,8 @@ export default async function (eleventyConfig) { ); return componentPages.map(page => { - // Extract component name from the file path or page data const componentName = path.basename(page.inputPath, '.md'); const tagName = `wa-${componentName}`; - - // Find the matching component const component = allComponents.find(c => c.tagName === tagName); // Add component to the page's data @@ -228,13 +224,6 @@ export default async function (eleventyConfig) { }); }); - // - // Add the themes collection - // - eleventyConfig.addCollection('themePages', function (collectionApi) { - return collectionApi.getFilteredByGlob(path.join(eleventyConfig.directories.input, 'docs/themes/**/*.md')); - }); - // Shortcodes - {% shortCode arg1, arg2 %} eleventyConfig.addShortcode('cdnUrl', location => { return `https://early.webawesome.com/webawesome@${packageData.version}/dist/` + (location || '').replace(/^\//, ''); diff --git a/packages/webawesome/docs/_includes/theme-selector.njk b/packages/webawesome/docs/_includes/theme-selector.njk index 68465f497..2fcf7df3a 100644 --- a/packages/webawesome/docs/_includes/theme-selector.njk +++ b/packages/webawesome/docs/_includes/theme-selector.njk @@ -1,27 +1,18 @@ -{{ themePages | dump }} - -

- {# Free themes #} - {% for page in collections.themePages %} - {% if not page.data.isPro %} - {{ page.data.title }} + {% for theme in themer.themes %} + {% if not theme.isPro %} + {{ theme.name }} {% endif %} {% endfor %} - {# Only show divider if there are pro themes #} - {% if collections.themePages | selectattr('data.isPro') | list | length > 0 %} - - {% endif %} - {# Pro themes #} - {% for page in collections.themePages %} + {% for theme in themer.themes %} {% if loop.first %}{% endif %} - {% if page.data.isPro %} - {{ page.data.title }} + {% if theme.isPro %} + {{ theme.name }} {% endif %} {% endfor %} diff --git a/packages/webawesome/docs/docs/themes.njk b/packages/webawesome/docs/docs/themes.njk index 78217aa0f..7f08c8aeb 100644 --- a/packages/webawesome/docs/docs/themes.njk +++ b/packages/webawesome/docs/docs/themes.njk @@ -7,15 +7,15 @@ isPro: true
- {% for page in collections.themePages | sortWithFirst('fileSlug', 'default') %} + {% for theme in themer.themes %} - {{ page.data.title }} + {{ theme.name }} {% endfor %} @@ -138,6 +138,10 @@ isPro: true } wa-comparison { + --handle-color: black; + --divider-color: white; + --divider-width: 4px; + &::part(before) { border-radius: var(--wa-border-radius-m); background-color: white; diff --git a/packages/webawesome/docs/docs/themes/awesome.md b/packages/webawesome/docs/docs/themes/awesome.md deleted file mode 100644 index 953b0de1d..000000000 --- a/packages/webawesome/docs/docs/themes/awesome.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -title: Awesome -description: Punchy and vibrant, the rockstar of themes. -isPro: false ---- - -TODO diff --git a/packages/webawesome/docs/docs/themes/default.md b/packages/webawesome/docs/docs/themes/default.md deleted file mode 100644 index 47fab94e5..000000000 --- a/packages/webawesome/docs/docs/themes/default.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -title: Default -description: Your trusty companion, like a perfectly broken-in pair of jeans. -isPro: false ---- - -TODO diff --git a/packages/webawesome/docs/docs/themes/shoelace.md b/packages/webawesome/docs/docs/themes/shoelace.md deleted file mode 100644 index f4f165fa9..000000000 --- a/packages/webawesome/docs/docs/themes/shoelace.md +++ /dev/null @@ -1,7 +0,0 @@ ---- -title: Shoelace -description: The original, familiar look you know and love from Shoelace. -isPro: false ---- - -TODO