Skip to content

Commit 31ccbdc

Browse files
committed
fix docs and add test coverage
1 parent b8840b0 commit 31ccbdc

4 files changed

+281
-1
lines changed

.tape.js

+6
Original file line numberDiff line numberDiff line change
@@ -19,6 +19,12 @@ module.exports = {
1919
browsers: fixed_browserslist
2020
}
2121
},
22+
'basic-normalize-opinionated': {
23+
message: 'supports @import-normalize "opinionated.css" usage',
24+
options: {
25+
browsers: fixed_browserslist
26+
}
27+
},
2228
'basic-sanitize': {
2329
message: 'supports @import-sanitize usage',
2430
options: {

README.md

+1-1
Original file line numberDiff line numberDiff line change
@@ -128,7 +128,7 @@ with `@import` transforms.
128128
```
129129

130130
```pcss
131-
@import-normalize "opinionated.css";
131+
@import-normalize "normalize/opinionated.css";
132132
```
133133

134134
```pcss

test/basic-normalize-opinionated.css

+5
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
@import-normalize "normalize/opinionated.css";
2+
3+
body {
4+
font-family: sans-serif;
5+
}
+269
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,269 @@
1+
/* Document
2+
* ========================================================================== */
3+
4+
/**
5+
* 1. Correct the line height in all browsers.
6+
* 2. Prevent adjustments of font size after orientation changes in iOS.
7+
*/
8+
9+
:where(html) {
10+
line-height: 1.15; /* 1 */
11+
-webkit-text-size-adjust: 100%; /* 2 */
12+
text-size-adjust: 100%; /* 2 */
13+
}
14+
15+
/* Sections
16+
* ========================================================================== */
17+
18+
/**
19+
* Remove the margin in all browsers. (opinionated)
20+
*/
21+
22+
:where(body) {
23+
margin: 0;
24+
}
25+
26+
/**
27+
* Correct the font size and margin on `h1` elements within `section` and
28+
* `article` contexts in Chrome, Edge, Firefox, and Safari.
29+
*/
30+
31+
:where(h1) {
32+
font-size: 2em;
33+
margin-block-end: 0.67em;
34+
margin-block-start: 0.67em;
35+
}
36+
37+
/* Grouping content
38+
* ========================================================================== */
39+
40+
/**
41+
* Remove the margin on nested lists in Chrome, Edge, and Safari.
42+
*/
43+
44+
:where(dl, ol, ul) :where(dl, ol, ul) {
45+
margin-block-end: 0;
46+
margin-block-start: 0;
47+
}
48+
49+
/**
50+
* 1. Add the correct box sizing in Firefox.
51+
* 2. Correct the inheritance of border color in Firefox.
52+
*/
53+
54+
:where(hr) {
55+
box-sizing: content-box; /* 1 */
56+
color: inherit; /* 2 */
57+
height: 0; /* 1 */
58+
}
59+
60+
/* Text-level semantics
61+
* ========================================================================== */
62+
63+
/**
64+
* Add the correct text decoration in Safari.
65+
*/
66+
67+
:where(abbr[title]) {
68+
text-decoration: underline;
69+
text-decoration: underline dotted;
70+
}
71+
72+
/**
73+
* Add the correct font weight in Chrome, Edge, and Safari.
74+
*/
75+
76+
:where(b, strong) {
77+
font-weight: bolder;
78+
}
79+
80+
/**
81+
* 1. Correct the inheritance and scaling of font size in all browsers.
82+
* 2. Correct the odd `em` font sizing in all browsers.
83+
*/
84+
85+
:where(code, kbd, pre, samp) {
86+
font-family: monospace, monospace; /* 1 */
87+
font-size: 1em; /* 2 */
88+
}
89+
90+
/**
91+
* Add the correct font size in all browsers.
92+
*/
93+
94+
:where(small) {
95+
font-size: 80%;
96+
}
97+
98+
/* Tabular data
99+
* ========================================================================== */
100+
101+
/**
102+
* 1. Correct table border color in Chrome, Edge, and Safari.
103+
* 2. Remove text indentation from table contents in Chrome, Edge, and Safari.
104+
*/
105+
106+
:where(table) {
107+
border-color: currentColor; /* 1 */
108+
text-indent: 0; /* 2 */
109+
}
110+
111+
/* Forms
112+
* ========================================================================== */
113+
114+
/**
115+
* Remove the margin on controls in Safari.
116+
*/
117+
118+
:where(button, input, select) {
119+
margin: 0;
120+
}
121+
122+
/**
123+
* Remove the inheritance of text transform in Firefox.
124+
*/
125+
126+
:where(button) {
127+
text-transform: none;
128+
}
129+
130+
/**
131+
* Correct the inability to style buttons in iOS and Safari.
132+
*/
133+
134+
:where(button, input:is([type="button" i], [type="reset" i], [type="submit" i])) {
135+
-webkit-appearance: button;
136+
}
137+
138+
/**
139+
* Add the correct vertical alignment in Chrome, Edge, and Firefox.
140+
*/
141+
142+
:where(progress) {
143+
vertical-align: baseline;
144+
}
145+
146+
/**
147+
* Remove the inheritance of text transform in Firefox.
148+
*/
149+
150+
:where(select) {
151+
text-transform: none;
152+
}
153+
154+
/**
155+
* Remove the margin in Firefox and Safari.
156+
*/
157+
158+
:where(textarea) {
159+
margin: 0;
160+
}
161+
162+
/**
163+
* 1. Correct the odd appearance in Chrome, Edge, and Safari.
164+
* 2. Correct the outline style in Safari.
165+
*/
166+
167+
:where(input[type="search" i]) {
168+
-webkit-appearance: textfield; /* 1 */
169+
outline-offset: -2px; /* 2 */
170+
}
171+
172+
/**
173+
* Correct the cursor style of increment and decrement buttons in Safari.
174+
*/
175+
176+
::-webkit-inner-spin-button,
177+
::-webkit-outer-spin-button {
178+
height: auto;
179+
}
180+
181+
/**
182+
* Correct the text style of placeholders in Chrome, Edge, and Safari.
183+
*/
184+
185+
::-webkit-input-placeholder {
186+
color: inherit;
187+
opacity: 0.54;
188+
}
189+
190+
/**
191+
* Remove the inner padding in Chrome, Edge, and Safari on macOS.
192+
*/
193+
194+
::-webkit-search-decoration {
195+
-webkit-appearance: none;
196+
}
197+
198+
/**
199+
* 1. Correct the inability to style upload buttons in iOS and Safari.
200+
* 2. Change font properties to `inherit` in Safari.
201+
*/
202+
203+
::-webkit-file-upload-button {
204+
-webkit-appearance: button; /* 1 */
205+
font: inherit; /* 2 */
206+
}
207+
208+
/**
209+
* Remove the inner border and padding of focus outlines in Firefox.
210+
*/
211+
212+
:where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focus-inner {
213+
border-style: none;
214+
padding: 0;
215+
}
216+
217+
/**
218+
* Restore the focus outline styles unset by the previous rule in Firefox.
219+
*/
220+
221+
:where(button, input:is([type="button" i], [type="color" i], [type="reset" i], [type="submit" i]))::-moz-focusring {
222+
outline: 1px dotted ButtonText;
223+
}
224+
225+
/**
226+
* Remove the additional :invalid styles in Firefox.
227+
*/
228+
229+
:where(:-moz-ui-invalid) {
230+
box-shadow: none;
231+
}
232+
233+
/* Interactive
234+
* ========================================================================== */
235+
236+
/*
237+
* Add the correct styles in Safari.
238+
*/
239+
240+
:where(dialog) {
241+
background-color: white;
242+
border: solid;
243+
color: black;
244+
height: -moz-fit-content;
245+
height: fit-content;
246+
left: 0;
247+
margin: auto;
248+
padding: 1em;
249+
position: absolute;
250+
right: 0;
251+
width: -moz-fit-content;
252+
width: fit-content;
253+
}
254+
255+
:where(dialog:not([open])) {
256+
display: none;
257+
}
258+
259+
/*
260+
* Add the correct display in all browsers.
261+
*/
262+
263+
:where(summary) {
264+
display: list-item;
265+
}
266+
267+
body {
268+
font-family: sans-serif;
269+
}

0 commit comments

Comments
 (0)