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