forked from
pds.ls/pdsls
atproto explorer
local reset stylesheet
+389
-5
-1
package.json
-1
package.json
-3
pnpm-lock.yaml
-3
pnpm-lock.yaml
+1
-1
src/index.tsx
+1
-1
src/index.tsx
+388
src/tailwind-compat.css
+388
src/tailwind-compat.css
···
1
+
/*
2
+
Please read: https://github.com/unocss/unocss/blob/main/packages/reset/tailwind-compat.md
3
+
*/
4
+
5
+
/*
6
+
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
7
+
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
8
+
2. [UnoCSS]: allow to override the default border color with css var `--un-default-border-color`
9
+
*/
10
+
11
+
*,
12
+
::before,
13
+
::after {
14
+
box-sizing: border-box; /* 1 */
15
+
border-width: 0; /* 2 */
16
+
border-style: solid; /* 2 */
17
+
border-color: var(--un-default-border-color, #e5e7eb); /* 2 */
18
+
}
19
+
20
+
/*
21
+
1. Use a consistent sensible line-height in all browsers.
22
+
2. Prevent adjustments of font size after orientation changes in iOS.
23
+
3. Use a more readable tab size.
24
+
4. Use the user's configured `sans` font-family by default.
25
+
5. Use the user's configured `sans` font-feature-settings by default.
26
+
6. Use the user's configured `sans` font-variation-settings by default.
27
+
7. Disable tap highlights on iOS.
28
+
*/
29
+
30
+
html,
31
+
:host {
32
+
line-height: 1.5; /* 1 */
33
+
-webkit-text-size-adjust: 100%; /* 2 */
34
+
-moz-tab-size: 4; /* 3 */
35
+
tab-size: 4; /* 3 */
36
+
font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */
37
+
font-feature-settings: normal; /* 5 */
38
+
font-variation-settings: normal; /* 6 */
39
+
-webkit-tap-highlight-color: transparent; /* 7 */
40
+
}
41
+
42
+
/*
43
+
1. Remove the margin in all browsers.
44
+
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
45
+
*/
46
+
47
+
body {
48
+
margin: 0; /* 1 */
49
+
line-height: inherit; /* 2 */
50
+
}
51
+
52
+
/*
53
+
1. Add the correct height in Firefox.
54
+
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
55
+
3. Ensure horizontal rules are visible by default.
56
+
*/
57
+
58
+
hr {
59
+
height: 0; /* 1 */
60
+
color: inherit; /* 2 */
61
+
border-top-width: 1px; /* 3 */
62
+
}
63
+
64
+
/*
65
+
Add the correct text decoration in Chrome, Edge, and Safari.
66
+
*/
67
+
68
+
abbr:where([title]) {
69
+
text-decoration: underline dotted;
70
+
}
71
+
72
+
/*
73
+
Remove the default font size and weight for headings.
74
+
*/
75
+
76
+
h1,
77
+
h2,
78
+
h3,
79
+
h4,
80
+
h5,
81
+
h6 {
82
+
font-size: inherit;
83
+
font-weight: inherit;
84
+
}
85
+
86
+
/*
87
+
Reset links to optimize for opt-in styling instead of opt-out.
88
+
*/
89
+
90
+
a {
91
+
color: inherit;
92
+
text-decoration: inherit;
93
+
}
94
+
95
+
/*
96
+
Add the correct font weight in Edge and Safari.
97
+
*/
98
+
99
+
b,
100
+
strong {
101
+
font-weight: bolder;
102
+
}
103
+
104
+
/*
105
+
1. Use the user's configured `mono` font-family by default.
106
+
2. Use the user's configured `mono` font-feature-settings by default.
107
+
3. Use the user's configured `mono` font-variation-settings by default.
108
+
4. Correct the odd `em` font sizing in all browsers.
109
+
*/
110
+
111
+
code,
112
+
kbd,
113
+
samp,
114
+
pre {
115
+
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
116
+
font-feature-settings: normal; /* 2 */
117
+
font-variation-settings: normal; /* 3 */
118
+
font-size: 1em; /* 4 */
119
+
}
120
+
121
+
/*
122
+
Add the correct font size in all browsers.
123
+
*/
124
+
125
+
small {
126
+
font-size: 80%;
127
+
}
128
+
129
+
/*
130
+
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
131
+
*/
132
+
133
+
sub,
134
+
sup {
135
+
font-size: 75%;
136
+
line-height: 0;
137
+
position: relative;
138
+
vertical-align: baseline;
139
+
}
140
+
141
+
sub {
142
+
bottom: -0.25em;
143
+
}
144
+
145
+
sup {
146
+
top: -0.5em;
147
+
}
148
+
149
+
/*
150
+
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
151
+
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
152
+
3. Remove gaps between table borders by default.
153
+
*/
154
+
155
+
table {
156
+
text-indent: 0; /* 1 */
157
+
border-color: inherit; /* 2 */
158
+
border-collapse: collapse; /* 3 */
159
+
}
160
+
161
+
/*
162
+
1. Change the font styles in all browsers.
163
+
2. Remove the margin in Firefox and Safari.
164
+
3. Remove default padding in all browsers.
165
+
*/
166
+
167
+
button,
168
+
input,
169
+
optgroup,
170
+
select,
171
+
textarea {
172
+
font-family: inherit; /* 1 */
173
+
font-feature-settings: inherit; /* 1 */
174
+
font-variation-settings: inherit; /* 1 */
175
+
font-size: 100%; /* 1 */
176
+
font-weight: inherit; /* 1 */
177
+
line-height: inherit; /* 1 */
178
+
color: inherit; /* 1 */
179
+
margin: 0; /* 2 */
180
+
padding: 0; /* 3 */
181
+
}
182
+
183
+
/*
184
+
Remove the inheritance of text transform in Edge and Firefox.
185
+
*/
186
+
187
+
button,
188
+
select {
189
+
text-transform: none;
190
+
}
191
+
192
+
/*
193
+
1. Correct the inability to style clickable types in iOS and Safari.
194
+
2. Remove default button styles.
195
+
*/
196
+
197
+
button,
198
+
[type='button'],
199
+
[type='reset'],
200
+
[type='submit'] {
201
+
-webkit-appearance: button; /* 1 */
202
+
/* Will affect the button style of most component libraries, so disable it */
203
+
/* https://github.com/unocss/unocss/issues/2127 */
204
+
/* background-color: transparent; !* 2 *! */
205
+
background-image: none; /* 2 */
206
+
}
207
+
208
+
/*
209
+
Use the modern Firefox focus style for all focusable elements.
210
+
*/
211
+
212
+
:-moz-focusring {
213
+
outline: auto;
214
+
}
215
+
216
+
/*
217
+
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
218
+
*/
219
+
220
+
:-moz-ui-invalid {
221
+
box-shadow: none;
222
+
}
223
+
224
+
/*
225
+
Add the correct vertical alignment in Chrome and Firefox.
226
+
*/
227
+
228
+
progress {
229
+
vertical-align: baseline;
230
+
}
231
+
232
+
/*
233
+
Correct the cursor style of increment and decrement buttons in Safari.
234
+
*/
235
+
236
+
::-webkit-inner-spin-button,
237
+
::-webkit-outer-spin-button {
238
+
height: auto;
239
+
}
240
+
241
+
/*
242
+
1. Correct the odd appearance in Chrome and Safari.
243
+
2. Correct the outline style in Safari.
244
+
*/
245
+
246
+
[type='search'] {
247
+
-webkit-appearance: textfield; /* 1 */
248
+
outline-offset: -2px; /* 2 */
249
+
}
250
+
251
+
/*
252
+
Remove the inner padding in Chrome and Safari on macOS.
253
+
*/
254
+
255
+
::-webkit-search-decoration {
256
+
-webkit-appearance: none;
257
+
}
258
+
259
+
/*
260
+
1. Correct the inability to style clickable types in iOS and Safari.
261
+
2. Change font properties to `inherit` in Safari.
262
+
*/
263
+
264
+
::-webkit-file-upload-button {
265
+
-webkit-appearance: button; /* 1 */
266
+
font: inherit; /* 2 */
267
+
}
268
+
269
+
/*
270
+
Add the correct display in Chrome and Safari.
271
+
*/
272
+
273
+
summary {
274
+
display: list-item;
275
+
}
276
+
277
+
/*
278
+
Removes the default spacing for appropriate elements.
279
+
*/
280
+
281
+
blockquote,
282
+
dl,
283
+
dd,
284
+
h1,
285
+
h2,
286
+
h3,
287
+
h4,
288
+
h5,
289
+
h6,
290
+
hr,
291
+
figure,
292
+
p,
293
+
pre {
294
+
margin: 0;
295
+
}
296
+
297
+
fieldset {
298
+
margin: 0;
299
+
padding: 0;
300
+
}
301
+
302
+
legend {
303
+
padding: 0;
304
+
}
305
+
306
+
ol,
307
+
ul,
308
+
menu {
309
+
list-style: none;
310
+
margin: 0;
311
+
padding: 0;
312
+
}
313
+
314
+
dialog {
315
+
padding: 0;
316
+
}
317
+
318
+
/*
319
+
Prevent resizing textareas horizontally by default.
320
+
*/
321
+
322
+
textarea {
323
+
resize: vertical;
324
+
}
325
+
326
+
/*
327
+
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
328
+
2. Set the default placeholder color to the user's configured gray 400 color.
329
+
*/
330
+
331
+
input::placeholder,
332
+
textarea::placeholder {
333
+
opacity: 1; /* 1 */
334
+
color: #9ca3af; /* 2 */
335
+
}
336
+
337
+
/*
338
+
Set the default cursor for buttons.
339
+
*/
340
+
341
+
button,
342
+
[role="button"] {
343
+
cursor: pointer;
344
+
}
345
+
346
+
/*
347
+
Make sure disabled buttons don't get the pointer cursor.
348
+
*/
349
+
350
+
:disabled {
351
+
cursor: default;
352
+
}
353
+
354
+
/*
355
+
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
356
+
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
357
+
This can trigger a poorly considered lint error in some tools but is included by design.
358
+
*/
359
+
360
+
img,
361
+
svg,
362
+
video,
363
+
canvas,
364
+
audio,
365
+
iframe,
366
+
embed,
367
+
object {
368
+
display: block; /* 1 */
369
+
vertical-align: middle; /* 2 */
370
+
}
371
+
372
+
/*
373
+
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
374
+
*/
375
+
376
+
img,
377
+
video {
378
+
max-width: 100%;
379
+
height: auto;
380
+
}
381
+
382
+
/*
383
+
Make elements with the HTML hidden attribute stay hidden by default.
384
+
*/
385
+
386
+
[hidden]:where(:not([hidden="until-found"])) {
387
+
display: none;
388
+
}