js/webawesome
1
0
Fork 0
mirror of https://github.com/shoelace-style/webawesome.git synced 2026-01-12 12:09:26 +00:00
Code Issues Packages Projects Releases Wiki Activity
Files
e39bb856c4ad8d7948dc6db4ce69985f683af921
webawesome/docs/_includes/head.njk

56 lines
2.2 KiB
Plaintext
Raw Normal View History

Rewrite color scheme logic (#481) - Minimize needless swaps - Centralize logic - Use an actual `<wa-select>` rather than hacking it with `<wa-dropdown>` - Move shared includes to shared template - Rewrite critical theme JS - Refactor of theme picker code - Utilize view transitions better and use them for color scheme too - Do not store default value in localStorage - Removed unused `*-wide` templates - Fixed #482
2025-01-10 15:32:28 -05:00
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="{{ description }}">
add unlisted and unpublished support (#919) * add unlisted and excludeFromSearch filters * rename unlisted to unreleased, rename excludeFromSearch to unlisted * add notes for unlisted and unpublished * prettier * make unused patterns unpublished * unreleased -> unpublished * unreleased -> unpublished * update contributing
2025-05-12 15:44:25 -04:00
{% if noindex or unlisted %}<meta name="robots" content="noindex">{% endif %}
Rewrite color scheme logic (#481) - Minimize needless swaps - Centralize logic - Use an actual `<wa-select>` rather than hacking it with `<wa-dropdown>` - Move shared includes to shared template - Rewrite critical theme JS - Refactor of theme picker code - Utilize view transitions better and use them for color scheme too - Do not store default value in localStorage - Removed unused `*-wide` templates - Fixed #482
2025-01-10 15:32:28 -05:00
<title>{{ title }}</title>
{# Dark mode #}
<script>
let colorScheme = localStorage.colorScheme;
let isDark = localStorage.colorScheme === "dark";
if (!colorScheme || colorScheme === "auto") {
isDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
}
document.documentElement.classList.toggle('wa-dark', isDark);
</script>
<link rel="icon" href="/assets/images/webawesome-logo.svg" />
<link rel="apple-touch-icon" href="/assets/images/app-icon.png">
{# Scripts #}
{# Hydration stuff #}
<script src="/assets/scripts/hydration-errors.js"></script>
<link rel="stylesheet" href="/assets/styles/hydration-errors.css">
<link rel="preconnect" href="https://cdn.jsdelivr.net">
Fix web fonts in theme icons Instead of raw DSD, use a component that pulls in a child template and then goes over the CSS and extracts font-related rules into the document, just once per rule. This also fixes theme icons in Vue.
2025-03-26 12:54:32 -04:00
{# Internal components #}
<script type="module" src="/assets/components/scoped.js"></script>
Rewrite color scheme logic (#481) - Minimize needless swaps - Centralize logic - Use an actual `<wa-select>` rather than hacking it with `<wa-dropdown>` - Move shared includes to shared template - Rewrite critical theme JS - Refactor of theme picker code - Utilize view transitions better and use them for color scheme too - Do not store default value in localStorage - Removed unused `*-wide` templates - Fixed #482
2025-01-10 15:32:28 -05:00
{# Web Awesome #}
Add FOUCE utilities (#686) * add fouce utilities * add comment * Update docs/docs/installation.md Co-authored-by: Lea Verou <lea@verou.me> * commit PR suggestion * rename wa-reduce-fouce to wa-cloak * remove class as requested * add cloak class * wait a cycle * move turbo to same file * reduce fade * disable SSR and add Turbo FOUCE helper * disable SSR * fix test suite * workflow dispatch * update fouce util * no need to remove cloak class * simplify fouce util * add allDefined util * update changelog --------- Co-authored-by: Lea Verou <lea@verou.me> Co-authored-by: konnorrogers <konnor5456@gmail.com>
2025-03-24 16:33:24 -04:00
<script type="module" src="/dist/webawesome.loader.js"></script>
Rewrite color scheme logic (#481) - Minimize needless swaps - Centralize logic - Use an actual `<wa-select>` rather than hacking it with `<wa-dropdown>` - Move shared includes to shared template - Rewrite critical theme JS - Refactor of theme picker code - Utilize view transitions better and use them for color scheme too - Do not store default value in localStorage - Removed unused `*-wide` templates - Fixed #482
2025-01-10 15:32:28 -05:00
Themes category in docs (#477) Co-authored-by: Lindsay M <126139086+lindsaym-fa@users.noreply.github.com> Co-authored-by: lindsaym-fa <dev@lindsaym.design>
2025-01-13 13:14:12 -05:00
<script type="module" src="/assets/scripts/theme-picker.js"></script>
Rewrite color scheme logic (#481) - Minimize needless swaps - Centralize logic - Use an actual `<wa-select>` rather than hacking it with `<wa-dropdown>` - Move shared includes to shared template - Rewrite critical theme JS - Refactor of theme picker code - Utilize view transitions better and use them for color scheme too - Do not store default value in localStorage - Removed unused `*-wide` templates - Fixed #482
2025-01-10 15:32:28 -05:00
{# Preset Theme #}
Themer first slice (#857) * Basic scaffolding * Generate theme & palette data.js that other JS can import * Make it possible to include page-card without links * WIP * Add `appearance` to details, closes #569 Except `accent` as that's a) far less useful and b) trickier due to the icon color * Fix broken link * WIP * WIP * Icons icon * Unify styles for interactive cards * Prevent focusing inside theme icons * Fixes * Action page cards * Panel scrollables * scrollable * Scroll shadows * Add renaming UI * UI * Move styling of heading icons to `ui.css` * Support permalinks & CRUD * Make clickable cards more accessible * Style cards a little better * Default to styles panel if theme is selected * Update theme-icons.css * Custom themes should be saved under Custom * Get theme code * Bigger title * Fixes * Use theme Vue app for remixing too * Fix preview jank and make preview script more flexible * Make radio groups scrollable * Add affordance to button cards * Sticky * `<color-select>` * Fix theme remixing * Improve previewing logic * Fix preview * Move `domChange()` to separate module `theme-picker.js` includes side-effects, which may not always be desirable everywhere we may want to import `domChange()` * Update preview.js * Panel animation * Hide Save button if no changes and not saved * Do not show blank code when no selection has been made * Use theme slug in filename * Remove unused component * Better UI for editing title (and any other text) * Tweak UI of renaming * Better indicate default selection * Fix preview reverting bug * Fill out app preview with more examples * Remove `zoom` from theme showcase (yields unexpected/painful results Safari), improve display in wider viewports * Pending delete * Make styles panel cards scrollable * Fix some of the Safari issues * Update search.css * Update panel.css * Select preview UI * Fix typo * Frame colors setting as color contrast * Show dark mode in color mappings * Brand color * Swatch styling * Fix caret icon * Move Starting theme to the same level as other controls * Rename typography to Fonts * Fix bug: Swatch select should show swatches from the selected palette * Move capitalize to shared utils * Add utils for handling nested objects * Icons panel * Update code.js * Move utils around * Add fit and finish to sidebar panels * Theme card: Move icons to separate data structure * Move data to dedicated folder since we now have a lot more of it * Add default icon families and variants to themes * Data * Add `deepEntries()` * Add Duotone * Spruce up icons preview * Use theme's icon family in showcase * Font cards * Font cards * Add `max-inline-size` to preview container * Remove alternate preview options * Remove theme subtitle * Support FA kit codes * Remove Pro badges from theme cards * Use panagram preview for Fonts * Consistent heading and label capitalization * Classes for different icons-card types * Update data.js.njk * Variable style on icon family cards * Fix Sharp Duotone * Clean up FA kit code hint * Hide non-functional Icon Library field * Fix theme icon heights * icon variant -> style in theme metadata * Fix bug with icons defaults not being shown * More convenient theme defaults * Fix bug with non updating URL * Fix bug * Fix multiplying badges * Custom docs pages * Add Duotone icons to Mellow theme * Fix 404 * Remove "Create" from sidebar * Fix bug * Move vue components to `/assets/`, move their CSS with them * Safari/FF compatibility * Make panels scrollable again * Fix extra spacing --------- Co-authored-by: lindsaym-fa <dev@lindsaym.design>
2025-05-09 17:04:06 -04:00
{% if noTheme %}
{% elif forceTheme %}
Fix #514 for reals this time
2025-01-14 12:38:20 -05:00
<link id="theme-stylesheet" rel="stylesheet" id="theme-stylesheet" href="/dist/styles/themes/{{ forceTheme }}.css" render="blocking" fetchpriority="high" />
{% else %}
<noscript><link id="theme-stylesheet" rel="stylesheet" id="theme-stylesheet" href="/dist/styles/themes/default.css" render="blocking" fetchpriority="high" /></noscript>
Rewrite color scheme logic (#481) - Minimize needless swaps - Centralize logic - Use an actual `<wa-select>` rather than hacking it with `<wa-dropdown>` - Move shared includes to shared template - Rewrite critical theme JS - Refactor of theme picker code - Utilize view transitions better and use them for color scheme too - Do not store default value in localStorage - Removed unused `*-wide` templates - Fixed #482
2025-01-10 15:32:28 -05:00
<script>
Fix #514 for reals this time
2025-01-14 12:38:20 -05:00
{
let preset = localStorage.presetTheme ?? 'default';
let script = document.currentScript;
script.insertAdjacentHTML('beforebegin', `<link id="theme-stylesheet" rel="stylesheet" id="theme-stylesheet" href="/dist/styles/themes/${ preset }.css" render="blocking" fetchpriority="high" />`);
Rewrite color scheme logic (#481) - Minimize needless swaps - Centralize logic - Use an actual `<wa-select>` rather than hacking it with `<wa-dropdown>` - Move shared includes to shared template - Rewrite critical theme JS - Refactor of theme picker code - Utilize view transitions better and use them for color scheme too - Do not store default value in localStorage - Removed unused `*-wide` templates - Fixed #482
2025-01-10 15:32:28 -05:00
}
</script>
Themes category in docs (#477) Co-authored-by: Lindsay M <126139086+lindsaym-fa@users.noreply.github.com> Co-authored-by: lindsaym-fa <dev@lindsaym.design>
2025-01-13 13:14:12 -05:00
<script type="module" src="/assets/scripts/preset-theme-picker.js"></script>
Rewrite color scheme logic (#481) - Minimize needless swaps - Centralize logic - Use an actual `<wa-select>` rather than hacking it with `<wa-dropdown>` - Move shared includes to shared template - Rewrite critical theme JS - Refactor of theme picker code - Utilize view transitions better and use them for color scheme too - Do not store default value in localStorage - Removed unused `*-wide` templates - Fixed #482
2025-01-10 15:32:28 -05:00
{% endif %}
<link rel="stylesheet" href="/dist/styles/webawesome.css" />
<link id="color-stylesheet" rel="stylesheet" href="/dist/styles/utilities.css" />
<link rel="stylesheet" href="/dist/styles/forms.css" />
11ty for webawesome-app (#803) * working on integration * 11ty for webawesome + app * add flashes * additional changes * prettier * add note about nunjucks * prettier
2025-03-18 13:04:24 -04:00
{# Used by Web Awesome App to inject other assets into the head. #}
{% server "head" %}
Reference in New Issue Copy Permalink