@intergrav/dev.css 2.0.11 → 3.1.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/README.md +120 -84
- package/addon/header-sidebar.css +35 -0
- package/addon/header-sticky.css +8 -0
- package/demo.html +294 -274
- package/dev.css +487 -499
- package/package.json +30 -16
- package/theme/boilerplate.css +19 -19
- package/theme/night.css +16 -16
- package/theme/terminal.css +21 -21
package/demo.html
CHANGED
|
@@ -1,274 +1,294 @@
|
|
|
1
|
-
<!
|
|
2
|
-
<html lang="en">
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
<
|
|
134
|
-
<
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
1
|
+
<!doctype html>
|
|
2
|
+
<html lang="en">
|
|
3
|
+
<head>
|
|
4
|
+
<meta charset="UTF-8" />
|
|
5
|
+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
6
|
+
<title>demo - intergrav/dev.css</title>
|
|
7
|
+
<link rel="stylesheet" href="dev.css" />
|
|
8
|
+
<link
|
|
9
|
+
rel="stylesheet"
|
|
10
|
+
href="https://cdn.jsdelivr.net/npm/@intergrav/fonts@1/serve/geist.min.css"
|
|
11
|
+
/>
|
|
12
|
+
<link
|
|
13
|
+
rel="stylesheet"
|
|
14
|
+
href="https://cdn.jsdelivr.net/npm/@intergrav/fonts@1/serve/geist-mono.min.css"
|
|
15
|
+
/>
|
|
16
|
+
</head>
|
|
17
|
+
|
|
18
|
+
<body>
|
|
19
|
+
<header>
|
|
20
|
+
<h4>intergrav/dev.css</h4>
|
|
21
|
+
<h1>demo</h1>
|
|
22
|
+
<p>This is the demo page for dev.css.</p>
|
|
23
|
+
<nav>
|
|
24
|
+
<ul>
|
|
25
|
+
<li><a href="demo">demo</a></li>
|
|
26
|
+
<li><a href="https://github.com/intergrav/dev.css">git</a></li>
|
|
27
|
+
<li>
|
|
28
|
+
<a href="https://www.npmjs.com/package/@intergrav/dev.css">npm</a>
|
|
29
|
+
</li>
|
|
30
|
+
<li>
|
|
31
|
+
<a href="https://cdn.jsdelivr.net/npm/@intergrav/dev.css/"
|
|
32
|
+
>jsdelivr</a
|
|
33
|
+
>
|
|
34
|
+
</li>
|
|
35
|
+
</ul>
|
|
36
|
+
</nav>
|
|
37
|
+
</header>
|
|
38
|
+
|
|
39
|
+
<h1>Heading 1</h1>
|
|
40
|
+
<p>
|
|
41
|
+
This is paragraph text. Lorem ipsum dolor sit amet consectetur adipisicing
|
|
42
|
+
elit.
|
|
43
|
+
</p>
|
|
44
|
+
<h2>Heading 2</h2>
|
|
45
|
+
<p>
|
|
46
|
+
This is paragraph text. Lorem ipsum dolor sit amet consectetur adipisicing
|
|
47
|
+
elit.
|
|
48
|
+
</p>
|
|
49
|
+
<h3>Heading 3</h3>
|
|
50
|
+
<p>
|
|
51
|
+
This is paragraph text. Lorem ipsum dolor sit amet consectetur adipisicing
|
|
52
|
+
elit.
|
|
53
|
+
</p>
|
|
54
|
+
<h4>Heading 4</h4>
|
|
55
|
+
<p>
|
|
56
|
+
This is paragraph text. Lorem ipsum dolor sit amet consectetur adipisicing
|
|
57
|
+
elit.
|
|
58
|
+
</p>
|
|
59
|
+
<h5>Heading 5</h5>
|
|
60
|
+
<p>
|
|
61
|
+
This is paragraph text. Lorem ipsum dolor sit amet consectetur adipisicing
|
|
62
|
+
elit.
|
|
63
|
+
</p>
|
|
64
|
+
<h6>Heading 6</h6>
|
|
65
|
+
<p>
|
|
66
|
+
This is paragraph text. Lorem ipsum dolor sit amet consectetur adipisicing
|
|
67
|
+
elit.
|
|
68
|
+
</p>
|
|
69
|
+
|
|
70
|
+
<br />
|
|
71
|
+
<hr />
|
|
72
|
+
<br />
|
|
73
|
+
|
|
74
|
+
<blockquote>
|
|
75
|
+
This entire page was made with dev.css. You can view the source
|
|
76
|
+
<a href="https://github.com/intergrav/dev.css/blob/main/demo.html">here</a
|
|
77
|
+
>.
|
|
78
|
+
</blockquote>
|
|
79
|
+
|
|
80
|
+
<br />
|
|
81
|
+
<hr />
|
|
82
|
+
<br />
|
|
83
|
+
|
|
84
|
+
<p>
|
|
85
|
+
Lorem <mark>ipsum</mark> dolor sit amet
|
|
86
|
+
<strong>consectetur</strong> adipisicing elit. Aut
|
|
87
|
+
<i>harum molestias</i> labore amet possimus
|
|
88
|
+
<s>exercitationem aperiam</s> earum, doloribus
|
|
89
|
+
<u>nobis ducimus</u> maiores quia voluptates quis omnis molestiae
|
|
90
|
+
quisquam. <a href="#">Voluptatibus, officiis laudantium?</a>
|
|
91
|
+
</p>
|
|
92
|
+
|
|
93
|
+
<p>
|
|
94
|
+
Lorem ipsum dolor sit amet consectetur adipisicing elit.
|
|
95
|
+
<code>Hic culpa, nobis doloremque</code> veniam non, nihil cupiditate odit
|
|
96
|
+
repellat est <kbd>ALT + F4</kbd> expedita facilis. Fuga aspernatur, alias
|
|
97
|
+
debitis eveniet totam minima vel.
|
|
98
|
+
</p>
|
|
99
|
+
|
|
100
|
+
<ul>
|
|
101
|
+
<li>List item</li>
|
|
102
|
+
<li>List item</li>
|
|
103
|
+
<li>List item</li>
|
|
104
|
+
<li>List item</li>
|
|
105
|
+
</ul>
|
|
106
|
+
|
|
107
|
+
<ol>
|
|
108
|
+
<li>Step 1</li>
|
|
109
|
+
<li>Step 2</li>
|
|
110
|
+
<li>????</li>
|
|
111
|
+
<li>Profit!</li>
|
|
112
|
+
</ol>
|
|
113
|
+
|
|
114
|
+
<dl>
|
|
115
|
+
<dt>Web</dt>
|
|
116
|
+
<dd>The part of the Internet that contains websites and web pages</dd>
|
|
117
|
+
<dt>HTML</dt>
|
|
118
|
+
<dd>A markup language for creating web pages</dd>
|
|
119
|
+
<dt>CSS</dt>
|
|
120
|
+
<dd>A technology to make HTML look better</dd>
|
|
121
|
+
</dl>
|
|
122
|
+
|
|
123
|
+
<blockquote cite="https://en.wikiquote.org/wiki/Edward_Snowden">
|
|
124
|
+
If you think privacy is unimportant for you because you have nothing to
|
|
125
|
+
hide, you might as well say free speech is unimportant for you because you
|
|
126
|
+
have nothing useful to say.
|
|
127
|
+
<br />
|
|
128
|
+
<br />
|
|
129
|
+
– Edward Snowden
|
|
130
|
+
</blockquote>
|
|
131
|
+
|
|
132
|
+
<pre>
|
|
133
|
+
<!DOCTYPE html>
|
|
134
|
+
<html>
|
|
135
|
+
<head>
|
|
136
|
+
<title>Hello World</title>
|
|
137
|
+
</head>
|
|
138
|
+
<body>
|
|
139
|
+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
|
|
140
|
+
</body>
|
|
141
|
+
</html></pre
|
|
142
|
+
>
|
|
143
|
+
|
|
144
|
+
<br />
|
|
145
|
+
<hr />
|
|
146
|
+
<br />
|
|
147
|
+
|
|
148
|
+
<details>
|
|
149
|
+
<summary>Click me!</summary>
|
|
150
|
+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.</p>
|
|
151
|
+
</details>
|
|
152
|
+
|
|
153
|
+
<br />
|
|
154
|
+
<hr />
|
|
155
|
+
<br />
|
|
156
|
+
|
|
157
|
+
<table>
|
|
158
|
+
<caption>
|
|
159
|
+
Ho-kago Tea Time
|
|
160
|
+
</caption>
|
|
161
|
+
<thead>
|
|
162
|
+
<tr>
|
|
163
|
+
<th>Name</th>
|
|
164
|
+
<th>Instrument</th>
|
|
165
|
+
</tr>
|
|
166
|
+
</thead>
|
|
167
|
+
<tbody>
|
|
168
|
+
<tr>
|
|
169
|
+
<td>Yui Hirasawa</td>
|
|
170
|
+
<td>Lead Guitar</td>
|
|
171
|
+
</tr>
|
|
172
|
+
<tr>
|
|
173
|
+
<td>Mio Akiyama</td>
|
|
174
|
+
<td>Bass</td>
|
|
175
|
+
</tr>
|
|
176
|
+
<tr>
|
|
177
|
+
<td>Ritsu Tainaka</td>
|
|
178
|
+
<td>Drums</td>
|
|
179
|
+
</tr>
|
|
180
|
+
<tr>
|
|
181
|
+
<td>Tsumugi Kotobuki</td>
|
|
182
|
+
<td>Keyboard</td>
|
|
183
|
+
</tr>
|
|
184
|
+
<tr>
|
|
185
|
+
<td>Azusa Nakano</td>
|
|
186
|
+
<td>Rhythm Guitar</td>
|
|
187
|
+
</tr>
|
|
188
|
+
</tbody>
|
|
189
|
+
<tfoot>
|
|
190
|
+
<tr>
|
|
191
|
+
<th>Name</th>
|
|
192
|
+
<th>Instrument</th>
|
|
193
|
+
</tr>
|
|
194
|
+
</tfoot>
|
|
195
|
+
</table>
|
|
196
|
+
|
|
197
|
+
<br />
|
|
198
|
+
<hr />
|
|
199
|
+
<br />
|
|
200
|
+
|
|
201
|
+
<form>
|
|
202
|
+
<p>
|
|
203
|
+
<em>
|
|
204
|
+
This is not a real form and does not submit or save any information.
|
|
205
|
+
</em>
|
|
206
|
+
</p>
|
|
207
|
+
<p>
|
|
208
|
+
<label>First name</label><br />
|
|
209
|
+
<input type="text" name="first_name" />
|
|
210
|
+
</p>
|
|
211
|
+
<p>
|
|
212
|
+
<label>Last name</label><br />
|
|
213
|
+
<input type="text" name="last_name" />
|
|
214
|
+
</p>
|
|
215
|
+
<p>
|
|
216
|
+
<label>Gender</label><br />
|
|
217
|
+
<label>
|
|
218
|
+
<input type="radio" name="gender" value="Male" />
|
|
219
|
+
Male
|
|
220
|
+
</label>
|
|
221
|
+
<br />
|
|
222
|
+
<label>
|
|
223
|
+
<input type="radio" name="gender" value="Female" />
|
|
224
|
+
Female
|
|
225
|
+
</label>
|
|
226
|
+
<br />
|
|
227
|
+
<label>
|
|
228
|
+
<input type="radio" name="gender" value="other-none-na" />
|
|
229
|
+
Non-binary
|
|
230
|
+
</label>
|
|
231
|
+
</p>
|
|
232
|
+
<p>
|
|
233
|
+
<label>Email</label><br />
|
|
234
|
+
<input type="email" name="email" required="" />
|
|
235
|
+
</p>
|
|
236
|
+
<p>
|
|
237
|
+
<label>Phone number</label><br />
|
|
238
|
+
<input type="tel" name="phone" />
|
|
239
|
+
</p>
|
|
240
|
+
<p>
|
|
241
|
+
<label>Password</label><br />
|
|
242
|
+
<input type="password" name="password" />
|
|
243
|
+
</p>
|
|
244
|
+
<p>
|
|
245
|
+
<label>Country</label><br />
|
|
246
|
+
<select>
|
|
247
|
+
<option>China</option>
|
|
248
|
+
<option>India</option>
|
|
249
|
+
<option>United States</option>
|
|
250
|
+
<option>Indonesia</option>
|
|
251
|
+
<option>Brazil</option>
|
|
252
|
+
</select>
|
|
253
|
+
</p>
|
|
254
|
+
<p>
|
|
255
|
+
<label>Comments</label><br />
|
|
256
|
+
<textarea></textarea>
|
|
257
|
+
</p>
|
|
258
|
+
<p>
|
|
259
|
+
<label>
|
|
260
|
+
<input type="checkbox" value="terms" />
|
|
261
|
+
I agree to the <a>terms and conditions</a>
|
|
262
|
+
</label>
|
|
263
|
+
</p>
|
|
264
|
+
<p>
|
|
265
|
+
<button>Sign up</button>
|
|
266
|
+
<button type="reset">Reset form</button>
|
|
267
|
+
<button disabled="disabled">Disabled</button>
|
|
268
|
+
</p>
|
|
269
|
+
</form>
|
|
270
|
+
|
|
271
|
+
<br />
|
|
272
|
+
<hr />
|
|
273
|
+
<br />
|
|
274
|
+
|
|
275
|
+
<img
|
|
276
|
+
src="https://elements.xz.style/assets/fuji-daniel-hehn.jpg"
|
|
277
|
+
alt="Mt. Fuji"
|
|
278
|
+
/>
|
|
279
|
+
|
|
280
|
+
<p>
|
|
281
|
+
Inline image:
|
|
282
|
+
<a href="#"
|
|
283
|
+
><img
|
|
284
|
+
src="https://elements.xz.style/assets/fuji-daniel-hehn.jpg"
|
|
285
|
+
width="50"
|
|
286
|
+
alt="Mt. Fuji"
|
|
287
|
+
/></a>
|
|
288
|
+
</p>
|
|
289
|
+
|
|
290
|
+
<footer>
|
|
291
|
+
<p>This is an optional footer.</p>
|
|
292
|
+
</footer>
|
|
293
|
+
</body>
|
|
294
|
+
</html>
|