Skip to content

Commit 1d2f04b

Browse files
Generate pages
1 parent a588954 commit 1d2f04b

8 files changed

Lines changed: 3021 additions & 0 deletions

File tree

docs/10.0.0/normalize.css

Lines changed: 410 additions & 0 deletions
Large diffs are not rendered by default.

docs/10.0.0/test.html

Lines changed: 375 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,375 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<meta charset="utf-8">
4+
<meta name="viewport" content="width=device-width,initial-scale=1">
5+
<title>normalize.css: tests</title>
6+
<script src="https://rawgit.com/aFarkas/html5shiv/gh-pages/dist/html5shiv.min.js"></script>
7+
<link rel="stylesheet" href="normalize.css">
8+
<style>
9+
/*! suit-test v0.1.0 | MIT License | github.com/suitcss */
10+
11+
.Test {
12+
background: #fff;
13+
counter-reset: test-describe;
14+
}
15+
16+
.Test-describe::before {
17+
content: counter(test-describe);
18+
counter-increment: test-describe;
19+
}
20+
21+
.Test-describe {
22+
counter-reset: test-it;
23+
font-size: 1.5em;
24+
margin: 60px 0 20px;
25+
}
26+
27+
.Test-it::before {
28+
content: counter(test-describe) "." counter(test-it);
29+
counter-increment: test-it;
30+
}
31+
32+
.Test-title {
33+
font-size: 2em;
34+
font-family: sans-serif;
35+
padding: 20px;
36+
margin: 20px 0;
37+
background: #eee;
38+
color: #999;
39+
}
40+
41+
.Test-describe,
42+
.Test-it {
43+
background: #eee;
44+
border-left: 5px solid #666;
45+
color: #666;
46+
font-family: sans-serif;
47+
font-weight: bold;
48+
margin: 20px 0;
49+
padding: 0.75em 20px;
50+
}
51+
52+
.Test-describe::before,
53+
.Test-it::before {
54+
color: #999;
55+
display: inline-block;
56+
margin-right: 10px;
57+
min-width: 30px;
58+
text-transform: uppercase;
59+
}
60+
61+
/**
62+
* Highlight the bounds of direct children of a test block
63+
*/
64+
65+
.Test-run--highlightEl > * {
66+
outline: 1px solid #add8e6;
67+
}
68+
</style>
69+
70+
<div class="Test">
71+
<h1 class="Test-title"><a href="https://github.com/csstools/normalize.css">normalize.css</a>: tests</h1>
72+
73+
<h2 class="Test-describe"><code>html</code></h2>
74+
<h3 class="Test-it">should have a line height of 1.15</h3>
75+
<div class="Test-run">
76+
abcdefghijklmnopqrstuvwxyz
77+
</div>
78+
<h3 class="Test-it">should not adjust font size after orientation changes</h3>
79+
<div class="Test-run">
80+
abcdefghijklmnopqrstuvwxyz
81+
</div>
82+
83+
<h2 class="Test-describe"><code>h1</code></h2>
84+
<h3 class="Test-it">should not change size within an <code>article</code> or <code>section</code></h3>
85+
<div class="Test-run">
86+
<h1>Heading (control)</h1>
87+
<article>
88+
<h1>Heading (in article)</h1>
89+
</article>
90+
<section>
91+
<h1>Heading (in section)</h1>
92+
</section>
93+
</div>
94+
95+
<h2 class="Test-describe"><code>hr</code></h2>
96+
<h3 class="Test-it">should have a <code>content-box</code> box model</h3>
97+
<div class="Test-run">
98+
<hr style="height:2px; border:solid #add8e6; border-width:2px 0;">
99+
</div>
100+
101+
<h2 class="Test-describe"><code>main</code></h2>
102+
<h3 class="Test-it">should display as block</h3>
103+
<div class="Test-run Test-run--highlightEl">
104+
<main>main</main>
105+
</div>
106+
107+
<h2 class="Test-describe"><code>pre</code></h2>
108+
<h3 class="Test-it">should render text at the same absolute size as normal text</h3>
109+
<div class="Test-run">
110+
<span>span: abcdefghijklmnopqrstuvwxyz.</span><br>
111+
<pre>pre: abcdefghijklmnopqrstuvwxyz.</pre>
112+
</div>
113+
114+
<h2 class="Test-describe"><code>a</code></h2>
115+
<h3 class="Test-it">should have a transparent background when active</h3>
116+
<div class="Test-run">
117+
<a href="#non">dummy anchor</a>
118+
</div>
119+
120+
<h2 class="Test-describe"><code>abbr[title]</code></h2>
121+
<h3 class="Test-it">should have a dotted underline text decoration with an underline fallback</h3>
122+
<div class="Test-run">
123+
<abbr title="abbreviation">abbr</abbr>
124+
</div>
125+
126+
<h2 class="Test-describe"><code>b</code>, <code>strong</code></h2>
127+
<h3 class="Test-it">should have a bolder font-weight</h3>
128+
<div class="Test-run">
129+
<p>
130+
<b>b</b>
131+
<strong>strong</strong>
132+
</p>
133+
<p style="font-weight:300;">
134+
<b>b</b>
135+
<strong>strong from font-weight:300</strong>
136+
</p>
137+
</div>
138+
139+
<h2 class="Test-describe"><code>code</code>, <code>kbd</code>, <code>samp</code></h2>
140+
<h3 class="Test-it">should render text at the same absolute size as normal text</h3>
141+
<div class="Test-run">
142+
<span>span: abcdefghijklmnopqrstuvwxyz.</span><br>
143+
<code>code: abcdefghijklmnopqrstuvwxyz.</code><br>
144+
<kbd>kbd: abcdefghijklmnopqrstuvwxyz.</kbd><br>
145+
<samp>samp: abcdefghijklmnopqrstuvwxyz.</samp>
146+
</div>
147+
148+
<h2 class="Test-describe"><code>small</code></h2>
149+
<h3 class="Test-it">should render equally small in all browsers</h3>
150+
<div class="Test-run">
151+
control. <small>small.</small>
152+
</div>
153+
154+
<h2 class="Test-describe"><code>audio</code>, <code>video</code></h2>
155+
<h3 class="Test-it">should display as inline-block</h3>
156+
<div class="Test-run">
157+
<audio controls></audio>
158+
<video controls></video>
159+
</div>
160+
161+
<h2 class="Test-describe"><code>audio</code></h2>
162+
<h3 class="Test-it">should not display</h3>
163+
<div class="Test-run">
164+
<audio></audio>
165+
</div>
166+
167+
<h2 class="Test-describe"><code>img</code></h2>
168+
<h3 class="Test-it">should not have a border when wrapped in an anchor</h3>
169+
<div class="Test-run">
170+
<a href="#non">
171+
<!-- scaled-up 1px image -->
172+
<img style="background-color:#add8e6; vertical-align:top;" src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" width="100" height="100">
173+
</a>
174+
</div>
175+
176+
<h2 class="Test-describe"><code>svg</code></h2>
177+
<h3 class="Test-it">should not overflow</h3>
178+
<div class="Test-run Test-run--highlightEl">
179+
<svg width="100px" height="100px">
180+
<circle cx="100" cy="100" r="100" fill="#add8e6" />
181+
</svg>
182+
</div>
183+
184+
<h2 class="Test-describe"><code>button</code>, <code>input</code>, <code>optgroup</code>, <code>select</code>, <code>textarea</code></h2>
185+
<h3 class="Test-it">should have no margin</h3>
186+
<div class="Test-run">
187+
<button>button</button><br>
188+
<input value="input"><br>
189+
<select style="border:1px solid #999;">
190+
<optgroup label="optgroup">
191+
<option>option</option>
192+
</optgroup>
193+
<option>option</option>
194+
</select><br>
195+
<textarea>textarea</textarea>
196+
</div>
197+
198+
<h2 class="Test-describe"><code>button</code></h2>
199+
<h3 class="Test-it">should have visible overflow</h3>
200+
<div class="Test-run" id="button-overflow">
201+
<style>
202+
#button-overflow button:after {
203+
content: "";
204+
background: #add8e6;
205+
display: inline-block;
206+
height: 10px;
207+
position: relative;
208+
right: -20px;
209+
width: 10px;
210+
}
211+
</style>
212+
<button>abcdefghijklmnopqrstuvwxyz</button>
213+
</div>
214+
215+
<h2 class="Test-describe"><code>button</code></h2>
216+
<h3 class="Test-it">should not inherit <code>text-transform</code></h3>
217+
<div class="Test-run" style="text-transform:uppercase;">
218+
<button>button</button>
219+
</div>
220+
221+
<h2 class="Test-describe"><code>button</code> and button-style <code>input</code></h2>
222+
<h3 class="Test-it">should be styleable</h3>
223+
<div class="Test-run" id="button-like-style">
224+
<style>
225+
#button-like-style button,
226+
#button-like-style input {
227+
background: #add8e6;
228+
border: 2px solid black;
229+
border-radius: 2px;
230+
padding: 5px;
231+
}
232+
</style>
233+
<p><button>button</button></p>
234+
<p><input type="image" src="//placehold.it/90x24" alt="input (image)"></p>
235+
<p><input type="button" value="input (button)"></p>
236+
<p><input type="file" value="input (file)"></p>
237+
<p><input type="reset" value="input (reset)"></p>
238+
<p><input type="submit" value="input (submit)"></p>
239+
</div>
240+
241+
<h2 class="Test-describe"><code>fieldset</code></h2>
242+
<h3 class="Test-it">should have consistent border, padding, and margin</h3>
243+
<div class="Test-run">
244+
<fieldset>
245+
<div style="width:100%; height:100px; background:#add8e6;"></div>
246+
</fieldset>
247+
</div>
248+
249+
<h2 class="Test-describe"><code>legend</code></h2>
250+
<h3 class="Test-it">should wrap text</h3>
251+
<div class="Test-run">
252+
<fieldset style="width: 34em;">
253+
<legend>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et me.</legend>
254+
</fieldset>
255+
</div>
256+
<h3 class="Test-it">should inherit color</h3>
257+
<div class="Test-run" style="color:#add8e6;">
258+
<fieldset>
259+
<legend>legend</legend>
260+
</fieldset>
261+
</div>
262+
<h3 class="Test-it">should not have padding</h3>
263+
<div class="Test-run">
264+
<fieldset>
265+
<legend>legend</legend>
266+
</fieldset>
267+
</div>
268+
269+
<h2 class="Test-describe"><code>progress</code></h2>
270+
<h3 class="Test-it">should display as inline-block</h3>
271+
<div class="Test-run">
272+
<progress value="70" max="100">70%</progress>
273+
</div>
274+
<h3 class="Test-it">should have baseline alignment</h3>
275+
<div class="Test-run">
276+
abc <progress value="70" max="100">70%</progress> xyz
277+
</div>
278+
279+
<h2 class="Test-describe"><code>select</code></h2>
280+
<h3 class="Test-it">should not inherit <code>text-transform</code></h3>
281+
<div class="Test-run" style="text-transform:uppercase;">
282+
<select><option>option</option></select>
283+
</div>
284+
285+
<h2 class="Test-describe"><code>textarea</code></h2>
286+
<h3 class="Test-it">should not have a scrollbar unless overflowing</h3>
287+
<div class="Test-run">
288+
<textarea>textarea</textarea>
289+
</div>
290+
291+
<h2 class="Test-describe"><code>[type="checkbox"]</code>, <code>[type="radio"]</code></h2>
292+
<h3 class="Test-it">should have a <code>border-box</code> box model</h3>
293+
<div class="Test-run Test-run--highlightEl" id="radio-box-model">
294+
<style>
295+
#radio-box-model {
296+
width: 200px;
297+
border: 1px solid red;
298+
}
299+
300+
#radio-box-model input {
301+
width: 100%;
302+
border: 5px solid #add8e6;
303+
display: block;
304+
position: relative;
305+
}
306+
</style>
307+
<input type="checkbox">
308+
<input type="radio" name="rad">
309+
</div>
310+
<h3 class="Test-it">should not have padding</h3>
311+
<div class="Test-run Test-run--highlightEl">
312+
<input type="checkbox">
313+
<input type="radio" name="rad">
314+
</div>
315+
316+
<h2 class="Test-describe"><code>[type="number"]</code></h2>
317+
<h3 class="Test-it">should display a default cursor for the decrement button's click target in Chrome</h3>
318+
<div class="Test-run">
319+
<input style="height:50px; font-size:15px;" type="number" id="in" min="0" max="10" value="5">
320+
</div>
321+
322+
<h2 class="Test-describe"><code>[type="search"]</code></h2>
323+
<h3 class="Test-it">should be styleable</h3>
324+
<div class="Test-run">
325+
<input type="search" style="border:1px solid #add8e6; padding:10px; width:200px;">
326+
</div>
327+
328+
<h2 class="Test-describe"><code>::placeholder</code></h2>
329+
<h3 class="Test-it">placeholder should be styleable</h3>
330+
<div class="Test-run">
331+
<input type="text" placeholder="placeholder text" style="color: blue;">
332+
</div>
333+
334+
<h2 class="Test-describe"><code>::file-upload-button</code></h2>
335+
<h3 class="Test-it">should be styleable</h3>
336+
<div class="Test-run">
337+
<input type="file" style="border:1px solid #add8e6; padding:10px; width:200px;">
338+
</div>
339+
340+
<h2 class="Test-describe">::focus-inner, ::focusring</h2>
341+
<h3 class="Test-it">should not have extra inner padding in Firefox</h3>
342+
<div class="Test-run" id="button-input-padding">
343+
<style>
344+
#button-input-padding button,
345+
#button-input-padding input {
346+
padding: 10px 20px;
347+
}
348+
</style>
349+
<p><button>button</button></p>
350+
<p><input type="button" value="input (button)"></p>
351+
<p><input type="reset" value="input (reset)"></p>
352+
<p><input type="submit" value="input (submit)"></p>
353+
</div>
354+
355+
<h2 class="Test-describe"><code>details</code></h2>
356+
<h3 class="Test-it">should display as block</h3>
357+
<div class="Test-run">
358+
<details></details>
359+
</div>
360+
361+
<h2 class="Test-describe"><code>dialog</code></h2>
362+
<h3 class="Test-it">should be absolutely positioned</h3>
363+
<div class="Test-run" style="position:relative; height:3em;">
364+
<dialog open>dialog</dialog>
365+
</div>
366+
367+
<h2 class="Test-describe"><code>summary</code></h2>
368+
<h3 class="Test-it">should display as list-item</h3>
369+
<div class="Test-run">
370+
<details>
371+
<summary>Summary</summary>
372+
<p>More information</p>
373+
</details>
374+
</div>
375+
</div>

0 commit comments

Comments
 (0)