@tienne/gestalt 0.18.2 → 0.19.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/README.md +68 -1
- package/dist/package.json +1 -1
- package/dist/role-agents/presentation-designer/templates/broadside.html +11 -11
- package/dist/role-agents/presentation-designer/templates/editorial-forest.html +8 -8
- package/dist/role-agents/presentation-designer/templates/emerald-editorial.html +6 -6
- package/dist/role-agents/presentation-designer/templates/neo-grid.html +7 -7
- package/dist/role-agents/presentation-designer/templates/pin-and-paper.html +8 -8
- package/dist/role-agents/presentation-designer/templates/pink-script.html +4 -4
- package/dist/role-agents/presentation-designer/templates/sakura-chroma.html +4 -4
- package/dist/role-agents/presentation-designer/templates/signal.html +12 -12
- package/dist/role-agents/presentation-designer/templates/stencil-tablet.html +8 -8
- package/dist/role-agents/presentation-designer/templates/studio.html +11 -11
- package/dist/role-agents/technical-writer/AGENT.md +36 -304
- package/dist/role-agents/technical-writer/references/style-guide.md +131 -0
- package/dist/schemas/gestalt.schema.json +6 -0
- package/dist/src/core/config.d.ts +3 -0
- package/dist/src/core/config.d.ts.map +1 -1
- package/dist/src/core/config.js +3 -0
- package/dist/src/core/config.js.map +1 -1
- package/dist/src/execute/rule-writer.d.ts +4 -3
- package/dist/src/execute/rule-writer.d.ts.map +1 -1
- package/dist/src/execute/rule-writer.js +72 -15
- package/dist/src/execute/rule-writer.js.map +1 -1
- package/dist/src/mcp/server.js +1 -1
- package/dist/src/mcp/server.js.map +1 -1
- package/dist/src/mcp/tools/execute-passthrough.d.ts +2 -1
- package/dist/src/mcp/tools/execute-passthrough.d.ts.map +1 -1
- package/dist/src/mcp/tools/execute-passthrough.js +8 -8
- package/dist/src/mcp/tools/execute-passthrough.js.map +1 -1
- package/package.json +1 -1
- package/role-agents/presentation-designer/templates/broadside.html +11 -11
- package/role-agents/presentation-designer/templates/editorial-forest.html +8 -8
- package/role-agents/presentation-designer/templates/emerald-editorial.html +6 -6
- package/role-agents/presentation-designer/templates/neo-grid.html +7 -7
- package/role-agents/presentation-designer/templates/pin-and-paper.html +8 -8
- package/role-agents/presentation-designer/templates/pink-script.html +4 -4
- package/role-agents/presentation-designer/templates/sakura-chroma.html +4 -4
- package/role-agents/presentation-designer/templates/signal.html +12 -12
- package/role-agents/presentation-designer/templates/stencil-tablet.html +8 -8
- package/role-agents/presentation-designer/templates/studio.html +11 -11
- package/role-agents/technical-writer/AGENT.md +36 -304
- package/role-agents/technical-writer/references/style-guide.md +131 -0
- package/schemas/gestalt.schema.json +6 -0
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
<title>Editorial Forest — Reveal.js</title>
|
|
6
6
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
7
7
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
8
|
-
<link href="https://fonts.googleapis.com/css2?family=Source+Serif+4:opsz,wght@8..60,300;8..60,400;8..60,500;8..60,600;8..60,700;8..60,800&family=JetBrains+Mono:wght@400;500;700&display=swap" rel="stylesheet" />
|
|
8
|
+
<link href="https://fonts.googleapis.com/css2?family=Source+Serif+4:opsz,wght@8..60,300;8..60,400;8..60,500;8..60,600;8..60,700;8..60,800&family=JetBrains+Mono:wght@400;500;700&family=Noto+Serif+KR:wght@400;500;700&display=swap" rel="stylesheet" />
|
|
9
9
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5/dist/reveal.css" />
|
|
10
10
|
<style>
|
|
11
11
|
:root {
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
--cream: #efe7d4;
|
|
18
18
|
--cream-2: #e6dcc4;
|
|
19
19
|
--ink: #1a1a17;
|
|
20
|
-
--serif: "Source Serif 4", Georgia, serif;
|
|
20
|
+
--serif: "Source Serif 4", "Noto Serif KR", Georgia, serif;
|
|
21
21
|
--mono: "JetBrains Mono", monospace;
|
|
22
22
|
}
|
|
23
23
|
|
|
@@ -53,12 +53,12 @@
|
|
|
53
53
|
}
|
|
54
54
|
|
|
55
55
|
/* TYPOGRAPHY */
|
|
56
|
-
.t-display { font-family: var(--serif); font-weight: 800; line-height:
|
|
57
|
-
.t-title { font-family: var(--serif); font-weight: 700; font-size: clamp(36px, 5.5vw, 88px); line-height: 1.
|
|
58
|
-
.t-head { font-family: var(--serif); font-weight: 600; font-size: clamp(22px, 3vw, 48px); line-height: 1.
|
|
59
|
-
.t-body { font-family: var(--serif); font-weight: 400; font-size: clamp(14px, 1.5vw, 22px); line-height: 1.
|
|
56
|
+
.t-display { font-family: var(--serif); font-weight: 800; line-height: 1.05; letter-spacing: -0.02em; font-size: clamp(72px, 12vw, 190px); }
|
|
57
|
+
.t-title { font-family: var(--serif); font-weight: 700; font-size: clamp(36px, 5.5vw, 88px); line-height: 1.2; }
|
|
58
|
+
.t-head { font-family: var(--serif); font-weight: 600; font-size: clamp(22px, 3vw, 48px); line-height: 1.3; }
|
|
59
|
+
.t-body { font-family: var(--serif); font-weight: 400; font-size: clamp(14px, 1.5vw, 22px); line-height: 1.75; }
|
|
60
60
|
.t-label { font-family: var(--mono); font-weight: 500; font-size: clamp(10px, 1.1vw, 16px); letter-spacing: 0.18em; text-transform: uppercase; }
|
|
61
|
-
.t-big { font-family: var(--serif); font-weight: 500; font-size: clamp(80px, 13vw, 210px); line-height:
|
|
61
|
+
.t-big { font-family: var(--serif); font-weight: 500; font-size: clamp(80px, 13vw, 210px); line-height: 1.05; letter-spacing: -0.03em; }
|
|
62
62
|
|
|
63
63
|
/* TOPIC CARD (agenda grid) */
|
|
64
64
|
.topic {
|
|
@@ -94,7 +94,7 @@
|
|
|
94
94
|
|
|
95
95
|
/* KPI */
|
|
96
96
|
.kpi { display: flex; flex-direction: column; gap: 0.75rem; padding-top: 2vh; border-top: 2px solid var(--pink); }
|
|
97
|
-
.kpi .big { font-family: var(--serif); font-weight: 500; font-size: clamp(80px,13vw,210px); line-height:
|
|
97
|
+
.kpi .big { font-family: var(--serif); font-weight: 500; font-size: clamp(80px,13vw,210px); line-height: 1.05; letter-spacing: -0.03em; color: var(--pink); }
|
|
98
98
|
.kpi .big .unit { font-size: 0.5em; color: var(--cream); margin-left: 4px; }
|
|
99
99
|
|
|
100
100
|
/* BAR CHART */
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
<title>Emerald Editorial — Reveal.js</title>
|
|
6
6
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
7
7
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
8
|
-
<link href="https://fonts.googleapis.com/css2?family=Bodoni+Moda:wght@500;700;800;900&family=Manrope:wght@400;500;600;700;800&display=swap" rel="stylesheet" />
|
|
8
|
+
<link href="https://fonts.googleapis.com/css2?family=Bodoni+Moda:wght@500;700;800;900&family=Manrope:wght@400;500;600;700;800&family=Noto+Sans+KR:wght@400;500;700&display=swap" rel="stylesheet" />
|
|
9
9
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5/dist/reveal.css" />
|
|
10
10
|
<style>
|
|
11
11
|
:root {
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
--display-font: 'Bodoni Moda', serif;
|
|
20
20
|
}
|
|
21
21
|
|
|
22
|
-
.reveal { font-family: 'Manrope', sans-serif; }
|
|
22
|
+
.reveal { font-family: 'Manrope', 'Noto Sans KR', sans-serif; }
|
|
23
23
|
.reveal .slides { text-align: left; }
|
|
24
24
|
.reveal .slides section {
|
|
25
25
|
box-sizing: border-box;
|
|
@@ -88,17 +88,17 @@
|
|
|
88
88
|
.t-display {
|
|
89
89
|
font-family: var(--display-font);
|
|
90
90
|
font-weight: 900;
|
|
91
|
-
line-height:
|
|
91
|
+
line-height: 1.05;
|
|
92
92
|
letter-spacing: -0.01em;
|
|
93
93
|
color: var(--ink);
|
|
94
94
|
}
|
|
95
95
|
.t-display.xl { font-size: clamp(100px, 18vw, 280px); }
|
|
96
96
|
.t-display.lg { font-size: clamp(60px, 10vw, 160px); }
|
|
97
97
|
.t-display.md { font-size: clamp(36px, 5.5vw, 88px); }
|
|
98
|
-
.t-head { font-family: var(--display-font); font-weight: 700; font-size: clamp(24px, 3.5vw, 52px); line-height: 1.
|
|
99
|
-
.t-body { font-size: clamp(14px, 1.5vw, 22px); line-height: 1.
|
|
98
|
+
.t-head { font-family: var(--display-font); font-weight: 700; font-size: clamp(24px, 3.5vw, 52px); line-height: 1.3; color: var(--ink); }
|
|
99
|
+
.t-body { font-size: clamp(14px, 1.5vw, 22px); line-height: 1.75; color: var(--ink); font-weight: 400; }
|
|
100
100
|
.t-label { font-family: 'Manrope', sans-serif; font-size: clamp(11px, 1.1vw, 16px); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink); opacity: 0.7; }
|
|
101
|
-
.t-num { font-family: var(--display-font); font-weight: 900; font-size: clamp(60px, 9vw, 140px); line-height:
|
|
101
|
+
.t-num { font-family: var(--display-font); font-weight: 900; font-size: clamp(60px, 9vw, 140px); line-height: 1.05; color: var(--ink); }
|
|
102
102
|
|
|
103
103
|
/* PAPER PANEL */
|
|
104
104
|
.panel-paper { background: var(--paper); }
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
<title>Neo-Grid Bold — Reveal.js</title>
|
|
6
6
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
7
7
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
8
|
-
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet" />
|
|
8
|
+
<link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;700&family=JetBrains+Mono:wght@400;500&family=Noto+Sans+KR:wght@400;500;700&display=swap" rel="stylesheet" />
|
|
9
9
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5/dist/reveal.css" />
|
|
10
10
|
<style>
|
|
11
11
|
/* ── DESIGN TOKENS ────────────────────────────────────────────── */
|
|
@@ -18,7 +18,7 @@
|
|
|
18
18
|
}
|
|
19
19
|
|
|
20
20
|
/* ── REVEAL RESET ─────────────────────────────────────────────── */
|
|
21
|
-
.reveal { font-family: "Space Grotesk", sans-serif; }
|
|
21
|
+
.reveal { font-family: "Space Grotesk", "Noto Sans KR", sans-serif; }
|
|
22
22
|
.reveal .slides { text-align: left; }
|
|
23
23
|
.reveal .slides section {
|
|
24
24
|
box-sizing: border-box;
|
|
@@ -99,27 +99,27 @@
|
|
|
99
99
|
.t-display {
|
|
100
100
|
font-weight: 700;
|
|
101
101
|
font-size: clamp(48px, 8vw, 128px);
|
|
102
|
-
line-height:
|
|
102
|
+
line-height: 1.05;
|
|
103
103
|
letter-spacing: -0.02em;
|
|
104
104
|
text-transform: uppercase;
|
|
105
105
|
}
|
|
106
106
|
.t-title {
|
|
107
107
|
font-weight: 700;
|
|
108
108
|
font-size: clamp(36px, 5.5vw, 88px);
|
|
109
|
-
line-height:
|
|
109
|
+
line-height: 1.05;
|
|
110
110
|
letter-spacing: -0.015em;
|
|
111
111
|
text-transform: uppercase;
|
|
112
112
|
}
|
|
113
113
|
.t-subtitle {
|
|
114
114
|
font-weight: 700;
|
|
115
115
|
font-size: clamp(24px, 3.5vw, 56px);
|
|
116
|
-
line-height: 1;
|
|
116
|
+
line-height: 1.2;
|
|
117
117
|
letter-spacing: -0.01em;
|
|
118
118
|
text-transform: uppercase;
|
|
119
119
|
}
|
|
120
|
-
.t-body { font-size: clamp(14px, 1.6vw, 26px); line-height: 1.
|
|
120
|
+
.t-body { font-size: clamp(14px, 1.6vw, 26px); line-height: 1.75; font-weight: 400; }
|
|
121
121
|
.t-label { font-family: "JetBrains Mono", monospace; font-size: clamp(10px, 1.2vw, 20px); letter-spacing: 0.08em; text-transform: uppercase; opacity: 0.7; }
|
|
122
|
-
.t-stat { font-weight: 700; font-size: clamp(64px, 11vw, 180px); line-height:
|
|
122
|
+
.t-stat { font-weight: 700; font-size: clamp(64px, 11vw, 180px); line-height: 1.05; letter-spacing: -0.03em; }
|
|
123
123
|
.t-stat.sm { font-size: clamp(48px, 7vw, 112px); }
|
|
124
124
|
|
|
125
125
|
mark { background: var(--accent); color: var(--ink); padding: 0 4px; }
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
<title>Pin & Paper — Reveal.js</title>
|
|
6
6
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
7
7
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
8
|
-
<link href="https://fonts.googleapis.com/css2?family=Caveat:wght@500;600;700&family=Space+Grotesk:wght@400;500;600;700&family=DM+Mono:wght@400;500&display=swap" rel="stylesheet" />
|
|
8
|
+
<link href="https://fonts.googleapis.com/css2?family=Caveat:wght@500;600;700&family=Space+Grotesk:wght@400;500;600;700&family=DM+Mono:wght@400;500&family=Noto+Sans+KR:wght@400;500;700&display=swap" rel="stylesheet" />
|
|
9
9
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5/dist/reveal.css" />
|
|
10
10
|
<style>
|
|
11
11
|
:root {
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
--orange: #D8702A;
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
.reveal { font-family: 'Space Grotesk', sans-serif; }
|
|
25
|
+
.reveal { font-family: 'Space Grotesk', 'Noto Sans KR', sans-serif; }
|
|
26
26
|
.reveal .slides { text-align: left; }
|
|
27
27
|
.reveal .slides section {
|
|
28
28
|
box-sizing: border-box;
|
|
@@ -54,13 +54,13 @@
|
|
|
54
54
|
}
|
|
55
55
|
|
|
56
56
|
/* TYPOGRAPHY */
|
|
57
|
-
.t-display { font-weight: 700; font-size: clamp(60px,10vw,160px); line-height:
|
|
58
|
-
.t-title { font-weight: 700; font-size: clamp(36px,5.5vw,84px); line-height:
|
|
59
|
-
.t-head { font-weight: 700; font-size: clamp(20px,2.8vw,44px); line-height: 1.
|
|
60
|
-
.t-body { font-size: clamp(13px,1.5vw,22px); line-height: 1.
|
|
57
|
+
.t-display { font-weight: 700; font-size: clamp(60px,10vw,160px); line-height: 1.05; letter-spacing: -0.02em; }
|
|
58
|
+
.t-title { font-weight: 700; font-size: clamp(36px,5.5vw,84px); line-height: 1.05; letter-spacing: -0.015em; }
|
|
59
|
+
.t-head { font-weight: 700; font-size: clamp(20px,2.8vw,44px); line-height: 1.3; }
|
|
60
|
+
.t-body { font-size: clamp(13px,1.5vw,22px); line-height: 1.75; font-weight: 400; }
|
|
61
61
|
.t-label { font-family: 'DM Mono', monospace; font-size: clamp(10px,1.1vw,16px); letter-spacing: 0.12em; text-transform: uppercase; font-weight: 500; }
|
|
62
|
-
.t-script { font-family: 'Caveat', cursive; font-weight: 600; font-size: clamp(20px,2.5vw,40px); line-height: 1.
|
|
63
|
-
.t-num { font-weight: 700; font-size: clamp(50px,8vw,120px); line-height: 1; letter-spacing: -0.02em; }
|
|
62
|
+
.t-script { font-family: 'Caveat', cursive; font-weight: 600; font-size: clamp(20px,2.5vw,40px); line-height: 1.3; }
|
|
63
|
+
.t-num { font-weight: 700; font-size: clamp(50px,8vw,120px); line-height: 1.1; letter-spacing: -0.02em; }
|
|
64
64
|
|
|
65
65
|
/* STAMP */
|
|
66
66
|
.stamp {
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
<title>Pink Script — After Hours — Reveal.js</title>
|
|
6
6
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
7
7
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
8
|
-
<link href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0&family=Inter:wght@300;400;500;600&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet" />
|
|
8
|
+
<link href="https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0&family=Inter:wght@300;400;500;600&family=JetBrains+Mono:wght@400;500&family=Noto+Sans+KR:wght@400;500;600&display=swap" rel="stylesheet" />
|
|
9
9
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5/dist/reveal.css" />
|
|
10
10
|
<style>
|
|
11
11
|
:root {
|
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
--hair: rgba(245, 237, 241, 0.14);
|
|
21
21
|
}
|
|
22
22
|
|
|
23
|
-
.reveal { font-family: 'Inter', sans-serif; }
|
|
23
|
+
.reveal { font-family: 'Inter', 'Noto Sans KR', sans-serif; }
|
|
24
24
|
.reveal .slides { text-align: left; }
|
|
25
25
|
.reveal .slides section {
|
|
26
26
|
box-sizing: border-box;
|
|
@@ -60,7 +60,7 @@
|
|
|
60
60
|
.footer .pageno em { color: var(--pink); font-style: normal; }
|
|
61
61
|
|
|
62
62
|
/* TYPOGRAPHY */
|
|
63
|
-
.script { font-family: 'DM Serif Display', serif; font-weight: 400; color: var(--pink); letter-spacing: -0.01em; line-height: 1.
|
|
63
|
+
.script { font-family: 'DM Serif Display', serif; font-weight: 400; color: var(--pink); letter-spacing: -0.01em; line-height: 1.2; padding-bottom: 0.12em; }
|
|
64
64
|
.script.huge { font-size: clamp(100px,20vw,380px); }
|
|
65
65
|
.script.giant { font-size: clamp(70px, 14vw,250px); }
|
|
66
66
|
.script.large { font-size: clamp(50px, 9vw, 150px); }
|
|
@@ -72,7 +72,7 @@
|
|
|
72
72
|
.rule.thin { opacity: 0.25; background: var(--paper); }
|
|
73
73
|
|
|
74
74
|
/* STAT FIGURE */
|
|
75
|
-
.stat-figure { font-family: 'DM Serif Display', serif; font-size: clamp(60px,9vw,140px); line-height:
|
|
75
|
+
.stat-figure { font-family: 'DM Serif Display', serif; font-size: clamp(60px,9vw,140px); line-height: 1.05; color: var(--pink); display: flex; align-items: baseline; }
|
|
76
76
|
.stat-unit { font-size: 0.5em; color: var(--paper); margin-left: 4px; }
|
|
77
77
|
|
|
78
78
|
/* PILL (matrix) */
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
<title>Sakura Chroma — Reveal.js</title>
|
|
6
6
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
7
7
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
8
|
-
<link href="https://fonts.googleapis.com/css2?family=Big+Shoulders+Display:wght@500;700;800;900&family=Albert+Sans:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&family=Noto+Sans+JP:wght@500;700&display=swap" rel="stylesheet" />
|
|
8
|
+
<link href="https://fonts.googleapis.com/css2?family=Big+Shoulders+Display:wght@500;700;800;900&family=Albert+Sans:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500&family=Noto+Sans+JP:wght@500;700&family=Noto+Sans+KR:wght@400;500;700&display=swap" rel="stylesheet" />
|
|
9
9
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5/dist/reveal.css" />
|
|
10
10
|
<style>
|
|
11
11
|
:root {
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
--line: #3A2516;
|
|
22
22
|
}
|
|
23
23
|
|
|
24
|
-
.reveal { font-family: 'Albert Sans', sans-serif; }
|
|
24
|
+
.reveal { font-family: 'Albert Sans', 'Noto Sans KR', sans-serif; }
|
|
25
25
|
.reveal .slides { text-align: left; }
|
|
26
26
|
.reveal .slides section {
|
|
27
27
|
box-sizing: border-box;
|
|
@@ -61,9 +61,9 @@
|
|
|
61
61
|
}
|
|
62
62
|
|
|
63
63
|
/* TYPOGRAPHY */
|
|
64
|
-
.disp { font-family: 'Big Shoulders Display', sans-serif; font-weight: 900; line-height:
|
|
64
|
+
.disp { font-family: 'Big Shoulders Display', sans-serif; font-weight: 900; line-height: 1.05; letter-spacing: -0.012em; }
|
|
65
65
|
.micro { font-family: 'Albert Sans', sans-serif; font-weight: 700; text-transform: uppercase; letter-spacing: 0.16em; font-size: clamp(10px,1.1vw,15px); }
|
|
66
|
-
.body-tx { font-family: 'Albert Sans', sans-serif; font-weight: 400; line-height: 1.
|
|
66
|
+
.body-tx { font-family: 'Albert Sans', sans-serif; font-weight: 400; line-height: 1.75; font-size: clamp(13px,1.4vw,21px); }
|
|
67
67
|
.mono { font-family: 'JetBrains Mono', monospace; font-weight: 400; font-size: clamp(10px,1.1vw,15px); }
|
|
68
68
|
.jp { font-family: 'Noto Sans JP', sans-serif; font-weight: 500; }
|
|
69
69
|
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
<title>Signal — Reveal.js</title>
|
|
6
6
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
7
7
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
8
|
-
<link href="https://fonts.googleapis.com/css2?family=Source+Serif+4:ital,opsz,wght@0,8..60,300;0,8..60,400;0,8..60,600;0,8..60,700;1,8..60,300;1,8..60,400;1,8..60,600;1,8..60,700&family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500;9..40,600&family=IBM+Plex+Mono:wght@300;400;500&display=swap" rel="stylesheet" />
|
|
8
|
+
<link href="https://fonts.googleapis.com/css2?family=Source+Serif+4:ital,opsz,wght@0,8..60,300;0,8..60,400;0,8..60,600;0,8..60,700;1,8..60,300;1,8..60,400;1,8..60,600;1,8..60,700&family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500;9..40,600&family=IBM+Plex+Mono:wght@300;400;500&family=Noto+Serif+KR:wght@400;600;700&family=Noto+Sans+KR:wght@400;500&display=swap" rel="stylesheet" />
|
|
9
9
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5/dist/reveal.css" />
|
|
10
10
|
<style>
|
|
11
11
|
/* ── DESIGN TOKENS ────────────────────────────────────────────── */
|
|
@@ -23,9 +23,9 @@
|
|
|
23
23
|
--c-accent: #c8a870;
|
|
24
24
|
--c-border: #2e3d5c;
|
|
25
25
|
--c-border-light: #cac4b4;
|
|
26
|
-
--f-display: "Source Serif 4", serif;
|
|
27
|
-
--f-heading: "Source Serif 4", serif;
|
|
28
|
-
--f-body: "DM Sans", sans-serif;
|
|
26
|
+
--f-display: "Source Serif 4", "Noto Serif KR", serif;
|
|
27
|
+
--f-heading: "Source Serif 4", "Noto Serif KR", serif;
|
|
28
|
+
--f-body: "DM Sans", "Noto Sans KR", sans-serif;
|
|
29
29
|
--f-mono: "IBM Plex Mono", monospace;
|
|
30
30
|
--sz-display: 9.5vw;
|
|
31
31
|
--sz-h1: 5.2vw;
|
|
@@ -112,13 +112,13 @@
|
|
|
112
112
|
.slide--compare .slide-body { display: grid; grid-template-columns: 1fr 1fr; height: 100%; }
|
|
113
113
|
|
|
114
114
|
/* ── TYPOGRAPHY ───────────────────────────────────────────────── */
|
|
115
|
-
.display { font-family: var(--f-display); font-size: var(--sz-display); font-weight: 700; line-height:
|
|
116
|
-
.h1 { font-family: var(--f-heading); font-size: var(--sz-h1); font-weight: 700; line-height:
|
|
117
|
-
.h2 { font-family: var(--f-heading); font-size: var(--sz-h2); font-weight: 600; line-height: 1.
|
|
118
|
-
.h3 { font-size: var(--sz-h3); font-weight: 500; line-height: 1.
|
|
119
|
-
.lead { font-size: var(--sz-lead); font-weight: 400; line-height: 1.
|
|
120
|
-
.body { font-size: var(--sz-body); font-weight: 400; line-height: 1.
|
|
121
|
-
.caption { font-size: var(--sz-caption); line-height: 1.
|
|
115
|
+
.display { font-family: var(--f-display); font-size: var(--sz-display); font-weight: 700; line-height: 1.05; letter-spacing: -0.02em; }
|
|
116
|
+
.h1 { font-family: var(--f-heading); font-size: var(--sz-h1); font-weight: 700; line-height: 1.05; letter-spacing: -0.01em; }
|
|
117
|
+
.h2 { font-family: var(--f-heading); font-size: var(--sz-h2); font-weight: 600; line-height: 1.3; }
|
|
118
|
+
.h3 { font-size: var(--sz-h3); font-weight: 500; line-height: 1.4; }
|
|
119
|
+
.lead { font-size: var(--sz-lead); font-weight: 400; line-height: 1.7; }
|
|
120
|
+
.body { font-size: var(--sz-body); font-weight: 400; line-height: 1.75; }
|
|
121
|
+
.caption { font-size: var(--sz-caption); line-height: 1.7; }
|
|
122
122
|
.label { font-family: var(--f-mono); font-size: var(--sz-label); font-weight: 500; letter-spacing: 0.08em; text-transform: uppercase; }
|
|
123
123
|
.kicker { font-family: var(--f-mono); font-size: var(--sz-label); letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-accent); display: block; margin-bottom: var(--gap-sm); }
|
|
124
124
|
.muted { opacity: 0.5; }
|
|
@@ -153,7 +153,7 @@
|
|
|
153
153
|
}
|
|
154
154
|
|
|
155
155
|
.bullet-list { list-style: none; padding: 0; display: flex; flex-direction: column; gap: var(--gap-sm); }
|
|
156
|
-
.bullet-list li { display: flex; gap: 0.75em; font-size: var(--sz-body); line-height: 1.
|
|
156
|
+
.bullet-list li { display: flex; gap: 0.75em; font-size: var(--sz-body); line-height: 1.75; }
|
|
157
157
|
.bullet-list li::before { content: "—"; color: var(--c-accent); flex-shrink: 0; }
|
|
158
158
|
|
|
159
159
|
.cover-meta {
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
<title>Stencil & Tablet — Reveal.js</title>
|
|
6
6
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
7
7
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
8
|
-
<link href="https://fonts.googleapis.com/css2?family=Bowlby+One&family=Stardos+Stencil:wght@400;700&family=Barlow+Condensed:wght@500;600;700;800;900&family=Inter:wght@400;500;600&display=swap" rel="stylesheet" />
|
|
8
|
+
<link href="https://fonts.googleapis.com/css2?family=Bowlby+One&family=Stardos+Stencil:wght@400;700&family=Barlow+Condensed:wght@500;600;700;800;900&family=Inter:wght@400;500;600&family=Noto+Sans+KR:wght@400;500;700&display=swap" rel="stylesheet" />
|
|
9
9
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5/dist/reveal.css" />
|
|
10
10
|
<style>
|
|
11
11
|
:root {
|
|
@@ -22,7 +22,7 @@
|
|
|
22
22
|
--olive: #6F7A2E;
|
|
23
23
|
}
|
|
24
24
|
|
|
25
|
-
.reveal { font-family: 'Barlow Condensed', sans-serif; }
|
|
25
|
+
.reveal { font-family: 'Barlow Condensed', 'Noto Sans KR', sans-serif; }
|
|
26
26
|
.reveal .slides { text-align: left; }
|
|
27
27
|
.reveal .slides section {
|
|
28
28
|
box-sizing: border-box;
|
|
@@ -56,10 +56,10 @@
|
|
|
56
56
|
|
|
57
57
|
/* TYPOGRAPHY */
|
|
58
58
|
.stencil { font-family: 'Stardos Stencil', serif; font-weight: 700; }
|
|
59
|
-
.t-display { font-size: clamp(100px,16vw,260px); line-height:
|
|
60
|
-
.t-title { font-size: clamp(50px, 8vw, 130px); line-height:
|
|
61
|
-
.t-head { font-size: clamp(24px, 3.5vw, 54px); line-height: 1.
|
|
62
|
-
.t-body { font-family: 'Inter', sans-serif; font-size: clamp(13px, 1.4vw, 20px); line-height: 1.
|
|
59
|
+
.t-display { font-size: clamp(100px,16vw,260px); line-height: 1.05; letter-spacing: -0.02em; }
|
|
60
|
+
.t-title { font-size: clamp(50px, 8vw, 130px); line-height: 1.05; letter-spacing: -0.01em; font-weight: 900; text-transform: uppercase; }
|
|
61
|
+
.t-head { font-size: clamp(24px, 3.5vw, 54px); line-height: 1.2; font-weight: 800; text-transform: uppercase; letter-spacing: 0.02em; }
|
|
62
|
+
.t-body { font-family: 'Inter', sans-serif; font-size: clamp(13px, 1.4vw, 20px); line-height: 1.75; font-weight: 400; }
|
|
63
63
|
.t-label { font-family: 'Barlow Condensed', sans-serif; font-size: clamp(12px,1.3vw,18px); font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; }
|
|
64
64
|
|
|
65
65
|
/* TABLET CARD */
|
|
@@ -67,7 +67,7 @@
|
|
|
67
67
|
border-radius: 22px; padding: clamp(20px,3vh,34px) clamp(18px,2.5vw,30px);
|
|
68
68
|
display: flex; flex-direction: column; position: relative; overflow: hidden;
|
|
69
69
|
}
|
|
70
|
-
.tablet .num { font-family: 'Stardos Stencil', serif; font-weight: 700; line-height:
|
|
70
|
+
.tablet .num { font-family: 'Stardos Stencil', serif; font-weight: 700; line-height: 1.05; font-size: clamp(80px,12vw,180px); letter-spacing: -0.02em; }
|
|
71
71
|
.tablet h3 { font-family: 'Stardos Stencil', serif; font-weight: 700; font-size: clamp(16px,2vw,28px); text-transform: uppercase; letter-spacing: 0.02em; margin-top: auto; margin-bottom: 0.5rem; }
|
|
72
72
|
.tablet.dark { background: var(--ink); color: var(--bone); }
|
|
73
73
|
|
|
@@ -76,7 +76,7 @@
|
|
|
76
76
|
border-radius: 22px; padding: clamp(18px,2.5vh,28px) clamp(16px,2vw,26px);
|
|
77
77
|
display: flex; flex-direction: column; gap: 0.75rem;
|
|
78
78
|
}
|
|
79
|
-
.stat-num { font-family: 'Stardos Stencil', serif; font-weight: 700; font-size: clamp(60px,9vw,140px); line-height:
|
|
79
|
+
.stat-num { font-family: 'Stardos Stencil', serif; font-weight: 700; font-size: clamp(60px,9vw,140px); line-height: 1.05; letter-spacing: -0.02em; }
|
|
80
80
|
|
|
81
81
|
/* PROCESS NODE */
|
|
82
82
|
.node {
|
|
@@ -5,7 +5,7 @@
|
|
|
5
5
|
<title>Studio — Reveal.js</title>
|
|
6
6
|
<link rel="preconnect" href="https://fonts.googleapis.com" />
|
|
7
7
|
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
|
|
8
|
-
<link href="https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;700;800;900&family=IBM+Plex+Mono:wght@300;400;500&display=swap" rel="stylesheet" />
|
|
8
|
+
<link href="https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;700;800;900&family=IBM+Plex+Mono:wght@300;400;500&family=Noto+Sans+KR:wght@400;500;700;900&display=swap" rel="stylesheet" />
|
|
9
9
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/reveal.js@5/dist/reveal.css" />
|
|
10
10
|
<style>
|
|
11
11
|
/* ── DESIGN TOKENS ────────────────────────────────────────────── */
|
|
@@ -23,8 +23,8 @@
|
|
|
23
23
|
--c-accent: #f5d200;
|
|
24
24
|
--c-border: #2e2e2c;
|
|
25
25
|
--c-border-light: rgba(28, 28, 28, 0.18);
|
|
26
|
-
--f-display: "Barlow", sans-serif;
|
|
27
|
-
--f-body: "Barlow", sans-serif;
|
|
26
|
+
--f-display: "Barlow", "Noto Sans KR", sans-serif;
|
|
27
|
+
--f-body: "Barlow", "Noto Sans KR", sans-serif;
|
|
28
28
|
--f-mono: "IBM Plex Mono", monospace;
|
|
29
29
|
--sz-display: 12vw;
|
|
30
30
|
--sz-h1: 7.5vw;
|
|
@@ -98,13 +98,13 @@
|
|
|
98
98
|
.slide--compare .slide-body { display: grid; grid-template-columns: 1fr 1fr; height: 100%; }
|
|
99
99
|
|
|
100
100
|
/* ── TYPOGRAPHY ───────────────────────────────────────────────── */
|
|
101
|
-
.display { font-size: var(--sz-display); font-weight: 900; line-height:
|
|
102
|
-
.h1 { font-size: var(--sz-h1); font-weight: 900; line-height:
|
|
103
|
-
.h2 { font-size: var(--sz-h2); font-weight: 900; line-height:
|
|
104
|
-
.h3 { font-size: var(--sz-h3); font-weight: 700; line-height: 1.
|
|
105
|
-
.lead { font-size: var(--sz-lead); font-weight: 500; line-height: 1.
|
|
106
|
-
.body { font-size: var(--sz-body); font-weight: 400; line-height: 1.
|
|
107
|
-
.caption { font-size: var(--sz-caption); line-height: 1.
|
|
101
|
+
.display { font-size: var(--sz-display); font-weight: 900; line-height: 1.05; letter-spacing: -0.02em; text-transform: uppercase; }
|
|
102
|
+
.h1 { font-size: var(--sz-h1); font-weight: 900; line-height: 1.05; letter-spacing: -0.02em; text-transform: uppercase; }
|
|
103
|
+
.h2 { font-size: var(--sz-h2); font-weight: 900; line-height: 1.05; letter-spacing: -0.01em; text-transform: uppercase; }
|
|
104
|
+
.h3 { font-size: var(--sz-h3); font-weight: 700; line-height: 1.3; text-transform: uppercase; }
|
|
105
|
+
.lead { font-size: var(--sz-lead); font-weight: 500; line-height: 1.7; }
|
|
106
|
+
.body { font-size: var(--sz-body); font-weight: 400; line-height: 1.75; }
|
|
107
|
+
.caption { font-size: var(--sz-caption); line-height: 1.7; }
|
|
108
108
|
.label { font-family: var(--f-mono); font-size: var(--sz-label); font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; }
|
|
109
109
|
.kicker { font-family: var(--f-mono); font-size: var(--sz-label); letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-accent); display: block; margin-bottom: var(--gap-sm); }
|
|
110
110
|
.dark .kicker { color: var(--c-accent); }
|
|
@@ -125,7 +125,7 @@
|
|
|
125
125
|
}
|
|
126
126
|
|
|
127
127
|
.bullet-list { list-style: none; padding: 0; display: flex; flex-direction: column; gap: var(--gap-sm); }
|
|
128
|
-
.bullet-list li { display: flex; gap: 0.75em; font-size: var(--sz-body); line-height: 1.
|
|
128
|
+
.bullet-list li { display: flex; gap: 0.75em; font-size: var(--sz-body); line-height: 1.75; }
|
|
129
129
|
.dark .bullet-list li::before { content: "—"; color: var(--c-accent); flex-shrink: 0; }
|
|
130
130
|
.light .bullet-list li::before { content: "—"; color: var(--c-fg-light); flex-shrink: 0; }
|
|
131
131
|
|