@stacksjs/defaults 0.75.196 → 0.75.197
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.
|
@@ -75,6 +75,8 @@ is gated by `prefers-reduced-motion`; the card remains readable without it.
|
|
|
75
75
|
label="Membership card" nameLabel="Member" :detail="planName" />
|
|
76
76
|
```
|
|
77
77
|
|
|
78
|
+
Pass `logo` to use your brand image in place of the text wordmark; `brand` remains its accessible name. The engraved name uses a cursive title treatment. Set `nameFont` to your self-hosted signature font family and load it through your app's fonts config (`font-display: swap`). Long names wrap without covering the Member ID.
|
|
79
|
+
|
|
78
80
|
Pass `memberId` and a localized `memberIdLabel` to engrave a permanent account identifier. Keep IDs stable across plans and organizations. Increment the optional numeric `replay` prop to remount the reveal through a keyed signal loop; no DOM access or timers are needed. Reduced motion still displays the complete card without confetti.
|
|
79
81
|
|
|
80
82
|
## Gotchas
|
package/ide/vscode/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"publisher": "Stacks",
|
|
3
3
|
"name": "vscode-stacks",
|
|
4
4
|
"displayName": "Stacks",
|
|
5
|
-
"version": "0.75.
|
|
5
|
+
"version": "0.75.197",
|
|
6
6
|
"description": "Stacks, built into VS Code: stx templates, pickier linting and formatting, encrypted env files, the dev server preview and every buddy command. No other extensions required.",
|
|
7
7
|
"license": "MIT",
|
|
8
8
|
"funding": "https://github.com/sponsors/chrisbbreuer",
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@stacksjs/defaults",
|
|
3
3
|
"type": "module",
|
|
4
4
|
"sideEffects": false,
|
|
5
|
-
"version": "0.75.
|
|
5
|
+
"version": "0.75.197",
|
|
6
6
|
"repository": {
|
|
7
7
|
"type": "git",
|
|
8
8
|
"url": "git+https://github.com/stacksjs/stacks.git",
|
|
@@ -55,7 +55,7 @@
|
|
|
55
55
|
"dependencies": {
|
|
56
56
|
"@iconify-json/f7": "^1.2.2",
|
|
57
57
|
"@iconify-json/hugeicons": "^1.2.35",
|
|
58
|
-
"@stacksjs/mobile": "0.75.
|
|
58
|
+
"@stacksjs/mobile": "0.75.197",
|
|
59
59
|
"@stacksjs/sanitizer": "^0.2.534",
|
|
60
60
|
"@xterm/addon-fit": "^0.11.0",
|
|
61
61
|
"@xterm/xterm": "^6.0.0",
|
|
@@ -2,6 +2,8 @@
|
|
|
2
2
|
/** A personalized keepsake. Mount after confirmed completion to play once. */
|
|
3
3
|
const mcName = useReactiveProp<string>('name', '')
|
|
4
4
|
const mcBrand = useReactiveProp<string>('brand', '')
|
|
5
|
+
const mcLogo = useReactiveProp<string>('logo', '')
|
|
6
|
+
const mcNameFont = useReactiveProp<string>('nameFont', "'Snell Roundhand', 'Apple Chancery', 'URW Chancery L', cursive")
|
|
5
7
|
const mcDetail = useReactiveProp<string>('detail', '')
|
|
6
8
|
const mcLabel = useReactiveProp<string>('label', '')
|
|
7
9
|
const mcNameLabel = useReactiveProp<string>('nameLabel', '')
|
|
@@ -24,14 +26,14 @@
|
|
|
24
26
|
<div class="absolute inset-0 pointer-events-none mc-grain" aria-hidden="true"></div>
|
|
25
27
|
<div class="absolute inset-0 pointer-events-none mc-shine" aria-hidden="true"></div>
|
|
26
28
|
<div class="flex relative gap-4 items-start justify-between">
|
|
27
|
-
<
|
|
28
|
-
<
|
|
29
|
+
<img :if="mcLogo" class="mc-logo" :src="mcLogo" :alt="mcBrand" width="96" height="38" />
|
|
30
|
+
<span :if="!mcLogo" class="font-bold mc-wordmark" :text="mcBrand"></span>
|
|
29
31
|
</div>
|
|
30
32
|
<p class="relative mt-3 text-xs mc-label" :text="mcLabel"></p>
|
|
31
33
|
<div class="relative mc-holder">
|
|
32
34
|
<div class="mc-person">
|
|
33
35
|
<p class="mb-2 text-xs mc-label" :text="mcNameLabel"></p>
|
|
34
|
-
<p class="
|
|
36
|
+
<p class="mc-engraving" :style="{ fontFamily: mcNameFont }" :text="mcName" data-membership-name></p>
|
|
35
37
|
</div>
|
|
36
38
|
<div :if="mcMemberId" class="mc-identity">
|
|
37
39
|
<p class="text-xs mc-label" :text="mcMemberIdLabel"></p>
|
|
@@ -59,11 +61,11 @@
|
|
|
59
61
|
.mc-grain { opacity: 0.35; background: repeating-linear-gradient(0deg, transparent, transparent 1px, #cbd5e114 1px, #cbd5e114 2px); }
|
|
60
62
|
.mc-shine { transform: translateX(-150%) skewX(-20deg); background: linear-gradient(90deg, transparent 25%, #ffffff30 48%, #ffffff66 50%, #ffffff12 54%, transparent 75%); }
|
|
61
63
|
.mc-wordmark { font-size: clamp(1.3rem, 5vw, 1.75rem); letter-spacing: -0.06em; overflow-wrap: anywhere; text-shadow: 0 -1px 1px #020617, 0 1px 0 #ffffff55; }
|
|
62
|
-
.mc-
|
|
64
|
+
.mc-metal .mc-logo { display: block; width: 6rem; height: 2.375rem; margin: 0; object-fit: contain; object-position: left center; }
|
|
63
65
|
.mc-label { color: #cbd5e1; letter-spacing: 0.12em; }
|
|
64
|
-
.mc-holder { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1.25rem; align-items: end; margin-top:
|
|
66
|
+
.mc-holder { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 1.25rem; align-items: end; margin-top: 2rem; }
|
|
65
67
|
.mc-person { min-width: 0; }
|
|
66
|
-
.mc-engraving { font-size: clamp(
|
|
68
|
+
.mc-metal .mc-engraving { padding: 0 0 0.25rem; font-size: clamp(2.25rem, 8vw, 3.25rem); font-weight: 400; line-height: 1.2; letter-spacing: 0; overflow-wrap: anywhere; color: #f1f5f9; text-shadow: 0 -1px 1px #020617, 0 1px 0 #ffffff80, 0 2px 2px #02061780; }
|
|
67
69
|
.mc-identity { padding-left: 1rem; border-left: 1px solid #cbd5e133; }
|
|
68
70
|
.mc-serial { margin-top: 0.4rem; font-family: ui-monospace, monospace; font-size: clamp(1rem, 3.8vw, 1.2rem); letter-spacing: 0.1em; overflow-wrap: anywhere; color: #ccfbf1; text-shadow: 0 -1px 1px #020617, 0 1px 0 #ffffff80; }
|
|
69
71
|
.mc-detail { color: #cbd5e1; overflow-wrap: anywhere; }
|