create-specfuse 0.3.2 → 0.4.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.
- package/dist/design-md/templates/_schema.yaml +75 -10
- package/dist/design-md/templates/consumer-media.yaml +33 -24
- package/dist/design-md/templates/consumer-social.yaml +37 -28
- package/dist/design-md/templates/content-blog.yaml +35 -26
- package/dist/design-md/templates/content-docs.yaml +34 -24
- package/dist/design-md/templates/dashboard-analytics.yaml +33 -24
- package/dist/design-md/templates/dashboard-monitoring.yaml +33 -24
- package/dist/design-md/templates/developer-portal.yaml +37 -26
- package/dist/design-md/templates/e-commerce.yaml +38 -28
- package/dist/design-md/templates/enterprise-admin.yaml +44 -0
- package/dist/design-md/templates/form-heavy.yaml +36 -26
- package/dist/design-md/templates/internal-tool.yaml +33 -24
- package/dist/design-md/templates/marketing-corporate.yaml +36 -27
- package/dist/design-md/templates/marketing-creative.yaml +34 -25
- package/dist/design-md/templates/mobile-lifestyle.yaml +35 -26
- package/dist/design-md/templates/mobile-utility.yaml +36 -26
- package/dist/design-md/templates/saas-dashboard.yaml +33 -24
- package/dist/templates/design-md-skill.d.ts.map +1 -1
- package/dist/templates/design-md-skill.js +225 -14
- package/dist/templates/design-md-skill.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
id: enterprise-admin
|
|
2
|
+
name: Enterprise Admin
|
|
3
|
+
category: internal-tool
|
|
4
|
+
intent:
|
|
5
|
+
mood: Serious and structured — conveys control and authority over complex systems
|
|
6
|
+
density: High density, data tables and multi-panel layouts for admin operations
|
|
7
|
+
philosophy: Admin panels serve operators who manage resources at scale; batch actions and bulk views over single-item flows
|
|
8
|
+
dimensions:
|
|
9
|
+
colorTemp: 1
|
|
10
|
+
lightness: 3
|
|
11
|
+
density: 1
|
|
12
|
+
borderRadius: 2
|
|
13
|
+
tone: 1
|
|
14
|
+
anchors:
|
|
15
|
+
colors:
|
|
16
|
+
primary: "#1E40AF"
|
|
17
|
+
auxiliary:
|
|
18
|
+
- "#6366F1"
|
|
19
|
+
typography:
|
|
20
|
+
baseSize: "13px"
|
|
21
|
+
scale: 1.2
|
|
22
|
+
spacing:
|
|
23
|
+
unit: "4px"
|
|
24
|
+
radius:
|
|
25
|
+
base: "4px"
|
|
26
|
+
structure:
|
|
27
|
+
requiredSections:
|
|
28
|
+
- colors
|
|
29
|
+
- typography
|
|
30
|
+
- spacing
|
|
31
|
+
- rounded
|
|
32
|
+
- elevation
|
|
33
|
+
- components
|
|
34
|
+
- breakpoints
|
|
35
|
+
componentTokens:
|
|
36
|
+
- button
|
|
37
|
+
- input
|
|
38
|
+
- table
|
|
39
|
+
- card
|
|
40
|
+
- sidebar
|
|
41
|
+
- modal
|
|
42
|
+
- badge
|
|
43
|
+
- breadcrumb
|
|
44
|
+
- dropdown
|
|
@@ -1,34 +1,44 @@
|
|
|
1
1
|
id: form-heavy
|
|
2
|
-
name: Form
|
|
2
|
+
name: Form Heavy
|
|
3
3
|
category: form-heavy
|
|
4
|
+
intent:
|
|
5
|
+
mood: Structured and reassuring — guides users through complex multi-step flows
|
|
6
|
+
density: Medium density, forms need vertical breathing room for label-input-error stacking
|
|
7
|
+
philosophy: Progressive disclosure reduces cognitive load; validate inline, never surprise at submission
|
|
4
8
|
dimensions:
|
|
5
|
-
colorTemp:
|
|
9
|
+
colorTemp: 2
|
|
6
10
|
lightness: 4
|
|
7
11
|
density: 3
|
|
8
12
|
borderRadius: 3
|
|
9
13
|
tone: 2
|
|
10
14
|
anchors:
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
15
|
+
colors:
|
|
16
|
+
primary: "#2563EB"
|
|
17
|
+
auxiliary:
|
|
18
|
+
- "#10B981"
|
|
19
|
+
typography:
|
|
20
|
+
baseSize: "14px"
|
|
21
|
+
scale: 1.2
|
|
22
|
+
spacing:
|
|
23
|
+
unit: "4px"
|
|
24
|
+
radius:
|
|
25
|
+
base: "6px"
|
|
26
|
+
structure:
|
|
27
|
+
requiredSections:
|
|
28
|
+
- colors
|
|
29
|
+
- typography
|
|
30
|
+
- spacing
|
|
31
|
+
- rounded
|
|
32
|
+
- elevation
|
|
33
|
+
- components
|
|
34
|
+
- breakpoints
|
|
35
|
+
componentTokens:
|
|
36
|
+
- button
|
|
37
|
+
- input
|
|
38
|
+
- card
|
|
39
|
+
- select
|
|
40
|
+
- checkbox
|
|
41
|
+
- radio
|
|
42
|
+
- modal
|
|
43
|
+
- stepper
|
|
44
|
+
- alert
|
|
@@ -1,6 +1,10 @@
|
|
|
1
1
|
id: internal-tool
|
|
2
2
|
name: Internal Tool
|
|
3
3
|
category: internal-tool
|
|
4
|
+
intent:
|
|
5
|
+
mood: Functional and utilitarian — prioritizes efficiency over aesthetics
|
|
6
|
+
density: High density, compact layouts with maximum information per screen
|
|
7
|
+
philosophy: Tools for power users who value speed and keyboard shortcuts over visual delight
|
|
4
8
|
dimensions:
|
|
5
9
|
colorTemp: 2
|
|
6
10
|
lightness: 2
|
|
@@ -8,27 +12,32 @@ dimensions:
|
|
|
8
12
|
borderRadius: 2
|
|
9
13
|
tone: 1
|
|
10
14
|
anchors:
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
15
|
+
colors:
|
|
16
|
+
primary: "#4A6CF7"
|
|
17
|
+
auxiliary:
|
|
18
|
+
- "#7C8DFF"
|
|
19
|
+
typography:
|
|
20
|
+
baseSize: "13px"
|
|
21
|
+
scale: 1.2
|
|
22
|
+
spacing:
|
|
23
|
+
unit: "4px"
|
|
24
|
+
radius:
|
|
25
|
+
base: "4px"
|
|
26
|
+
structure:
|
|
27
|
+
requiredSections:
|
|
28
|
+
- colors
|
|
29
|
+
- typography
|
|
30
|
+
- spacing
|
|
31
|
+
- rounded
|
|
32
|
+
- elevation
|
|
33
|
+
- components
|
|
34
|
+
- breakpoints
|
|
35
|
+
componentTokens:
|
|
36
|
+
- button
|
|
37
|
+
- input
|
|
38
|
+
- table
|
|
39
|
+
- card
|
|
40
|
+
- sidebar
|
|
41
|
+
- modal
|
|
42
|
+
- badge
|
|
43
|
+
- tooltip
|
|
@@ -1,34 +1,43 @@
|
|
|
1
1
|
id: marketing-corporate
|
|
2
2
|
name: Marketing Corporate
|
|
3
3
|
category: marketing
|
|
4
|
+
intent:
|
|
5
|
+
mood: Polished and authoritative — conveys enterprise stability
|
|
6
|
+
density: Low density, hero sections and generous whitespace establish premium feel
|
|
7
|
+
philosophy: Whitespace is a luxury signal; fewer elements with larger scale create perceived quality
|
|
4
8
|
dimensions:
|
|
5
9
|
colorTemp: 2
|
|
6
|
-
lightness:
|
|
7
|
-
density:
|
|
10
|
+
lightness: 5
|
|
11
|
+
density: 5
|
|
8
12
|
borderRadius: 3
|
|
9
|
-
tone:
|
|
13
|
+
tone: 3
|
|
10
14
|
anchors:
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
15
|
+
colors:
|
|
16
|
+
primary: "#1E3A5F"
|
|
17
|
+
auxiliary:
|
|
18
|
+
- "#0EA5E9"
|
|
19
|
+
typography:
|
|
20
|
+
baseSize: "16px"
|
|
21
|
+
scale: 1.5
|
|
22
|
+
spacing:
|
|
23
|
+
unit: "8px"
|
|
24
|
+
radius:
|
|
25
|
+
base: "8px"
|
|
26
|
+
structure:
|
|
27
|
+
requiredSections:
|
|
28
|
+
- colors
|
|
29
|
+
- typography
|
|
30
|
+
- spacing
|
|
31
|
+
- rounded
|
|
32
|
+
- elevation
|
|
33
|
+
- components
|
|
34
|
+
- breakpoints
|
|
35
|
+
componentTokens:
|
|
36
|
+
- button
|
|
37
|
+
- input
|
|
38
|
+
- card
|
|
39
|
+
- badge
|
|
40
|
+
- navigation
|
|
41
|
+
- hero-section
|
|
42
|
+
- testimonial
|
|
43
|
+
- footer
|
|
@@ -1,34 +1,43 @@
|
|
|
1
1
|
id: marketing-creative
|
|
2
2
|
name: Marketing Creative
|
|
3
3
|
category: marketing
|
|
4
|
+
intent:
|
|
5
|
+
mood: Bold and expressive — breaks grid expectations to create memorability
|
|
6
|
+
density: Very low density, oversized type and asymmetric layouts demand attention
|
|
7
|
+
philosophy: Rules exist to be broken intentionally; creative risk signals brand confidence
|
|
4
8
|
dimensions:
|
|
5
9
|
colorTemp: 4
|
|
6
|
-
lightness:
|
|
10
|
+
lightness: 4
|
|
7
11
|
density: 5
|
|
8
12
|
borderRadius: 4
|
|
9
13
|
tone: 5
|
|
10
14
|
anchors:
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
15
|
+
colors:
|
|
16
|
+
primary: "#FF3366"
|
|
17
|
+
auxiliary:
|
|
18
|
+
- "#FFCC00"
|
|
19
|
+
typography:
|
|
20
|
+
baseSize: "18px"
|
|
21
|
+
scale: 1.618
|
|
22
|
+
spacing:
|
|
23
|
+
unit: "8px"
|
|
24
|
+
radius:
|
|
25
|
+
base: "16px"
|
|
26
|
+
structure:
|
|
27
|
+
requiredSections:
|
|
28
|
+
- colors
|
|
29
|
+
- typography
|
|
30
|
+
- spacing
|
|
31
|
+
- rounded
|
|
32
|
+
- elevation
|
|
33
|
+
- components
|
|
34
|
+
- breakpoints
|
|
35
|
+
componentTokens:
|
|
36
|
+
- button
|
|
37
|
+
- input
|
|
38
|
+
- card
|
|
39
|
+
- badge
|
|
40
|
+
- navigation
|
|
41
|
+
- hero-section
|
|
42
|
+
- marquee
|
|
43
|
+
- footer
|
|
@@ -1,34 +1,43 @@
|
|
|
1
1
|
id: mobile-lifestyle
|
|
2
2
|
name: Mobile Lifestyle
|
|
3
3
|
category: mobile
|
|
4
|
+
intent:
|
|
5
|
+
mood: Warm and aspirational — feels personal and curated
|
|
6
|
+
density: Low density, large touch targets with generous padding for thumb navigation
|
|
7
|
+
philosophy: Mobile-first means gesture-first; swipe, pull, and long-press as primary interactions
|
|
4
8
|
dimensions:
|
|
5
|
-
colorTemp:
|
|
9
|
+
colorTemp: 4
|
|
6
10
|
lightness: 4
|
|
7
|
-
density:
|
|
11
|
+
density: 4
|
|
8
12
|
borderRadius: 5
|
|
9
13
|
tone: 5
|
|
10
14
|
anchors:
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
15
|
+
colors:
|
|
16
|
+
primary: "#FF6B6B"
|
|
17
|
+
auxiliary:
|
|
18
|
+
- "#FBBF24"
|
|
19
|
+
typography:
|
|
20
|
+
baseSize: "16px"
|
|
21
|
+
scale: 1.25
|
|
22
|
+
spacing:
|
|
23
|
+
unit: "4px"
|
|
24
|
+
radius:
|
|
25
|
+
base: "12px"
|
|
26
|
+
structure:
|
|
27
|
+
requiredSections:
|
|
28
|
+
- colors
|
|
29
|
+
- typography
|
|
30
|
+
- spacing
|
|
31
|
+
- rounded
|
|
32
|
+
- elevation
|
|
33
|
+
- components
|
|
34
|
+
- breakpoints
|
|
35
|
+
componentTokens:
|
|
36
|
+
- button
|
|
37
|
+
- input
|
|
38
|
+
- card
|
|
39
|
+
- avatar
|
|
40
|
+
- badge
|
|
41
|
+
- bottom-sheet
|
|
42
|
+
- tab-bar
|
|
43
|
+
- list-item
|
|
@@ -1,33 +1,43 @@
|
|
|
1
1
|
id: mobile-utility
|
|
2
2
|
name: Mobile Utility
|
|
3
3
|
category: mobile
|
|
4
|
+
intent:
|
|
5
|
+
mood: Efficient and task-oriented — get in, do the thing, get out
|
|
6
|
+
density: Medium density, compact controls optimized for quick task completion
|
|
7
|
+
philosophy: Speed equals respect for user time; minimize taps, maximize glanceability
|
|
4
8
|
dimensions:
|
|
5
9
|
colorTemp: 2
|
|
6
|
-
lightness:
|
|
7
|
-
density:
|
|
8
|
-
borderRadius:
|
|
10
|
+
lightness: 3
|
|
11
|
+
density: 2
|
|
12
|
+
borderRadius: 3
|
|
9
13
|
tone: 2
|
|
10
14
|
anchors:
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
15
|
+
colors:
|
|
16
|
+
primary: "#007AFF"
|
|
17
|
+
auxiliary:
|
|
18
|
+
- "#34C759"
|
|
19
|
+
typography:
|
|
20
|
+
baseSize: "15px"
|
|
21
|
+
scale: 1.2
|
|
22
|
+
spacing:
|
|
23
|
+
unit: "4px"
|
|
24
|
+
radius:
|
|
25
|
+
base: "8px"
|
|
26
|
+
structure:
|
|
27
|
+
requiredSections:
|
|
28
|
+
- colors
|
|
29
|
+
- typography
|
|
30
|
+
- spacing
|
|
31
|
+
- rounded
|
|
32
|
+
- elevation
|
|
33
|
+
- components
|
|
34
|
+
- breakpoints
|
|
35
|
+
componentTokens:
|
|
36
|
+
- button
|
|
37
|
+
- input
|
|
38
|
+
- card
|
|
39
|
+
- badge
|
|
40
|
+
- tab-bar
|
|
41
|
+
- list-item
|
|
42
|
+
- bottom-sheet
|
|
43
|
+
- toggle
|
|
@@ -1,6 +1,10 @@
|
|
|
1
1
|
id: saas-dashboard
|
|
2
2
|
name: SaaS Dashboard
|
|
3
3
|
category: dashboard
|
|
4
|
+
intent:
|
|
5
|
+
mood: Clean and professional — modern B2B aesthetic
|
|
6
|
+
density: Medium density, balanced white space and information
|
|
7
|
+
philosophy: Clarity-first design that builds user trust through consistent spatial rhythm
|
|
4
8
|
dimensions:
|
|
5
9
|
colorTemp: 2
|
|
6
10
|
lightness: 3
|
|
@@ -8,27 +12,32 @@ dimensions:
|
|
|
8
12
|
borderRadius: 3
|
|
9
13
|
tone: 2
|
|
10
14
|
anchors:
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
15
|
+
colors:
|
|
16
|
+
primary: "#635BFF"
|
|
17
|
+
auxiliary:
|
|
18
|
+
- "#0EA5E9"
|
|
19
|
+
typography:
|
|
20
|
+
baseSize: "14px"
|
|
21
|
+
scale: 1.25
|
|
22
|
+
spacing:
|
|
23
|
+
unit: "4px"
|
|
24
|
+
radius:
|
|
25
|
+
base: "8px"
|
|
26
|
+
structure:
|
|
27
|
+
requiredSections:
|
|
28
|
+
- colors
|
|
29
|
+
- typography
|
|
30
|
+
- spacing
|
|
31
|
+
- rounded
|
|
32
|
+
- elevation
|
|
33
|
+
- components
|
|
34
|
+
- breakpoints
|
|
35
|
+
componentTokens:
|
|
36
|
+
- button
|
|
37
|
+
- input
|
|
38
|
+
- card
|
|
39
|
+
- table
|
|
40
|
+
- sidebar
|
|
41
|
+
- modal
|
|
42
|
+
- badge
|
|
43
|
+
- avatar
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"design-md-skill.d.ts","sourceRoot":"","sources":["../../src/templates/design-md-skill.ts"],"names":[],"mappings":"AAAA,wBAAgB,oBAAoB,IAAI,MAAM,
|
|
1
|
+
{"version":3,"file":"design-md-skill.d.ts","sourceRoot":"","sources":["../../src/templates/design-md-skill.ts"],"names":[],"mappings":"AAAA,wBAAgB,oBAAoB,IAAI,MAAM,CAiP7C"}
|