Uptime —
-
`;
}
diff --git a/src/components/IconSet.astro b/src/components/IconSet.astro
new file mode 100644
index 0000000..05048eb
--- /dev/null
+++ b/src/components/IconSet.astro
@@ -0,0 +1,74 @@
+---
+import { readRepoFile } from '../lib/repo';
+
+const source = readRepoFile('ui/js/icon-set.js');
+let sprite = '';
+let ids: string[] = [];
+if (source) {
+ const mod = await import(/* @vite-ignore */ `data:text/javascript;base64,${Buffer.from(source).toString('base64')}`);
+ let defs = '';
+ let syms = '';
+ ids = Object.keys(mod.ICONS);
+ for (const id of ids) {
+ const s = mod.symbol(id, mod.ICONS[id]);
+ defs += s.defs;
+ syms += s.sym;
+ }
+ sprite = ``;
+}
+---
+
+{
+ source ? (
+
+ ) : (
+ ↓ —
- ↑ —
+ —
+ —
+ See ui/js/icon-set.js. +
+ ) +} + + diff --git a/src/content/docs/docs/contributing/design-system.mdx b/src/content/docs/docs/contributing/design-system.mdx index c1dcaa1..33f20ab 100644 --- a/src/content/docs/docs/contributing/design-system.mdx +++ b/src/content/docs/docs/contributing/design-system.mdx @@ -1,8 +1,10 @@ --- title: Stackyard design system -description: The Stackyard colours, logo and the few design rules that go beyond Apple's Human Interface Guidelines. +description: The Stackyard colours, logo, icons and the few design rules that go beyond Apple's Human Interface Guidelines. --- +import IconSet from '../../../../components/IconSet.astro'; + Stackyard follows Apple's [Human Interface Guidelines](https://developer.apple.com/design/human-interface-guidelines) for type, spacing, controls and motion. This page covers only what is specific to Stackyard. Tokens live in `ui/css/tokens.css`. ## Colour @@ -58,3 +60,38 @@ Use the files as they are. Do not recolour, stretch or redraw them.