@signal9/era-ui 2.0.0 → 2.2.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,47 +0,0 @@
1
- # Quickstart
2
-
3
- Installation and setup guide.
4
-
5
- ## Hero Template
6
-
7
- Use a single, pure component import from `$lib/ui` for a clean docs-friendly starter hero.
8
-
9
- ```svelte
10
- <script lang="ts">
11
- import { Badge, Bar, Button, ButtonGroup, Card, Separator } from '$lib/ui';
12
- </script>
13
-
14
- <section class="mx-auto flex w-full max-w-4xl flex-col gap-(--era-content-p) p-(--era-content-p)">
15
- <Badge tone="accent">Now shipping v0.8</Badge>
16
-
17
- <div class="space-y-(--era-gap)">
18
- <h1 class="font-mono text-[length:calc(var(--era-text)*2)] font-semibold text-bright">
19
- Era Hero
20
- </h1>
21
- <p class="max-w-prose text-muted">
22
- Build once, then switch feel instantly with density and surface tokens.
23
- </p>
24
- </div>
25
-
26
- <Bar class="border border-[color:var(--era-border-color)] bg-[var(--era-surface-bg)]">
27
- <ButtonGroup>
28
- <Button tone="accent">Get started</Button>
29
- <Button variant="outline">Live preview</Button>
30
- </ButtonGroup>
31
- </Bar>
32
-
33
- <Separator />
34
-
35
- <div class="grid gap-(--era-gap) md:grid-cols-3">
36
- <Card class="p-(--era-gap)">Dense-ready</Card>
37
- <Card class="p-(--era-gap)">Balanced defaults</Card>
38
- <Card class="p-(--era-gap)">Spacious polish</Card>
39
- </div>
40
- </section>
41
- ```
42
-
43
- ### Why this template
44
-
45
- - Pure imports keep setup simple for first-time users.
46
- - Every spacing and size value comes from era tokens.
47
- - Works in all density modes without rewriting markup.