blank-reset 1.0.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/LICENSE ADDED
@@ -0,0 +1,21 @@
1
+ MIT License
2
+
3
+ Copyright (c) 2021 Peiwen Lu
4
+
5
+ Permission is hereby granted, free of charge, to any person obtaining a copy
6
+ of this software and associated documentation files (the "Software"), to deal
7
+ in the Software without restriction, including without limitation the rights
8
+ to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9
+ copies of the Software, and to permit persons to whom the Software is
10
+ furnished to do so, subject to the following conditions:
11
+
12
+ The above copyright notice and this permission notice shall be included in all
13
+ copies or substantial portions of the Software.
14
+
15
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
+ IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
+ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18
+ AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19
+ LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20
+ OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21
+ SOFTWARE.
package/README.md ADDED
@@ -0,0 +1,83 @@
1
+ # Blank Reset
2
+
3
+ A CSS reset that strips every HTML element to absolute zero.
4
+
5
+ Every browser ships with opinions: headings bold, links blue, buttons padded, form controls styled to match the OS. These defaults are invisible — until they conflict with your design. Most resets normalize those differences. Blank CSS removes them entirely.
6
+
7
+ `h1` is not bold. `a` has no color. `button` has no border. What you see is only what you wrote.
8
+
9
+ ## Philosophy
10
+
11
+ **Zero, not reasonable.** `h1`, `p`, and `span` are visually identical by default. `bold` is not bold. `italic` is not italic. Every visual property must be explicitly written by the user.
12
+
13
+ Other resets normalize browser differences or add useful starting points. Blank CSS does neither — it only removes what the browser imposes and adds nothing back. No `cursor: pointer`, no smooth scrolling, no font-smoothing. These are valid choices, but they are not zero.
14
+
15
+ ## How it works
16
+
17
+ All rules are wrapped in `@layer reset`, giving them the lowest possible priority. Any unlayered user style wins automatically — no specificity tricks required.
18
+
19
+ ```css
20
+ @layer reset {
21
+ h1,
22
+ h2,
23
+ h3,
24
+ h4,
25
+ h5,
26
+ h6 {
27
+ margin: 0;
28
+ font-size: inherit;
29
+ font-weight: inherit;
30
+ }
31
+ }
32
+ ```
33
+
34
+ ## Usage
35
+
36
+ ### CDN
37
+
38
+ ```html
39
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/blank-reset/blank.min.css" />
40
+ ```
41
+
42
+ ### npm
43
+
44
+ ```sh
45
+ npm install blank-reset
46
+ ```
47
+
48
+ ```css
49
+ @import "blank-reset/blank.min.css";
50
+ ```
51
+
52
+ ### Download
53
+
54
+ Copy `blank.min.css` directly into your project.
55
+
56
+ ## Browser support
57
+
58
+ Requires browsers that support `@layer`:
59
+
60
+ | Feature | Chrome | Firefox | Safari |
61
+ |---------|--------|---------|--------|
62
+ | `@layer` | 99+ | 97+ | 15.4+ |
63
+
64
+ No IE support. No legacy fallbacks.
65
+
66
+ ## Development
67
+
68
+ ```sh
69
+ pnpm install
70
+
71
+ # Lint
72
+ pnpm stylelint blank.css
73
+
74
+ # Build minified output
75
+ pnpm build
76
+
77
+ # Run tests
78
+ pnpm test
79
+ ```
80
+
81
+ ## License
82
+
83
+ MIT
package/blank.css ADDED
@@ -0,0 +1,361 @@
1
+ /**
2
+ * Blank Reset v1.0.0
3
+ * https://github.com/p233/blank-css
4
+ *
5
+ * Resets every element to absolute zero.
6
+ * What you see is only what you write.
7
+ *
8
+ * License: MIT
9
+ */
10
+
11
+ @layer reset {
12
+ /* ==========================================================================
13
+ * Box Model
14
+ * ======================================================================== */
15
+
16
+ *,
17
+ *::before,
18
+ *::after {
19
+ box-sizing: border-box;
20
+ }
21
+
22
+ /* ==========================================================================
23
+ * Root & Body
24
+ *
25
+ * Default: body — margin: 8px
26
+ *
27
+ * :root properties are set deliberately (not resetting browser defaults):
28
+ * font-size: 16px — anchors rem/em to a predictable base across mixed units
29
+ * line-height: 1 — replaces font-dependent 'normal' with a consistent origin
30
+ * text-size-adjust — prevents mobile browsers from inflating font sizes
31
+ * ======================================================================== */
32
+
33
+ :root {
34
+ font-size: 16px;
35
+ line-height: 1;
36
+ -moz-text-size-adjust: 100%;
37
+ text-size-adjust: 100%;
38
+ }
39
+
40
+ body {
41
+ margin: 0;
42
+ }
43
+
44
+ /* ==========================================================================
45
+ * Sections
46
+ *
47
+ * Default: h1 — font-size: 2em, font-weight: bold, margin-block: 0.67em
48
+ * h2 — font-size: 1.5em, font-weight: bold, margin-block: 0.83em
49
+ * h3 — font-size: 1.17em, font-weight: bold, margin-block: 1em
50
+ * h4 — font-size: 1em, font-weight: bold, margin-block: 1.33em
51
+ * h5 — font-size: 0.83em, font-weight: bold, margin-block: 1.67em
52
+ * h6 — font-size: 0.67em, font-weight: bold, margin-block: 2.33em
53
+ *
54
+ * article, aside, footer, header, main, nav, section, hgroup — display: block only
55
+ * ======================================================================== */
56
+
57
+ h1,
58
+ h2,
59
+ h3,
60
+ h4,
61
+ h5,
62
+ h6 {
63
+ margin: 0;
64
+ font-size: inherit;
65
+ font-weight: inherit;
66
+ }
67
+
68
+ /* ==========================================================================
69
+ * Grouping Content
70
+ *
71
+ * Default: p — margin-block: 1em
72
+ * blockquote — margin-block: 1em, margin-inline: 40px
73
+ * pre — margin-block: 1em, font-family: monospace, white-space: pre
74
+ * figure — margin-block: 1em, margin-inline: 40px
75
+ * hr — border, margin-block: 0.5em
76
+ * dl — margin-block: 1em
77
+ * dd — margin-inline-start: 40px
78
+ *
79
+ * figcaption, dt, div, search — none notable (menu is reset in Lists)
80
+ * ======================================================================== */
81
+
82
+ p,
83
+ blockquote,
84
+ figure,
85
+ pre,
86
+ dl,
87
+ dd {
88
+ margin: 0;
89
+ }
90
+
91
+ blockquote,
92
+ figure {
93
+ padding: 0;
94
+ }
95
+
96
+ pre {
97
+ font-family: inherit;
98
+ font-size: inherit;
99
+ }
100
+
101
+ hr {
102
+ margin: 0;
103
+ border: 0;
104
+ }
105
+
106
+ /* ==========================================================================
107
+ * Text-level Semantics
108
+ *
109
+ * Default: a — color: linkcolor, text-decoration: underline, cursor: pointer
110
+ * strong, b — font-weight: bold
111
+ * em, i — font-style: italic
112
+ * cite — font-style: italic
113
+ * dfn — font-style: italic
114
+ * var — font-style: italic
115
+ * address — font-style: italic
116
+ * small — font-size: smaller
117
+ * s — text-decoration: line-through
118
+ * u — text-decoration: underline
119
+ * ins — text-decoration: underline
120
+ * del — text-decoration: line-through
121
+ * mark — background: yellow, color: black
122
+ * abbr[title]— text-decoration: underline dotted
123
+ * sub — vertical-align: sub, font-size: smaller
124
+ * sup — vertical-align: super, font-size: smaller
125
+ * q — quotes: auto (::before / ::after insert quotes)
126
+ *
127
+ * data, time, span, br, wbr, bdi, bdo, ruby, rt, rp — none notable
128
+ * ======================================================================== */
129
+
130
+ a {
131
+ color: inherit;
132
+ text-decoration: none;
133
+ }
134
+
135
+ b,
136
+ strong {
137
+ font-weight: inherit;
138
+ }
139
+
140
+ i,
141
+ em,
142
+ cite,
143
+ dfn,
144
+ var,
145
+ address {
146
+ font-style: inherit;
147
+ }
148
+
149
+ small {
150
+ font-size: inherit;
151
+ }
152
+
153
+ s,
154
+ u,
155
+ del,
156
+ ins {
157
+ text-decoration: none;
158
+ }
159
+
160
+ mark {
161
+ color: inherit;
162
+ background: none;
163
+ }
164
+
165
+ abbr[title] {
166
+ text-decoration: none;
167
+ }
168
+
169
+ sub,
170
+ sup {
171
+ font-size: inherit;
172
+ vertical-align: baseline;
173
+ }
174
+
175
+ q {
176
+ quotes: none;
177
+ }
178
+
179
+ /* ==========================================================================
180
+ * Code
181
+ *
182
+ * Default: code — font-family: monospace
183
+ * kbd — font-family: monospace
184
+ * samp — font-family: monospace
185
+ *
186
+ * (pre is handled in Grouping Content)
187
+ * ======================================================================== */
188
+
189
+ code,
190
+ kbd,
191
+ samp {
192
+ font-family: inherit;
193
+ font-size: inherit;
194
+ }
195
+
196
+ /* ==========================================================================
197
+ * Lists
198
+ *
199
+ * Default: ul — margin-block: 1em, padding-inline-start: 40px, list-style: disc
200
+ * ol — margin-block: 1em, padding-inline-start: 40px, list-style: decimal
201
+ * menu — margin-block: 1em, padding-inline-start: 40px, list-style: disc
202
+ * li — display: list-item
203
+ * ======================================================================== */
204
+
205
+ ul,
206
+ ol,
207
+ menu {
208
+ padding: 0;
209
+ margin: 0;
210
+ list-style: none;
211
+ }
212
+
213
+ /* ==========================================================================
214
+ * Table
215
+ *
216
+ * Default: table — border-spacing: 2px, border-collapse: separate
217
+ * caption — text-align: center
218
+ * th — font-weight: bold, text-align: center, padding: 1px
219
+ * td — padding: 1px
220
+ *
221
+ * thead, tbody, tfoot, tr, colgroup, col — structural only
222
+ * ======================================================================== */
223
+
224
+ table {
225
+ border-spacing: 0;
226
+ border-collapse: collapse;
227
+ }
228
+
229
+ caption {
230
+ text-align: inherit;
231
+ }
232
+
233
+ th {
234
+ font-weight: inherit;
235
+ text-align: inherit;
236
+ }
237
+
238
+ th,
239
+ td {
240
+ padding: 0;
241
+ }
242
+
243
+ /* ==========================================================================
244
+ * Forms
245
+ *
246
+ * Default: button — padding, border, background, text-align: center
247
+ * input — padding, border, color (system)
248
+ * select — padding, border
249
+ * textarea — padding, border, white-space: pre-wrap, resize: both
250
+ * fieldset — border: 2px groove, padding, margin-inline: 2px
251
+ * legend — padding-inline: 2px
252
+ * optgroup — font-weight: bold
253
+ * meter — appearance: meter
254
+ * progress — appearance: progress-bar
255
+ *
256
+ * form, label, output, datalist, option — none notable or hidden
257
+ * ======================================================================== */
258
+
259
+ button,
260
+ input,
261
+ select,
262
+ textarea {
263
+ padding: 0;
264
+ margin: 0;
265
+ font: inherit;
266
+ color: inherit;
267
+ border: 0;
268
+ }
269
+
270
+ button,
271
+ input[type="button"],
272
+ input[type="submit"],
273
+ input[type="reset"] {
274
+ background: none;
275
+ }
276
+
277
+ textarea {
278
+ white-space: revert;
279
+ }
280
+
281
+ optgroup {
282
+ font-weight: inherit;
283
+ }
284
+
285
+ [type="search"] {
286
+ -webkit-appearance: textfield;
287
+ appearance: textfield;
288
+ }
289
+
290
+ [type="search"]::-webkit-search-decoration {
291
+ -webkit-appearance: none;
292
+ }
293
+
294
+ ::file-selector-button {
295
+ font: inherit;
296
+ }
297
+
298
+ meter,
299
+ progress {
300
+ -webkit-appearance: revert;
301
+ appearance: revert;
302
+ }
303
+
304
+ fieldset {
305
+ padding: 0;
306
+ margin: 0;
307
+ border: 0;
308
+ }
309
+
310
+ legend {
311
+ padding: 0;
312
+ }
313
+
314
+ /* ==========================================================================
315
+ * Embedded / Media
316
+ *
317
+ * Default: img — display: inline (baseline gap)
318
+ * video — display: inline (baseline gap)
319
+ * canvas — display: inline (baseline gap)
320
+ * svg — display: inline (baseline gap), overflow: hidden
321
+ * iframe — display: inline (baseline gap), border: 2px inset
322
+ *
323
+ * vertical-align: bottom removes the baseline gap without changing display type,
324
+ * preserving inline behavior needed for SVG icons inside buttons/links.
325
+ *
326
+ * picture, audio, source, embed, object, map, area — structural or hidden
327
+ * ======================================================================== */
328
+
329
+ img,
330
+ picture,
331
+ video,
332
+ canvas,
333
+ svg,
334
+ iframe,
335
+ embed,
336
+ object {
337
+ vertical-align: bottom;
338
+ }
339
+
340
+ iframe {
341
+ border: 0;
342
+ }
343
+
344
+ /* ==========================================================================
345
+ * Interactive
346
+ *
347
+ * Default: summary — display: list-item (marker triangle)
348
+ * dialog — position: absolute, padding, border, background, color
349
+ * ======================================================================== */
350
+
351
+ dialog {
352
+ padding: 0;
353
+ color: inherit;
354
+ background: transparent;
355
+ border: 0;
356
+ }
357
+
358
+ summary {
359
+ display: block;
360
+ }
361
+ }
package/blank.min.css ADDED
@@ -0,0 +1 @@
1
+ @layer reset{*,:before,:after{box-sizing:border-box}:root{-moz-text-size-adjust:100%;text-size-adjust:100%;font-size:16px;line-height:1}body{margin:0}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit;margin:0}p,blockquote,figure,pre,dl,dd{margin:0}blockquote,figure{padding:0}pre{font-family:inherit;font-size:inherit}hr{border:0;margin:0}a{color:inherit;text-decoration:none}b,strong{font-weight:inherit}i,em,cite,dfn,var,address{font-style:inherit}small{font-size:inherit}s,u,del,ins{text-decoration:none}mark{color:inherit;background:0 0}abbr[title]{text-decoration:none}sub,sup{font-size:inherit;vertical-align:baseline}q{quotes:none}code,kbd,samp{font-family:inherit;font-size:inherit}ul,ol,menu{margin:0;padding:0;list-style:none}table{border-spacing:0;border-collapse:collapse}caption{text-align:inherit}th{font-weight:inherit;text-align:inherit}th,td{padding:0}button,input,select,textarea{font:inherit;color:inherit;border:0;margin:0;padding:0}button,input[type=button],input[type=submit],input[type=reset]{background:0 0}textarea{white-space:revert}optgroup{font-weight:inherit}[type=search]{-webkit-appearance:textfield;appearance:textfield}[type=search]::-webkit-search-decoration{-webkit-appearance:none}::file-selector-button{font:inherit}meter,progress{-webkit-appearance:revert;appearance:revert}fieldset{border:0;margin:0;padding:0}legend{padding:0}img,picture,video,canvas,svg,iframe,embed,object{vertical-align:bottom}iframe{border:0}dialog{color:inherit;background:0 0;border:0;padding:0}summary{display:block}}
package/package.json ADDED
@@ -0,0 +1,49 @@
1
+ {
2
+ "name": "blank-reset",
3
+ "version": "1.0.0",
4
+ "description": "A CSS reset that strips every HTML element to absolute zero.",
5
+ "type": "module",
6
+ "main": "blank.min.css",
7
+ "keywords": [
8
+ "css",
9
+ "reset",
10
+ "css-reset"
11
+ ],
12
+ "homepage": "https://github.com/P233/blank-css#readme",
13
+ "repository": {
14
+ "type": "git",
15
+ "url": "git+https://github.com/P233/blank-css.git"
16
+ },
17
+ "bugs": {
18
+ "url": "https://github.com/P233/blank-css/issues"
19
+ },
20
+ "files": [
21
+ "blank.css",
22
+ "blank.min.css"
23
+ ],
24
+ "license": "MIT",
25
+ "author": "Peiwen Lu",
26
+ "devDependencies": {
27
+ "husky": "^9.1.7",
28
+ "lightningcss-cli": "^1.31.1",
29
+ "lint-staged": "^16.3.0",
30
+ "postcss": "^8.5.6",
31
+ "prettier": "^3.8.1",
32
+ "stylelint": "^17.4.0",
33
+ "stylelint-config-recess-order": "^7.6.1",
34
+ "stylelint-order": "^7.0.1",
35
+ "stylelint-prettier": "^5.0.3"
36
+ },
37
+ "lint-staged": {
38
+ "*.html": [
39
+ "prettier --write"
40
+ ],
41
+ "*.css": [
42
+ "stylelint --fix"
43
+ ]
44
+ },
45
+ "scripts": {
46
+ "build": "lightningcss --minify blank.css -o blank.min.css",
47
+ "test": "node --test test/blank.test.js"
48
+ }
49
+ }