@zvndev/darkmown 1.3.0 → 1.5.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/AGENTS.md +2 -0
- package/CHANGELOG.md +19 -0
- package/README.md +114 -1
- package/docs/spec-alignment.md +30 -0
- package/package.json +1 -1
- package/site/_/base.skin +231 -18
- package/site/_/nav.wd +1 -1
- package/site/_/scoped-promo.skin +43 -0
- package/site/_/scoped-promo.wd +10 -0
- package/site/_/scoped-stat.skin +32 -0
- package/site/_/scoped-stat.wd +9 -0
- package/site/pages/app.skin +27 -5
- package/site/pages/blog/_schema.wd +15 -0
- package/site/pages/blog/collections-and-pagination.md +38 -0
- package/site/pages/blog/drafts-that-never-leak.md +2 -0
- package/site/pages/blog/index.skin +144 -0
- package/site/pages/blog/index.wd +73 -0
- package/site/pages/blog/shipping-feeds.md +1 -0
- package/site/pages/blog/typed-frontmatter.md +45 -0
- package/site/pages/blog/zero-js-by-default.md +31 -0
- package/site/pages/data.skin +50 -9
- package/site/pages/docs/index.wd +70 -0
- package/site/pages/loops.skin +43 -6
- package/site/pages/reactive.skin +38 -6
- package/site/pages/scoped/index.skin +23 -0
- package/site/pages/scoped/index.wd +47 -0
- package/site/pages/store.skin +43 -6
- package/src/builder.js +213 -32
- package/src/compiler/collections.js +316 -0
- package/src/compiler/context.js +34 -2
- package/src/compiler/directives.js +11 -5
- package/src/compiler/includes.js +48 -1
- package/src/compiler/index.js +1 -1
- package/src/compiler/loops.js +130 -12
- package/src/compiler/page.js +93 -9
- package/src/compiler.js +2 -1
- package/src/skin.js +147 -3
- package/src/templates/blog/site/pages/index.skin +84 -0
- package/src/templates/dashboard/site/pages/index.skin +84 -0
- package/src/templates/landing/site/pages/index.skin +113 -6
- package/src/templates/starter/site/pages/index.skin +81 -3
- package/src/templates/store/site/pages/index.skin +93 -11
- package/site/pages/blog/index.md +0 -13
|
@@ -1,8 +1,23 @@
|
|
|
1
1
|
tokens
|
|
2
2
|
ink #1d2530
|
|
3
3
|
paper #fbfaf7
|
|
4
|
+
panel #ffffff
|
|
5
|
+
line #e7e3da
|
|
4
6
|
muted #6b7785
|
|
5
7
|
accent #2f6df0
|
|
8
|
+
accent-deep #2356cc
|
|
9
|
+
ring #2f6df0
|
|
10
|
+
radius 10px
|
|
11
|
+
|
|
12
|
+
tokens dark
|
|
13
|
+
ink #e7ecf3
|
|
14
|
+
paper #0f141b
|
|
15
|
+
panel #161d27
|
|
16
|
+
line #28303c
|
|
17
|
+
muted #93a0b2
|
|
18
|
+
accent #5b8cff
|
|
19
|
+
accent-deep #80a6ff
|
|
20
|
+
ring #5b8cff
|
|
6
21
|
|
|
7
22
|
page
|
|
8
23
|
margin 0
|
|
@@ -10,6 +25,7 @@ page
|
|
|
10
25
|
color $ink
|
|
11
26
|
bg $paper
|
|
12
27
|
line-height 1.6
|
|
28
|
+
-webkit-font-smoothing antialiased
|
|
13
29
|
|
|
14
30
|
main
|
|
15
31
|
max-width 720px
|
|
@@ -49,3 +65,71 @@ nav a
|
|
|
49
65
|
margin 0 0 .5rem
|
|
50
66
|
color $muted
|
|
51
67
|
font-size .9rem
|
|
68
|
+
|
|
69
|
+
/* Buttons & form controls — for newsletter signups, :button actions, etc. */
|
|
70
|
+
button
|
|
71
|
+
display inline-flex
|
|
72
|
+
align-items center
|
|
73
|
+
justify-content center
|
|
74
|
+
gap .5rem
|
|
75
|
+
bg $accent
|
|
76
|
+
color white
|
|
77
|
+
border 1px solid $accent
|
|
78
|
+
padding .6rem 1.15rem
|
|
79
|
+
margin .4rem .5rem .4rem 0
|
|
80
|
+
radius 999px
|
|
81
|
+
font-size .94rem
|
|
82
|
+
font-weight 560
|
|
83
|
+
line-height 1.15
|
|
84
|
+
cursor pointer
|
|
85
|
+
appearance none
|
|
86
|
+
box-shadow 0 1px 2px rgba(29,37,48,.08)
|
|
87
|
+
transition transform .14s cubic-bezier(.2,.7,.3,1), box-shadow .14s ease, background .14s ease, border-color .14s ease
|
|
88
|
+
|
|
89
|
+
button:hover
|
|
90
|
+
bg $accent-deep
|
|
91
|
+
border-color $accent-deep
|
|
92
|
+
transform translateY(-1px)
|
|
93
|
+
box-shadow 0 8px 18px -8px rgba(47,109,240,.55)
|
|
94
|
+
|
|
95
|
+
button:active
|
|
96
|
+
transform translateY(0)
|
|
97
|
+
box-shadow 0 1px 2px rgba(29,37,48,.08)
|
|
98
|
+
|
|
99
|
+
button:focus-visible
|
|
100
|
+
outline 2px solid $ring
|
|
101
|
+
outline-offset 2px
|
|
102
|
+
|
|
103
|
+
button:disabled
|
|
104
|
+
opacity .5
|
|
105
|
+
cursor not-allowed
|
|
106
|
+
box-shadow none
|
|
107
|
+
transform none
|
|
108
|
+
|
|
109
|
+
input, textarea, select
|
|
110
|
+
font inherit
|
|
111
|
+
font-size .95rem
|
|
112
|
+
color $ink
|
|
113
|
+
bg $panel
|
|
114
|
+
border 1px solid $line
|
|
115
|
+
radius $radius
|
|
116
|
+
padding .58rem .8rem
|
|
117
|
+
margin .35rem 0
|
|
118
|
+
width 100%
|
|
119
|
+
max-width 24rem
|
|
120
|
+
appearance none
|
|
121
|
+
transition border-color .14s ease, box-shadow .14s ease
|
|
122
|
+
|
|
123
|
+
input:hover, textarea:hover, select:hover
|
|
124
|
+
border-color $accent
|
|
125
|
+
|
|
126
|
+
input:focus-visible, textarea:focus-visible, select:focus-visible
|
|
127
|
+
outline none
|
|
128
|
+
border-color $accent
|
|
129
|
+
box-shadow 0 0 0 3px rgba(47,109,240,.18)
|
|
130
|
+
|
|
131
|
+
@media (prefers-reduced-motion: reduce)
|
|
132
|
+
button
|
|
133
|
+
transition none
|
|
134
|
+
button:hover
|
|
135
|
+
transform none
|
|
@@ -2,9 +2,13 @@ tokens
|
|
|
2
2
|
ink #0f1722
|
|
3
3
|
paper #0b1018
|
|
4
4
|
panel #131c28
|
|
5
|
+
field-bg #0e1620
|
|
5
6
|
line #243245
|
|
6
7
|
muted #8aa0b8
|
|
7
8
|
accent #4f9cff
|
|
9
|
+
accent-deep #6fb0ff
|
|
10
|
+
ring #4f9cff
|
|
11
|
+
radius 12px
|
|
8
12
|
|
|
9
13
|
page
|
|
10
14
|
margin 0
|
|
@@ -12,6 +16,7 @@ page
|
|
|
12
16
|
color #e7eefc
|
|
13
17
|
bg $paper
|
|
14
18
|
line-height 1.55
|
|
19
|
+
-webkit-font-smoothing antialiased
|
|
15
20
|
|
|
16
21
|
main
|
|
17
22
|
max-width 880px
|
|
@@ -72,3 +77,82 @@ nav a
|
|
|
72
77
|
color $muted
|
|
73
78
|
font-size .85rem
|
|
74
79
|
margin-top .5rem
|
|
80
|
+
|
|
81
|
+
/* Buttons & controls — refresh, filters, range pickers, etc. */
|
|
82
|
+
button
|
|
83
|
+
display inline-flex
|
|
84
|
+
align-items center
|
|
85
|
+
justify-content center
|
|
86
|
+
gap .5rem
|
|
87
|
+
bg $accent
|
|
88
|
+
color #07101d
|
|
89
|
+
border 1px solid $accent
|
|
90
|
+
padding .55rem 1.05rem
|
|
91
|
+
margin .4rem .5rem .4rem 0
|
|
92
|
+
radius 999px
|
|
93
|
+
font-size .92rem
|
|
94
|
+
font-weight 600
|
|
95
|
+
line-height 1.15
|
|
96
|
+
cursor pointer
|
|
97
|
+
appearance none
|
|
98
|
+
transition transform .14s cubic-bezier(.2,.7,.3,1), box-shadow .14s ease, background .14s ease, border-color .14s ease
|
|
99
|
+
|
|
100
|
+
button:hover
|
|
101
|
+
bg $accent-deep
|
|
102
|
+
border-color $accent-deep
|
|
103
|
+
transform translateY(-1px)
|
|
104
|
+
box-shadow 0 8px 20px -8px rgba(79,156,255,.6)
|
|
105
|
+
|
|
106
|
+
button:active
|
|
107
|
+
transform translateY(0)
|
|
108
|
+
box-shadow none
|
|
109
|
+
|
|
110
|
+
button:focus-visible
|
|
111
|
+
outline 2px solid $ring
|
|
112
|
+
outline-offset 2px
|
|
113
|
+
|
|
114
|
+
button:disabled
|
|
115
|
+
opacity .5
|
|
116
|
+
cursor not-allowed
|
|
117
|
+
transform none
|
|
118
|
+
|
|
119
|
+
button.ghost
|
|
120
|
+
bg transparent
|
|
121
|
+
color #e7eefc
|
|
122
|
+
border-color $line
|
|
123
|
+
|
|
124
|
+
button.ghost:hover
|
|
125
|
+
bg $panel
|
|
126
|
+
border-color $accent
|
|
127
|
+
box-shadow none
|
|
128
|
+
|
|
129
|
+
input, select, textarea
|
|
130
|
+
font inherit
|
|
131
|
+
font-size .95rem
|
|
132
|
+
color #e7eefc
|
|
133
|
+
bg $field-bg
|
|
134
|
+
border 1px solid $line
|
|
135
|
+
radius 10px
|
|
136
|
+
padding .55rem .8rem
|
|
137
|
+
margin .35rem 0
|
|
138
|
+
width 100%
|
|
139
|
+
max-width 24rem
|
|
140
|
+
appearance none
|
|
141
|
+
transition border-color .14s ease, box-shadow .14s ease
|
|
142
|
+
|
|
143
|
+
input::placeholder, textarea::placeholder
|
|
144
|
+
color $muted
|
|
145
|
+
|
|
146
|
+
input:hover, select:hover, textarea:hover
|
|
147
|
+
border-color #2f4763
|
|
148
|
+
|
|
149
|
+
input:focus-visible, select:focus-visible, textarea:focus-visible
|
|
150
|
+
outline none
|
|
151
|
+
border-color $accent
|
|
152
|
+
box-shadow 0 0 0 3px rgba(79,156,255,.22)
|
|
153
|
+
|
|
154
|
+
@media (prefers-reduced-motion: reduce)
|
|
155
|
+
button
|
|
156
|
+
transition none
|
|
157
|
+
button:hover
|
|
158
|
+
transform none
|
|
@@ -1,9 +1,23 @@
|
|
|
1
1
|
tokens
|
|
2
2
|
ink #14161c
|
|
3
|
+
muted #555c6b
|
|
3
4
|
paper #ffffff
|
|
4
5
|
soft #f4f5f8
|
|
5
6
|
line #e6e8ee
|
|
6
7
|
accent #5b4bf5
|
|
8
|
+
accent-deep #4938e0
|
|
9
|
+
ring #5b4bf5
|
|
10
|
+
radius 12px
|
|
11
|
+
|
|
12
|
+
tokens dark
|
|
13
|
+
ink #eceef4
|
|
14
|
+
muted #9aa1b4
|
|
15
|
+
paper #0d0e14
|
|
16
|
+
soft #16181f
|
|
17
|
+
line #262a36
|
|
18
|
+
accent #8b7dff
|
|
19
|
+
accent-deep #a79bff
|
|
20
|
+
ring #8b7dff
|
|
7
21
|
|
|
8
22
|
page
|
|
9
23
|
margin 0
|
|
@@ -11,6 +25,7 @@ page
|
|
|
11
25
|
color $ink
|
|
12
26
|
bg $paper
|
|
13
27
|
line-height 1.6
|
|
28
|
+
-webkit-font-smoothing antialiased
|
|
14
29
|
|
|
15
30
|
main
|
|
16
31
|
max-width 900px
|
|
@@ -42,17 +57,94 @@ nav a
|
|
|
42
57
|
|
|
43
58
|
.lede
|
|
44
59
|
font-size 1.2rem
|
|
45
|
-
color
|
|
60
|
+
color $muted
|
|
46
61
|
margin 0 0 1.5rem
|
|
47
62
|
|
|
48
63
|
.cta
|
|
49
|
-
display inline-
|
|
64
|
+
display inline-flex
|
|
65
|
+
align-items center
|
|
66
|
+
justify-content center
|
|
67
|
+
gap .5rem
|
|
50
68
|
bg $accent
|
|
51
69
|
color white
|
|
52
70
|
text-decoration none
|
|
53
|
-
padding .8rem 1.
|
|
54
|
-
radius
|
|
71
|
+
padding .8rem 1.5rem
|
|
72
|
+
radius 999px
|
|
55
73
|
font-weight 600
|
|
74
|
+
border 1px solid $accent
|
|
75
|
+
box-shadow 0 6px 18px -8px rgba(91,75,245,.5)
|
|
76
|
+
transition transform .14s cubic-bezier(.2,.7,.3,1), box-shadow .14s ease, background .14s ease
|
|
77
|
+
|
|
78
|
+
.cta:hover
|
|
79
|
+
bg $accent-deep
|
|
80
|
+
transform translateY(-1px)
|
|
81
|
+
box-shadow 0 12px 26px -10px rgba(91,75,245,.6)
|
|
82
|
+
|
|
83
|
+
.cta:focus-visible
|
|
84
|
+
outline 2px solid $ring
|
|
85
|
+
outline-offset 3px
|
|
86
|
+
|
|
87
|
+
/* Bare buttons & form controls — for inline :button actions, signup forms. */
|
|
88
|
+
button
|
|
89
|
+
display inline-flex
|
|
90
|
+
align-items center
|
|
91
|
+
justify-content center
|
|
92
|
+
gap .5rem
|
|
93
|
+
bg $accent
|
|
94
|
+
color white
|
|
95
|
+
border 1px solid $accent
|
|
96
|
+
padding .6rem 1.2rem
|
|
97
|
+
margin .4rem .5rem .4rem 0
|
|
98
|
+
radius 999px
|
|
99
|
+
font-size .94rem
|
|
100
|
+
font-weight 560
|
|
101
|
+
line-height 1.15
|
|
102
|
+
cursor pointer
|
|
103
|
+
appearance none
|
|
104
|
+
box-shadow 0 1px 2px rgba(20,22,28,.08)
|
|
105
|
+
transition transform .14s cubic-bezier(.2,.7,.3,1), box-shadow .14s ease, background .14s ease, border-color .14s ease
|
|
106
|
+
|
|
107
|
+
button:hover
|
|
108
|
+
bg $accent-deep
|
|
109
|
+
border-color $accent-deep
|
|
110
|
+
transform translateY(-1px)
|
|
111
|
+
box-shadow 0 8px 18px -8px rgba(91,75,245,.55)
|
|
112
|
+
|
|
113
|
+
button:active
|
|
114
|
+
transform translateY(0)
|
|
115
|
+
box-shadow 0 1px 2px rgba(20,22,28,.08)
|
|
116
|
+
|
|
117
|
+
button:focus-visible
|
|
118
|
+
outline 2px solid $ring
|
|
119
|
+
outline-offset 2px
|
|
120
|
+
|
|
121
|
+
button:disabled
|
|
122
|
+
opacity .5
|
|
123
|
+
cursor not-allowed
|
|
124
|
+
box-shadow none
|
|
125
|
+
transform none
|
|
126
|
+
|
|
127
|
+
input, textarea, select
|
|
128
|
+
font inherit
|
|
129
|
+
font-size .95rem
|
|
130
|
+
color $ink
|
|
131
|
+
bg $paper
|
|
132
|
+
border 1px solid $line
|
|
133
|
+
radius $radius
|
|
134
|
+
padding .58rem .8rem
|
|
135
|
+
margin .35rem 0
|
|
136
|
+
width 100%
|
|
137
|
+
max-width 24rem
|
|
138
|
+
appearance none
|
|
139
|
+
transition border-color .14s ease, box-shadow .14s ease
|
|
140
|
+
|
|
141
|
+
input:hover, textarea:hover, select:hover
|
|
142
|
+
border-color $accent
|
|
143
|
+
|
|
144
|
+
input:focus-visible, textarea:focus-visible, select:focus-visible
|
|
145
|
+
outline none
|
|
146
|
+
border-color $accent
|
|
147
|
+
box-shadow 0 0 0 3px rgba(91,75,245,.18)
|
|
56
148
|
|
|
57
149
|
.features
|
|
58
150
|
display grid
|
|
@@ -91,7 +183,7 @@ nav a
|
|
|
91
183
|
|
|
92
184
|
.quote .who
|
|
93
185
|
margin .5rem 0 0
|
|
94
|
-
color
|
|
186
|
+
color $muted
|
|
95
187
|
font-size .95rem
|
|
96
188
|
|
|
97
189
|
.wd-carousel-prev
|
|
@@ -105,14 +197,21 @@ nav a
|
|
|
105
197
|
top 40%
|
|
106
198
|
|
|
107
199
|
.wd-carousel-prev, .wd-carousel-next
|
|
108
|
-
bg
|
|
200
|
+
bg $paper
|
|
109
201
|
color $ink
|
|
110
202
|
border 1px solid $line
|
|
111
203
|
radius 999px
|
|
112
204
|
width 2.25rem
|
|
113
205
|
height 2.25rem
|
|
206
|
+
padding 0
|
|
207
|
+
margin 0
|
|
208
|
+
box-shadow 0 2px 8px -2px rgba(20,22,28,.18)
|
|
114
209
|
cursor pointer
|
|
115
210
|
|
|
211
|
+
.wd-carousel-prev:hover, .wd-carousel-next:hover
|
|
212
|
+
border-color $accent
|
|
213
|
+
color $accent
|
|
214
|
+
|
|
116
215
|
.wd-carousel-dots
|
|
117
216
|
display flex
|
|
118
217
|
justify-content center
|
|
@@ -123,9 +222,11 @@ nav a
|
|
|
123
222
|
width .6rem
|
|
124
223
|
height .6rem
|
|
125
224
|
padding 0
|
|
225
|
+
margin 0
|
|
126
226
|
border 0
|
|
127
227
|
radius 999px
|
|
128
228
|
bg $line
|
|
229
|
+
box-shadow none
|
|
129
230
|
cursor pointer
|
|
130
231
|
|
|
131
232
|
.wd-carousel-dot[aria-current="true"]
|
|
@@ -138,3 +239,9 @@ nav a
|
|
|
138
239
|
radius 16px
|
|
139
240
|
padding 2.5rem
|
|
140
241
|
margin-top 2rem
|
|
242
|
+
|
|
243
|
+
@media (prefers-reduced-motion: reduce)
|
|
244
|
+
button, .cta
|
|
245
|
+
transition none
|
|
246
|
+
button:hover, .cta:hover
|
|
247
|
+
transform none
|
|
@@ -1,13 +1,31 @@
|
|
|
1
1
|
tokens
|
|
2
2
|
ink #172026
|
|
3
|
+
muted #5b6b72
|
|
3
4
|
paper #f7f2e8
|
|
5
|
+
panel #ffffff
|
|
6
|
+
line #e4ddcd
|
|
4
7
|
accent #0f8b8d
|
|
8
|
+
accent-deep #0b6e70
|
|
9
|
+
ring #0f8b8d
|
|
10
|
+
radius 10px
|
|
11
|
+
|
|
12
|
+
tokens dark
|
|
13
|
+
ink #e8eef0
|
|
14
|
+
muted #93a3a8
|
|
15
|
+
paper #11181b
|
|
16
|
+
panel #182226
|
|
17
|
+
line #2a363a
|
|
18
|
+
accent #3fc6c8
|
|
19
|
+
accent-deep #6fdadb
|
|
20
|
+
ring #3fc6c8
|
|
5
21
|
|
|
6
22
|
page
|
|
7
23
|
margin 0
|
|
8
24
|
font ui-sans-serif, system-ui, sans-serif
|
|
9
25
|
color $ink
|
|
10
26
|
bg $paper
|
|
27
|
+
line-height 1.6
|
|
28
|
+
-webkit-font-smoothing antialiased
|
|
11
29
|
|
|
12
30
|
main
|
|
13
31
|
max-width 760px
|
|
@@ -40,8 +58,68 @@ nav a:hover
|
|
|
40
58
|
color $accent
|
|
41
59
|
|
|
42
60
|
button
|
|
61
|
+
display inline-flex
|
|
62
|
+
align-items center
|
|
63
|
+
justify-content center
|
|
64
|
+
gap .5rem
|
|
43
65
|
bg $accent
|
|
44
66
|
color white
|
|
45
|
-
border
|
|
46
|
-
padding .
|
|
47
|
-
|
|
67
|
+
border 1px solid $accent
|
|
68
|
+
padding .6rem 1.15rem
|
|
69
|
+
margin .4rem .5rem .4rem 0
|
|
70
|
+
radius 999px
|
|
71
|
+
font-size .94rem
|
|
72
|
+
font-weight 560
|
|
73
|
+
line-height 1.15
|
|
74
|
+
cursor pointer
|
|
75
|
+
appearance none
|
|
76
|
+
box-shadow 0 1px 2px rgba(23,32,38,.08)
|
|
77
|
+
transition transform .14s cubic-bezier(.2,.7,.3,1), box-shadow .14s ease, background .14s ease, border-color .14s ease
|
|
78
|
+
|
|
79
|
+
button:hover
|
|
80
|
+
bg $accent-deep
|
|
81
|
+
border-color $accent-deep
|
|
82
|
+
transform translateY(-1px)
|
|
83
|
+
box-shadow 0 8px 18px -8px rgba(15,139,141,.55)
|
|
84
|
+
|
|
85
|
+
button:active
|
|
86
|
+
transform translateY(0)
|
|
87
|
+
box-shadow 0 1px 2px rgba(23,32,38,.08)
|
|
88
|
+
|
|
89
|
+
button:focus-visible
|
|
90
|
+
outline 2px solid $ring
|
|
91
|
+
outline-offset 2px
|
|
92
|
+
|
|
93
|
+
button:disabled
|
|
94
|
+
opacity .5
|
|
95
|
+
cursor not-allowed
|
|
96
|
+
box-shadow none
|
|
97
|
+
transform none
|
|
98
|
+
|
|
99
|
+
input, textarea, select
|
|
100
|
+
font inherit
|
|
101
|
+
font-size .95rem
|
|
102
|
+
color $ink
|
|
103
|
+
bg $panel
|
|
104
|
+
border 1px solid $line
|
|
105
|
+
radius $radius
|
|
106
|
+
padding .58rem .8rem
|
|
107
|
+
margin .35rem 0
|
|
108
|
+
width 100%
|
|
109
|
+
max-width 24rem
|
|
110
|
+
appearance none
|
|
111
|
+
transition border-color .14s ease, box-shadow .14s ease
|
|
112
|
+
|
|
113
|
+
input:hover, textarea:hover, select:hover
|
|
114
|
+
border-color $accent
|
|
115
|
+
|
|
116
|
+
input:focus-visible, textarea:focus-visible, select:focus-visible
|
|
117
|
+
outline none
|
|
118
|
+
border-color $accent
|
|
119
|
+
box-shadow 0 0 0 3px rgba(15,139,141,.18)
|
|
120
|
+
|
|
121
|
+
@media (prefers-reduced-motion: reduce)
|
|
122
|
+
button
|
|
123
|
+
transition none
|
|
124
|
+
button:hover
|
|
125
|
+
transform none
|
|
@@ -1,8 +1,23 @@
|
|
|
1
1
|
tokens
|
|
2
2
|
ink #1a1f2b
|
|
3
|
+
muted #66707f
|
|
3
4
|
paper #fbfbf9
|
|
5
|
+
panel #ffffff
|
|
4
6
|
line #e6e4dd
|
|
5
7
|
accent #146b54
|
|
8
|
+
accent-deep #0f5240
|
|
9
|
+
ring #146b54
|
|
10
|
+
radius 12px
|
|
11
|
+
|
|
12
|
+
tokens dark
|
|
13
|
+
ink #e9edf2
|
|
14
|
+
muted #98a2b0
|
|
15
|
+
paper #0f1512
|
|
16
|
+
panel #18201d
|
|
17
|
+
line #28332e
|
|
18
|
+
accent #3bbd97
|
|
19
|
+
accent-deep #66d2b3
|
|
20
|
+
ring #3bbd97
|
|
6
21
|
|
|
7
22
|
page
|
|
8
23
|
margin 0
|
|
@@ -10,6 +25,7 @@ page
|
|
|
10
25
|
color $ink
|
|
11
26
|
bg $paper
|
|
12
27
|
line-height 1.55
|
|
28
|
+
-webkit-font-smoothing antialiased
|
|
13
29
|
|
|
14
30
|
main
|
|
15
31
|
max-width 860px
|
|
@@ -31,13 +47,26 @@ nav a
|
|
|
31
47
|
color $accent
|
|
32
48
|
text-decoration none
|
|
33
49
|
|
|
34
|
-
input
|
|
50
|
+
input, select, textarea
|
|
35
51
|
font inherit
|
|
36
|
-
|
|
52
|
+
font-size .95rem
|
|
53
|
+
color $ink
|
|
54
|
+
padding .58rem .8rem
|
|
37
55
|
border 1px solid $line
|
|
38
56
|
radius 8px
|
|
39
57
|
width 100%
|
|
40
58
|
max-width 320px
|
|
59
|
+
bg $panel
|
|
60
|
+
appearance none
|
|
61
|
+
transition border-color .14s ease, box-shadow .14s ease
|
|
62
|
+
|
|
63
|
+
input:hover, select:hover, textarea:hover
|
|
64
|
+
border-color $accent
|
|
65
|
+
|
|
66
|
+
input:focus-visible, select:focus-visible, textarea:focus-visible
|
|
67
|
+
outline none
|
|
68
|
+
border-color $accent
|
|
69
|
+
box-shadow 0 0 0 3px rgba(20,107,84,.18)
|
|
41
70
|
|
|
42
71
|
.catalog
|
|
43
72
|
display grid
|
|
@@ -46,11 +75,20 @@ input
|
|
|
46
75
|
margin 1.5rem 0
|
|
47
76
|
|
|
48
77
|
.product
|
|
78
|
+
display flex
|
|
79
|
+
flex-direction column
|
|
49
80
|
border 1px solid $line
|
|
50
|
-
radius
|
|
51
|
-
padding 1rem
|
|
81
|
+
radius $radius
|
|
82
|
+
padding 1.1rem
|
|
52
83
|
text-align center
|
|
53
|
-
background
|
|
84
|
+
background $panel
|
|
85
|
+
box-shadow 0 1px 2px rgba(26,31,43,.04)
|
|
86
|
+
transition transform .16s ease, box-shadow .16s ease, border-color .16s ease
|
|
87
|
+
|
|
88
|
+
.product:hover
|
|
89
|
+
transform translateY(-2px)
|
|
90
|
+
border-color $accent
|
|
91
|
+
box-shadow 0 12px 26px -16px rgba(26,31,43,.4)
|
|
54
92
|
|
|
55
93
|
.emoji
|
|
56
94
|
font-size 2.25rem
|
|
@@ -65,13 +103,45 @@ input
|
|
|
65
103
|
margin-bottom .6rem
|
|
66
104
|
|
|
67
105
|
button
|
|
106
|
+
display inline-flex
|
|
107
|
+
align-items center
|
|
108
|
+
justify-content center
|
|
109
|
+
gap .4rem
|
|
68
110
|
font inherit
|
|
111
|
+
font-size .9rem
|
|
112
|
+
font-weight 560
|
|
69
113
|
bg $accent
|
|
70
114
|
color white
|
|
71
|
-
border
|
|
72
|
-
padding .55rem
|
|
73
|
-
radius
|
|
115
|
+
border 1px solid $accent
|
|
116
|
+
padding .55rem 1rem
|
|
117
|
+
radius 999px
|
|
74
118
|
cursor pointer
|
|
119
|
+
appearance none
|
|
120
|
+
box-shadow 0 1px 2px rgba(26,31,43,.08)
|
|
121
|
+
transition transform .14s cubic-bezier(.2,.7,.3,1), box-shadow .14s ease, background .14s ease, border-color .14s ease
|
|
122
|
+
|
|
123
|
+
button:hover
|
|
124
|
+
bg $accent-deep
|
|
125
|
+
border-color $accent-deep
|
|
126
|
+
transform translateY(-1px)
|
|
127
|
+
box-shadow 0 8px 18px -8px rgba(20,107,84,.55)
|
|
128
|
+
|
|
129
|
+
button:active
|
|
130
|
+
transform translateY(0)
|
|
131
|
+
box-shadow 0 1px 2px rgba(26,31,43,.08)
|
|
132
|
+
|
|
133
|
+
button:focus-visible
|
|
134
|
+
outline 2px solid $ring
|
|
135
|
+
outline-offset 2px
|
|
136
|
+
|
|
137
|
+
button:disabled
|
|
138
|
+
opacity .5
|
|
139
|
+
cursor not-allowed
|
|
140
|
+
box-shadow none
|
|
141
|
+
transform none
|
|
142
|
+
|
|
143
|
+
.product button
|
|
144
|
+
margin-top auto
|
|
75
145
|
|
|
76
146
|
.line
|
|
77
147
|
display flex
|
|
@@ -82,12 +152,18 @@ button
|
|
|
82
152
|
radius 10px
|
|
83
153
|
padding .6rem .9rem
|
|
84
154
|
margin .4rem 0
|
|
85
|
-
background
|
|
155
|
+
background $panel
|
|
86
156
|
|
|
87
157
|
.line button
|
|
88
158
|
bg transparent
|
|
89
|
-
color $
|
|
159
|
+
color $muted
|
|
90
160
|
border 1px solid $line
|
|
161
|
+
box-shadow none
|
|
162
|
+
|
|
163
|
+
.line button:hover
|
|
164
|
+
bg $accent
|
|
165
|
+
border-color $accent
|
|
166
|
+
color white
|
|
91
167
|
|
|
92
168
|
.cart-foot
|
|
93
169
|
font-size 1.1rem
|
|
@@ -97,4 +173,10 @@ button
|
|
|
97
173
|
border 1px solid $accent
|
|
98
174
|
radius 10px
|
|
99
175
|
padding 1rem
|
|
100
|
-
background
|
|
176
|
+
background $panel
|
|
177
|
+
|
|
178
|
+
@media (prefers-reduced-motion: reduce)
|
|
179
|
+
button, .product
|
|
180
|
+
transition none
|
|
181
|
+
button:hover, .product:hover
|
|
182
|
+
transform none
|
package/site/pages/blog/index.md
DELETED
|
@@ -1,13 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
title: The Darkmown Blog
|
|
3
|
-
description: Notes on shipping Markdown that runs — feeds, drafts, and zero-JS releases.
|
|
4
|
-
---
|
|
5
|
-
|
|
6
|
-
# The Darkmown Blog
|
|
7
|
-
|
|
8
|
-
Short notes on the framework. Every post here is a plain `.md` file with a
|
|
9
|
-
`date:` in its frontmatter — that `date:` is what lands a page in `rss.xml` and
|
|
10
|
-
stamps its `<lastmod>` in `sitemap.xml`.
|
|
11
|
-
|
|
12
|
-
- [Shipping feeds without a config file](/blog/shipping-feeds/)
|
|
13
|
-
- [Drafts that never leak](/blog/drafts-that-never-leak/)
|