sass-zero 1.0.10 → 1.0.14
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/Example.html +19 -12
- data/README.md +1 -1
- data/app/assets/stylesheets/sass-zero/base/preflight.scss +283 -175
- data/app/assets/stylesheets/sass-zero/base.scss +1 -2
- data/app/assets/stylesheets/sass-zero/breadboard.scss +25 -16
- data/app/assets/stylesheets/sass-zero/mixins.scss +4 -4
- data/app/assets/stylesheets/sass-zero/utilities/container.scss +2 -2
- data/app/assets/stylesheets/sass-zero/utilities/layout.scss +3 -3
- data/app/assets/stylesheets/sass-zero/utilities/list.scss +2 -2
- data/app/assets/stylesheets/sass-zero/utilities/pull.scss +1 -1
- data/app/assets/stylesheets/sass-zero/utilities/push.scss +1 -1
- data/app/assets/stylesheets/sass-zero/utilities/text.scss +3 -3
- data/app/assets/stylesheets/sass-zero/utilities.scss +12 -12
- data/app/assets/stylesheets/sass-zero/variables.scss +14 -14
- data/lib/sass/zero/version.rb +1 -1
- data/package.json +1 -1
- metadata +2 -3
- data/app/assets/stylesheets/sass-zero/base/normalize.css +0 -285
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: b9dc3be56445fbb5e26b00137cdead641155a78dd6f2d63d0c0dbf86b43bb8cd
|
4
|
+
data.tar.gz: 3a45037e686d4a32b35e958b4c5aedf032ab4c948d0a4987f1952909774be6f0
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: de6e645117d3ce1c89966c202ac84568280b3bed4ab40565eabdcb07e8aa03836f0895903ede994ce4fbc77b37cee803acfdad03f3dcd67f96823c245105ab56
|
7
|
+
data.tar.gz: 61ce8cb0034dc58fc9eea6dedf09ce9a1598fee3aa13fc21c0c1fba21297faf907334d308ee736c36539cb7c42d571aae9f263ba95455c74207053fc47b7771c
|
data/Example.html
CHANGED
@@ -19,9 +19,21 @@
|
|
19
19
|
<button class="btn btn--tertiary">Button Tertiary</button>
|
20
20
|
|
21
21
|
<a href="#" class="btn btn--secondary">Link Button</a>
|
22
|
+
|
22
23
|
<input type="submit" value="Submit Button" class="btn btn--secondary" />
|
23
24
|
|
24
|
-
<
|
25
|
+
<details class="u-display-ib">
|
26
|
+
<summary class="btn btn--secondary">Popup Button</summary>
|
27
|
+
<div class="popup-menu push-xs--top u-position--right">
|
28
|
+
<ul class="list--unindented u-nowrap flush">
|
29
|
+
<li>Unordered list item 1</li>
|
30
|
+
<li>Unordered list item 2</li>
|
31
|
+
<li>Unordered list item 3</li>
|
32
|
+
</ul>
|
33
|
+
</div>
|
34
|
+
</details>
|
35
|
+
|
36
|
+
<button class="btn btn--secondary"><span class="btn__icon bx bx-plus"></span> Icon Button</button>
|
25
37
|
<button class="btn btn--secondary btn--small">Small Button</button>
|
26
38
|
|
27
39
|
<hr>
|
@@ -115,11 +127,6 @@
|
|
115
127
|
</tbody>
|
116
128
|
</table>
|
117
129
|
|
118
|
-
<details>
|
119
|
-
<summary>Some details</summary>
|
120
|
-
<p>More info about the details.</p>
|
121
|
-
</details>
|
122
|
-
|
123
130
|
<blockquote>
|
124
131
|
<p class="flush--bottom">Friends don’t spy; true friendship is about privacy, too.</p>
|
125
132
|
<cite class="txt--sm">– Stephen King</cite>
|
@@ -137,12 +144,7 @@
|
|
137
144
|
</code>
|
138
145
|
</div>
|
139
146
|
|
140
|
-
<div class="push-md--bottom">
|
141
|
-
<label for="progres" class="u-display-b txt--bold">Progress</label>
|
142
|
-
<progress id="progres" max="100" value="70">70%</progress>
|
143
|
-
</div>
|
144
|
-
|
145
|
-
<div class="push-3xl--bottom">
|
147
|
+
<div class="push-md--bottom" style="height: 55px;">
|
146
148
|
<dialog open>
|
147
149
|
<form method="dialog">
|
148
150
|
<span>User was successfully created.</span>
|
@@ -151,6 +153,11 @@
|
|
151
153
|
</dialog>
|
152
154
|
</div>
|
153
155
|
|
156
|
+
<div class="push-md--bottom">
|
157
|
+
<label for="progres" class="u-display-b txt--bold">Progress</label>
|
158
|
+
<progress id="progres" max="100" value="70">70%</progress>
|
159
|
+
</div>
|
160
|
+
|
154
161
|
<hr>
|
155
162
|
|
156
163
|
<ul class="list--unindented">
|
data/README.md
CHANGED
@@ -2,7 +2,7 @@
|
|
2
2
|
|
3
3
|
SASS-ZERO is a css framework that brings concepts from [tailwindcss](https://tailwindcss.com) and [milligram](https://milligram.io) but with ideas from [BEM](http://getbem.com/naming), [Refactoring UI](https://refactoringui.com/book) and [Shape UP](https://basecamp.com/shapeup).
|
4
4
|
|
5
|
-
![screenshot](https://nixo-etc.s3-sa-east-1.amazonaws.com/sass-zero-screenshot-
|
5
|
+
![screenshot](https://nixo-etc.s3-sa-east-1.amazonaws.com/sass-zero-screenshot-3.png)
|
6
6
|
|
7
7
|
### Milligram
|
8
8
|
|
@@ -1,232 +1,343 @@
|
|
1
|
-
@import "
|
2
|
-
@import "
|
1
|
+
@import "../variables/colors";
|
2
|
+
@import "../variables/typography";
|
3
3
|
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
*/
|
4
|
+
/*
|
5
|
+
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
|
6
|
+
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
|
7
|
+
*/
|
9
8
|
|
10
|
-
|
11
|
-
|
12
|
-
|
9
|
+
*,
|
10
|
+
::before,
|
11
|
+
::after {
|
12
|
+
box-sizing: border-box; /* 1 */
|
13
|
+
border-width: 0; /* 2 */
|
14
|
+
border-style: solid; /* 2 */
|
15
|
+
border-color: $gray-200; /* 2 */
|
16
|
+
}
|
17
|
+
|
18
|
+
::before,
|
19
|
+
::after {
|
20
|
+
--tw-content: '';
|
21
|
+
}
|
22
|
+
|
23
|
+
/*
|
24
|
+
1. Use a consistent sensible line-height in all browsers.
|
25
|
+
2. Prevent adjustments of font size after orientation changes in iOS.
|
26
|
+
3. Use a more readable tab size.
|
27
|
+
4. Use the user's configured `sans` font-family by default.
|
28
|
+
*/
|
29
|
+
|
30
|
+
html {
|
31
|
+
line-height: 1.5; /* 1 */
|
32
|
+
-webkit-text-size-adjust: 100%; /* 2 */
|
33
|
+
-moz-tab-size: 4; /* 3 */
|
34
|
+
tab-size: 4; /* 3 */
|
35
|
+
font-family: $font-sans; /* 4 */
|
36
|
+
}
|
37
|
+
|
38
|
+
/*
|
39
|
+
1. Remove the margin in all browsers.
|
40
|
+
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
|
41
|
+
*/
|
42
|
+
|
43
|
+
body {
|
44
|
+
margin: 0; /* 1 */
|
45
|
+
line-height: inherit; /* 2 */
|
46
|
+
}
|
47
|
+
|
48
|
+
/*
|
49
|
+
1. Add the correct height in Firefox.
|
50
|
+
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
|
51
|
+
3. Ensure horizontal rules are visible by default.
|
52
|
+
*/
|
53
|
+
|
54
|
+
hr {
|
55
|
+
height: 0; /* 1 */
|
56
|
+
color: inherit; /* 2 */
|
57
|
+
border-top-width: 1px; /* 3 */
|
58
|
+
}
|
59
|
+
|
60
|
+
/*
|
61
|
+
Add the correct text decoration in Chrome, Edge, and Safari.
|
62
|
+
*/
|
63
|
+
|
64
|
+
abbr:where([title]) {
|
65
|
+
text-decoration: underline dotted;
|
66
|
+
}
|
67
|
+
|
68
|
+
/*
|
69
|
+
Remove the default font size and weight for headings.
|
70
|
+
*/
|
13
71
|
|
14
|
-
blockquote,
|
15
|
-
dl,
|
16
|
-
dd,
|
17
72
|
h1,
|
18
73
|
h2,
|
19
74
|
h3,
|
20
75
|
h4,
|
21
76
|
h5,
|
22
|
-
h6
|
23
|
-
|
24
|
-
|
25
|
-
|
77
|
+
h6 {
|
78
|
+
font-size: inherit;
|
79
|
+
font-weight: inherit;
|
80
|
+
}
|
81
|
+
|
82
|
+
/*
|
83
|
+
Reset links to optimize for opt-in styling instead of opt-out.
|
84
|
+
*/
|
85
|
+
|
86
|
+
a {
|
87
|
+
color: inherit;
|
88
|
+
text-decoration: inherit;
|
89
|
+
}
|
90
|
+
|
91
|
+
/*
|
92
|
+
Add the correct font weight in Edge and Safari.
|
93
|
+
*/
|
94
|
+
|
95
|
+
b,
|
96
|
+
strong {
|
97
|
+
font-weight: bolder;
|
98
|
+
}
|
99
|
+
|
100
|
+
/*
|
101
|
+
1. Use the user's configured `mono` font family by default.
|
102
|
+
2. Correct the odd `em` font sizing in all browsers.
|
103
|
+
*/
|
104
|
+
|
105
|
+
code,
|
106
|
+
kbd,
|
107
|
+
samp,
|
26
108
|
pre {
|
27
|
-
|
109
|
+
font-family: $font-mono; /* 1 */
|
110
|
+
font-size: 1em; /* 2 */
|
28
111
|
}
|
29
112
|
|
30
|
-
|
31
|
-
|
32
|
-
|
113
|
+
/*
|
114
|
+
Add the correct font size in all browsers.
|
115
|
+
*/
|
116
|
+
|
117
|
+
small {
|
118
|
+
font-size: 80%;
|
33
119
|
}
|
34
120
|
|
35
|
-
|
36
|
-
|
37
|
-
|
121
|
+
/*
|
122
|
+
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
|
123
|
+
*/
|
124
|
+
|
125
|
+
sub,
|
126
|
+
sup {
|
127
|
+
font-size: 75%;
|
128
|
+
line-height: 0;
|
129
|
+
position: relative;
|
130
|
+
vertical-align: baseline;
|
38
131
|
}
|
39
132
|
|
40
|
-
|
41
|
-
|
42
|
-
list-style: none;
|
43
|
-
margin: 0;
|
44
|
-
padding: 0;
|
133
|
+
sub {
|
134
|
+
bottom: -0.25em;
|
45
135
|
}
|
46
136
|
|
47
|
-
|
48
|
-
|
49
|
-
|
137
|
+
sup {
|
138
|
+
top: -0.5em;
|
139
|
+
}
|
50
140
|
|
51
|
-
|
52
|
-
|
53
|
-
|
54
|
-
|
55
|
-
|
56
|
-
*/
|
141
|
+
/*
|
142
|
+
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)
|
143
|
+
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)
|
144
|
+
3. Remove gaps between table borders by default.
|
145
|
+
*/
|
57
146
|
|
58
|
-
|
59
|
-
|
60
|
-
|
147
|
+
table {
|
148
|
+
text-indent: 0; /* 1 */
|
149
|
+
border-color: inherit; /* 2 */
|
150
|
+
border-collapse: collapse; /* 3 */
|
61
151
|
}
|
62
152
|
|
153
|
+
/*
|
154
|
+
1. Change the font styles in all browsers.
|
155
|
+
2. Remove the margin in Firefox and Safari.
|
156
|
+
3. Remove default padding in all browsers.
|
157
|
+
*/
|
63
158
|
|
64
|
-
|
65
|
-
|
66
|
-
|
67
|
-
|
159
|
+
button,
|
160
|
+
input,
|
161
|
+
optgroup,
|
162
|
+
select,
|
163
|
+
textarea {
|
164
|
+
font-family: inherit; /* 1 */
|
165
|
+
font-size: 100%; /* 1 */
|
166
|
+
line-height: inherit; /* 1 */
|
167
|
+
color: inherit; /* 1 */
|
168
|
+
margin: 0; /* 2 */
|
169
|
+
padding: 0; /* 3 */
|
170
|
+
}
|
68
171
|
|
69
|
-
|
70
|
-
|
71
|
-
|
172
|
+
/*
|
173
|
+
Remove the inheritance of text transform in Edge and Firefox.
|
174
|
+
*/
|
175
|
+
|
176
|
+
button,
|
177
|
+
select {
|
178
|
+
text-transform: none;
|
72
179
|
}
|
73
180
|
|
74
|
-
|
75
|
-
|
76
|
-
|
77
|
-
|
78
|
-
* the parent element for everything else. This caused issues
|
79
|
-
* in shadow-dom-enhanced elements like <details> where the content
|
80
|
-
* is wrapped by a div with box-sizing set to `content-box`.
|
81
|
-
*
|
82
|
-
* https://github.com/mozdevs/cssremedy/issues/4
|
83
|
-
*
|
84
|
-
*
|
85
|
-
* 2. Allow adding a border to an element by just adding a border-width.
|
86
|
-
*
|
87
|
-
* By default, the way the browser specifies that an element should have no
|
88
|
-
* border is by setting it's border-style to `none` in the user-agent
|
89
|
-
* stylesheet.
|
90
|
-
*
|
91
|
-
* In order to easily add borders to elements by just setting the `border-width`
|
92
|
-
* property, we change the default border-style for all elements to `solid`, and
|
93
|
-
* use border-width to hide them instead. This way our `border` utilities only
|
94
|
-
* need to set the `border-width` property instead of the entire `border`
|
95
|
-
* shorthand, making our border utilities much more straightforward to compose.
|
96
|
-
*
|
97
|
-
* https://github.com/tailwindcss/tailwindcss/pull/116
|
98
|
-
*/
|
181
|
+
/*
|
182
|
+
1. Correct the inability to style clickable types in iOS and Safari.
|
183
|
+
2. Remove default button styles.
|
184
|
+
*/
|
99
185
|
|
100
|
-
|
101
|
-
|
102
|
-
|
103
|
-
|
104
|
-
|
105
|
-
|
106
|
-
|
186
|
+
button,
|
187
|
+
[type='button'],
|
188
|
+
[type='reset'],
|
189
|
+
[type='submit'] {
|
190
|
+
-webkit-appearance: button; /* 1 */
|
191
|
+
background-color: transparent; /* 2 */
|
192
|
+
background-image: none; /* 2 */
|
107
193
|
}
|
108
194
|
|
109
195
|
/*
|
110
|
-
|
111
|
-
|
196
|
+
Use the modern Firefox focus style for all focusable elements.
|
197
|
+
*/
|
112
198
|
|
113
|
-
|
114
|
-
|
199
|
+
:-moz-focusring {
|
200
|
+
outline: auto;
|
115
201
|
}
|
116
202
|
|
117
|
-
|
118
|
-
|
119
|
-
|
120
|
-
*
|
121
|
-
* The Normalize reset is unnecessary for us since we default the border-width
|
122
|
-
* to 0 on all elements.
|
123
|
-
*
|
124
|
-
* https://github.com/tailwindcss/tailwindcss/issues/362
|
125
|
-
*/
|
203
|
+
/*
|
204
|
+
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
|
205
|
+
*/
|
126
206
|
|
127
|
-
|
128
|
-
|
207
|
+
:-moz-ui-invalid {
|
208
|
+
box-shadow: none;
|
129
209
|
}
|
130
210
|
|
131
|
-
|
132
|
-
|
211
|
+
/*
|
212
|
+
Add the correct vertical alignment in Chrome and Firefox.
|
213
|
+
*/
|
214
|
+
|
215
|
+
progress {
|
216
|
+
vertical-align: baseline;
|
133
217
|
}
|
134
218
|
|
135
|
-
|
136
|
-
|
137
|
-
|
138
|
-
|
219
|
+
/*
|
220
|
+
Correct the cursor style of increment and decrement buttons in Safari.
|
221
|
+
*/
|
222
|
+
|
223
|
+
::-webkit-inner-spin-button,
|
224
|
+
::-webkit-outer-spin-button {
|
225
|
+
height: auto;
|
139
226
|
}
|
140
227
|
|
141
|
-
|
142
|
-
|
143
|
-
|
228
|
+
/*
|
229
|
+
1. Correct the odd appearance in Chrome and Safari.
|
230
|
+
2. Correct the outline style in Safari.
|
231
|
+
*/
|
232
|
+
|
233
|
+
[type='search'] {
|
234
|
+
-webkit-appearance: textfield; /* 1 */
|
235
|
+
outline-offset: -2px; /* 2 */
|
144
236
|
}
|
145
237
|
|
146
|
-
|
147
|
-
|
148
|
-
|
149
|
-
* This is actually an improvement over the new defaults in Firefox in our testing,
|
150
|
-
* as it triggers the better focus styles even for links, which still use a dotted
|
151
|
-
* outline in Firefox by default.
|
152
|
-
*/
|
238
|
+
/*
|
239
|
+
Remove the inner padding in Chrome and Safari on macOS.
|
240
|
+
*/
|
153
241
|
|
154
|
-
|
155
|
-
|
242
|
+
::-webkit-search-decoration {
|
243
|
+
-webkit-appearance: none;
|
156
244
|
}
|
157
245
|
|
158
|
-
|
159
|
-
|
246
|
+
/*
|
247
|
+
1. Correct the inability to style clickable types in iOS and Safari.
|
248
|
+
2. Change font properties to `inherit` in Safari.
|
249
|
+
*/
|
250
|
+
|
251
|
+
::-webkit-file-upload-button {
|
252
|
+
-webkit-appearance: button; /* 1 */
|
253
|
+
font: inherit; /* 2 */
|
160
254
|
}
|
161
255
|
|
256
|
+
/*
|
257
|
+
Add the correct display in Chrome and Safari.
|
258
|
+
*/
|
259
|
+
|
260
|
+
summary {
|
261
|
+
display: list-item;
|
262
|
+
}
|
263
|
+
|
264
|
+
/*
|
265
|
+
Removes the default spacing and border for appropriate elements.
|
266
|
+
*/
|
267
|
+
|
268
|
+
blockquote,
|
269
|
+
dl,
|
270
|
+
dd,
|
162
271
|
h1,
|
163
272
|
h2,
|
164
273
|
h3,
|
165
274
|
h4,
|
166
275
|
h5,
|
167
|
-
h6
|
168
|
-
|
169
|
-
|
276
|
+
h6,
|
277
|
+
hr,
|
278
|
+
figure,
|
279
|
+
p,
|
280
|
+
pre {
|
281
|
+
margin: 0;
|
170
282
|
}
|
171
283
|
|
172
|
-
|
173
|
-
|
174
|
-
|
175
|
-
|
284
|
+
fieldset {
|
285
|
+
margin: 0;
|
286
|
+
padding: 0;
|
287
|
+
}
|
176
288
|
|
177
|
-
|
178
|
-
|
179
|
-
text-decoration: inherit;
|
289
|
+
legend {
|
290
|
+
padding: 0;
|
180
291
|
}
|
181
292
|
|
182
|
-
|
183
|
-
|
184
|
-
|
185
|
-
|
186
|
-
|
187
|
-
|
188
|
-
|
293
|
+
ol,
|
294
|
+
ul,
|
295
|
+
menu {
|
296
|
+
list-style: none;
|
297
|
+
margin: 0;
|
298
|
+
padding: 0;
|
299
|
+
}
|
300
|
+
|
301
|
+
/*
|
302
|
+
Prevent resizing textareas horizontally by default.
|
303
|
+
*/
|
189
304
|
|
190
|
-
button,
|
191
|
-
input,
|
192
|
-
optgroup,
|
193
|
-
select,
|
194
305
|
textarea {
|
195
|
-
|
196
|
-
line-height: inherit;
|
197
|
-
color: inherit;
|
306
|
+
resize: vertical;
|
198
307
|
}
|
199
308
|
|
200
|
-
|
201
|
-
|
202
|
-
|
203
|
-
|
204
|
-
* 'mono' font family.
|
205
|
-
*/
|
309
|
+
/*
|
310
|
+
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
|
311
|
+
2. Set the default placeholder color to the user's configured gray 400 color.
|
312
|
+
*/
|
206
313
|
|
207
|
-
|
208
|
-
|
209
|
-
|
210
|
-
|
211
|
-
font-family: $font-mono;
|
314
|
+
input::placeholder,
|
315
|
+
textarea::placeholder {
|
316
|
+
opacity: 1; /* 1 */
|
317
|
+
color: $gray-400; /* 2 */
|
212
318
|
}
|
213
319
|
|
214
|
-
|
215
|
-
|
216
|
-
|
217
|
-
|
218
|
-
|
219
|
-
|
220
|
-
|
221
|
-
|
222
|
-
|
223
|
-
|
224
|
-
|
225
|
-
|
226
|
-
|
227
|
-
|
228
|
-
|
229
|
-
|
320
|
+
/*
|
321
|
+
Set the default cursor for buttons.
|
322
|
+
*/
|
323
|
+
|
324
|
+
button,
|
325
|
+
[role="button"] {
|
326
|
+
cursor: pointer;
|
327
|
+
}
|
328
|
+
|
329
|
+
/*
|
330
|
+
Make sure disabled buttons don't get the pointer cursor.
|
331
|
+
*/
|
332
|
+
:disabled {
|
333
|
+
cursor: default;
|
334
|
+
}
|
335
|
+
|
336
|
+
/*
|
337
|
+
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
|
338
|
+
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
|
339
|
+
This can trigger a poorly considered lint error in some tools but is included by design.
|
340
|
+
*/
|
230
341
|
|
231
342
|
img,
|
232
343
|
svg,
|
@@ -240,12 +351,9 @@ object {
|
|
240
351
|
vertical-align: middle; /* 2 */
|
241
352
|
}
|
242
353
|
|
243
|
-
|
244
|
-
|
245
|
-
|
246
|
-
*
|
247
|
-
* https://github.com/mozdevs/cssremedy/issues/14
|
248
|
-
*/
|
354
|
+
/*
|
355
|
+
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
|
356
|
+
*/
|
249
357
|
|
250
358
|
img,
|
251
359
|
video {
|
@@ -253,9 +361,9 @@ video {
|
|
253
361
|
height: auto;
|
254
362
|
}
|
255
363
|
|
256
|
-
|
257
|
-
|
258
|
-
|
364
|
+
/*
|
365
|
+
Ensure the default browser behavior of the `hidden` attribute.
|
366
|
+
*/
|
259
367
|
|
260
368
|
[hidden] {
|
261
369
|
display: none;
|
@@ -1,2 +1 @@
|
|
1
|
-
@import "base/
|
2
|
-
@import "base/preflight";
|
1
|
+
@import "./base/preflight";
|
@@ -1,10 +1,10 @@
|
|
1
|
-
@import "
|
2
|
-
@import "
|
1
|
+
@import "./variables";
|
2
|
+
@import "./mixins";
|
3
3
|
|
4
4
|
$font-family: $font-sans;
|
5
5
|
|
6
|
-
$radius-
|
7
|
-
$radius-
|
6
|
+
$radius-primary: $rounded;
|
7
|
+
$radius-secondary: $rounded;
|
8
8
|
|
9
9
|
:root {
|
10
10
|
--color-bg--main: #{$white};
|
@@ -32,7 +32,7 @@ html {
|
|
32
32
|
}
|
33
33
|
|
34
34
|
.btn {
|
35
|
-
border-radius: $radius-
|
35
|
+
border-radius: $radius-primary;
|
36
36
|
border-width: $border;
|
37
37
|
display: inline-block;
|
38
38
|
font-weight: $font-bold;
|
@@ -59,7 +59,7 @@ html {
|
|
59
59
|
font-size: $text-sm;
|
60
60
|
}
|
61
61
|
|
62
|
-
&
|
62
|
+
&__icon {
|
63
63
|
vertical-align: sub;
|
64
64
|
font-size: 1.25em;
|
65
65
|
}
|
@@ -74,7 +74,7 @@ html {
|
|
74
74
|
@include appearance-none;
|
75
75
|
resize: none;
|
76
76
|
background-color: var(--color-bg--main);
|
77
|
-
border-radius: $radius-
|
77
|
+
border-radius: $radius-secondary;
|
78
78
|
border-width: $border;
|
79
79
|
padding: $size-2 $size-3;
|
80
80
|
width: $w-full;
|
@@ -94,6 +94,15 @@ html {
|
|
94
94
|
}
|
95
95
|
}
|
96
96
|
|
97
|
+
.popup-menu {
|
98
|
+
background-color: var(--color-bg--surface);
|
99
|
+
border-radius: $radius-secondary;
|
100
|
+
padding: $size-2 $size-3;
|
101
|
+
box-shadow: $shadow-md;
|
102
|
+
position: absolute;
|
103
|
+
z-index: $z-10;
|
104
|
+
}
|
105
|
+
|
97
106
|
input[type="checkbox"], input[type="radio"] {
|
98
107
|
transform: scale(1.2, 1.2);
|
99
108
|
margin: $size-1;
|
@@ -176,15 +185,15 @@ fieldset, .input {
|
|
176
185
|
margin-bottom: $size-6;
|
177
186
|
}
|
178
187
|
|
179
|
-
table, progress,
|
188
|
+
table, progress, blockquote, figure, pre, menu, ul, ol, dl, p {
|
180
189
|
margin-bottom: $size-6;
|
181
190
|
}
|
182
191
|
|
183
192
|
dialog {
|
184
193
|
background-color: var(--color-bg--surface);
|
185
|
-
border-radius: $radius-
|
194
|
+
border-radius: $radius-primary;
|
186
195
|
padding: $size-3 $size-4;
|
187
|
-
box-shadow: $shadow-
|
196
|
+
box-shadow: $shadow-lg;
|
188
197
|
color: inherit;
|
189
198
|
}
|
190
199
|
|
@@ -201,15 +210,15 @@ progress {
|
|
201
210
|
}
|
202
211
|
|
203
212
|
details {
|
204
|
-
|
205
|
-
border-left-width: $border-4;
|
206
|
-
padding: $size-2 $size-3;
|
213
|
+
position: relative;
|
207
214
|
}
|
208
215
|
|
209
216
|
summary {
|
210
|
-
|
211
|
-
|
212
|
-
|
217
|
+
list-style: none;
|
218
|
+
}
|
219
|
+
|
220
|
+
summary::-webkit-details-marker {
|
221
|
+
display: none;
|
213
222
|
}
|
214
223
|
|
215
224
|
table, progress {
|
@@ -1,7 +1,7 @@
|
|
1
|
-
@import "
|
2
|
-
@import "
|
3
|
-
@import "
|
4
|
-
@import "
|
1
|
+
@import "./variables/border";
|
2
|
+
@import "./variables/effects";
|
3
|
+
@import "./variables/spacing";
|
4
|
+
@import "./variables/zindex";
|
5
5
|
|
6
6
|
@mixin antialiased {
|
7
7
|
-webkit-font-smoothing: antialiased;
|
@@ -1,6 +1,6 @@
|
|
1
|
-
@import "
|
2
|
-
@import "
|
3
|
-
@import "
|
1
|
+
@import "../variables/typography";
|
2
|
+
@import "../variables/spacing";
|
3
|
+
@import "../mixins";
|
4
4
|
|
5
5
|
.txt--normal {
|
6
6
|
font-weight: $font-normal !important;
|
@@ -1,12 +1,12 @@
|
|
1
|
-
@import "
|
2
|
-
@import "
|
3
|
-
@import "
|
4
|
-
@import "
|
5
|
-
@import "
|
6
|
-
@import "
|
7
|
-
@import "
|
8
|
-
@import "
|
9
|
-
@import "
|
10
|
-
@import "
|
11
|
-
@import "
|
12
|
-
@import "
|
1
|
+
@import "./utilities/align";
|
2
|
+
@import "./utilities/animation";
|
3
|
+
@import "./utilities/container";
|
4
|
+
@import "./utilities/flex";
|
5
|
+
@import "./utilities/flush";
|
6
|
+
@import "./utilities/layout";
|
7
|
+
@import "./utilities/position";
|
8
|
+
@import "./utilities/pull";
|
9
|
+
@import "./utilities/push";
|
10
|
+
@import "./utilities/text";
|
11
|
+
@import "./utilities/list";
|
12
|
+
@import "./utilities/unpad";
|
@@ -1,14 +1,14 @@
|
|
1
|
-
@import "variables/border";
|
2
|
-
@import "variables/breakpoints";
|
3
|
-
@import "variables/colors";
|
4
|
-
@import "variables/effects";
|
5
|
-
@import "variables/filters";
|
6
|
-
@import "variables/flex";
|
7
|
-
@import "variables/grid";
|
8
|
-
@import "variables/spacing";
|
9
|
-
@import "variables/transition";
|
10
|
-
@import "variables/transform";
|
11
|
-
@import "variables/typography";
|
12
|
-
@import "variables/width";
|
13
|
-
@import "variables/height";
|
14
|
-
@import "variables/zindex";
|
1
|
+
@import "./variables/border";
|
2
|
+
@import "./variables/breakpoints";
|
3
|
+
@import "./variables/colors";
|
4
|
+
@import "./variables/effects";
|
5
|
+
@import "./variables/filters";
|
6
|
+
@import "./variables/flex";
|
7
|
+
@import "./variables/grid";
|
8
|
+
@import "./variables/spacing";
|
9
|
+
@import "./variables/transition";
|
10
|
+
@import "./variables/transform";
|
11
|
+
@import "./variables/typography";
|
12
|
+
@import "./variables/width";
|
13
|
+
@import "./variables/height";
|
14
|
+
@import "./variables/zindex";
|
data/lib/sass/zero/version.rb
CHANGED
data/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "sass-zero",
|
3
|
-
"version": "1.0.
|
3
|
+
"version": "1.0.14",
|
4
4
|
"description": "A CSS framework for rapid UI development based on tailwindcss, miligram and BEM.",
|
5
5
|
"homepage": "https://github.com/lazaronixon/sass-zero",
|
6
6
|
"repository": "lazaronixon/sass-zero",
|
metadata
CHANGED
@@ -1,14 +1,14 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: sass-zero
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 1.0.
|
4
|
+
version: 1.0.14
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- lazaronixon
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2022-02-
|
11
|
+
date: 2022-02-10 00:00:00.000000000 Z
|
12
12
|
dependencies: []
|
13
13
|
description:
|
14
14
|
email:
|
@@ -23,7 +23,6 @@ files:
|
|
23
23
|
- Gemfile
|
24
24
|
- README.md
|
25
25
|
- app/assets/stylesheets/sass-zero/base.scss
|
26
|
-
- app/assets/stylesheets/sass-zero/base/normalize.css
|
27
26
|
- app/assets/stylesheets/sass-zero/base/preflight.scss
|
28
27
|
- app/assets/stylesheets/sass-zero/breadboard.scss
|
29
28
|
- app/assets/stylesheets/sass-zero/mixins.scss
|
@@ -1,285 +0,0 @@
|
|
1
|
-
/*! modern-normalize v1.1.0 | MIT License | https://github.com/sindresorhus/modern-normalize */
|
2
|
-
|
3
|
-
/*
|
4
|
-
Document
|
5
|
-
========
|
6
|
-
*/
|
7
|
-
|
8
|
-
/**
|
9
|
-
Use a better box model (opinionated).
|
10
|
-
*/
|
11
|
-
|
12
|
-
*,
|
13
|
-
::before,
|
14
|
-
::after {
|
15
|
-
box-sizing: border-box;
|
16
|
-
}
|
17
|
-
|
18
|
-
/**
|
19
|
-
1. Correct the line height in all browsers.
|
20
|
-
2. Prevent adjustments of font size after orientation changes in iOS.
|
21
|
-
3. Use a more readable tab size (opinionated).
|
22
|
-
*/
|
23
|
-
|
24
|
-
html {
|
25
|
-
line-height: 1.15; /* 1 */
|
26
|
-
-webkit-text-size-adjust: 100%; /* 2 */
|
27
|
-
-moz-tab-size: 4; /* 3 */
|
28
|
-
tab-size: 4; /* 3 */
|
29
|
-
}
|
30
|
-
|
31
|
-
/*
|
32
|
-
Sections
|
33
|
-
========
|
34
|
-
*/
|
35
|
-
|
36
|
-
/**
|
37
|
-
1. Remove the margin in all browsers.
|
38
|
-
2. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
|
39
|
-
*/
|
40
|
-
|
41
|
-
body {
|
42
|
-
margin: 0; /* 1 */
|
43
|
-
font-family:
|
44
|
-
system-ui,
|
45
|
-
-apple-system, /* Firefox supports this but not yet `system-ui` */
|
46
|
-
'Segoe UI',
|
47
|
-
Roboto,
|
48
|
-
Helvetica,
|
49
|
-
Arial,
|
50
|
-
sans-serif,
|
51
|
-
'Apple Color Emoji',
|
52
|
-
'Segoe UI Emoji'; /* 2 */
|
53
|
-
}
|
54
|
-
|
55
|
-
/*
|
56
|
-
Grouping content
|
57
|
-
================
|
58
|
-
*/
|
59
|
-
|
60
|
-
/**
|
61
|
-
1. Add the correct height in Firefox.
|
62
|
-
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
|
63
|
-
*/
|
64
|
-
|
65
|
-
hr {
|
66
|
-
height: 0; /* 1 */
|
67
|
-
color: inherit; /* 2 */
|
68
|
-
}
|
69
|
-
|
70
|
-
/*
|
71
|
-
Text-level semantics
|
72
|
-
====================
|
73
|
-
*/
|
74
|
-
|
75
|
-
/**
|
76
|
-
Add the correct text decoration in Chrome, Edge, and Safari.
|
77
|
-
*/
|
78
|
-
|
79
|
-
abbr[title] {
|
80
|
-
text-decoration: underline dotted;
|
81
|
-
}
|
82
|
-
|
83
|
-
/**
|
84
|
-
Add the correct font weight in Edge and Safari.
|
85
|
-
*/
|
86
|
-
|
87
|
-
b,
|
88
|
-
strong {
|
89
|
-
font-weight: bolder;
|
90
|
-
}
|
91
|
-
|
92
|
-
/**
|
93
|
-
1. Improve consistency of default fonts in all browsers. (https://github.com/sindresorhus/modern-normalize/issues/3)
|
94
|
-
2. Correct the odd 'em' font sizing in all browsers.
|
95
|
-
*/
|
96
|
-
|
97
|
-
code,
|
98
|
-
kbd,
|
99
|
-
samp,
|
100
|
-
pre {
|
101
|
-
font-family:
|
102
|
-
ui-monospace,
|
103
|
-
SFMono-Regular,
|
104
|
-
Consolas,
|
105
|
-
'Liberation Mono',
|
106
|
-
Menlo,
|
107
|
-
monospace; /* 1 */
|
108
|
-
font-size: 1em; /* 2 */
|
109
|
-
}
|
110
|
-
|
111
|
-
/**
|
112
|
-
Add the correct font size in all browsers.
|
113
|
-
*/
|
114
|
-
|
115
|
-
small {
|
116
|
-
font-size: 80%;
|
117
|
-
}
|
118
|
-
|
119
|
-
/**
|
120
|
-
Prevent 'sub' and 'sup' elements from affecting the line height in all browsers.
|
121
|
-
*/
|
122
|
-
|
123
|
-
sub,
|
124
|
-
sup {
|
125
|
-
font-size: 75%;
|
126
|
-
line-height: 0;
|
127
|
-
position: relative;
|
128
|
-
vertical-align: baseline;
|
129
|
-
}
|
130
|
-
|
131
|
-
sub {
|
132
|
-
bottom: -0.25em;
|
133
|
-
}
|
134
|
-
|
135
|
-
sup {
|
136
|
-
top: -0.5em;
|
137
|
-
}
|
138
|
-
|
139
|
-
/*
|
140
|
-
Tabular data
|
141
|
-
============
|
142
|
-
*/
|
143
|
-
|
144
|
-
/**
|
145
|
-
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)
|
146
|
-
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)
|
147
|
-
*/
|
148
|
-
|
149
|
-
table {
|
150
|
-
text-indent: 0; /* 1 */
|
151
|
-
border-color: inherit; /* 2 */
|
152
|
-
}
|
153
|
-
|
154
|
-
/*
|
155
|
-
Forms
|
156
|
-
=====
|
157
|
-
*/
|
158
|
-
|
159
|
-
/**
|
160
|
-
1. Change the font styles in all browsers.
|
161
|
-
2. Remove the margin in Firefox and Safari.
|
162
|
-
*/
|
163
|
-
|
164
|
-
button,
|
165
|
-
input,
|
166
|
-
optgroup,
|
167
|
-
select,
|
168
|
-
textarea {
|
169
|
-
font-family: inherit; /* 1 */
|
170
|
-
font-size: 100%; /* 1 */
|
171
|
-
line-height: 1.15; /* 1 */
|
172
|
-
margin: 0; /* 2 */
|
173
|
-
}
|
174
|
-
|
175
|
-
/**
|
176
|
-
Remove the inheritance of text transform in Edge and Firefox.
|
177
|
-
*/
|
178
|
-
|
179
|
-
button,
|
180
|
-
select {
|
181
|
-
text-transform: none;
|
182
|
-
}
|
183
|
-
|
184
|
-
/**
|
185
|
-
Correct the inability to style clickable types in iOS and Safari.
|
186
|
-
*/
|
187
|
-
|
188
|
-
button,
|
189
|
-
[type='button'],
|
190
|
-
[type='reset'],
|
191
|
-
[type='submit'] {
|
192
|
-
-webkit-appearance: button;
|
193
|
-
}
|
194
|
-
|
195
|
-
/**
|
196
|
-
Remove the inner border and padding in Firefox.
|
197
|
-
*/
|
198
|
-
|
199
|
-
::-moz-focus-inner {
|
200
|
-
border-style: none;
|
201
|
-
padding: 0;
|
202
|
-
}
|
203
|
-
|
204
|
-
/**
|
205
|
-
Restore the focus styles unset by the previous rule.
|
206
|
-
*/
|
207
|
-
|
208
|
-
:-moz-focusring {
|
209
|
-
outline: 1px dotted ButtonText;
|
210
|
-
}
|
211
|
-
|
212
|
-
/**
|
213
|
-
Remove the additional ':invalid' styles in Firefox.
|
214
|
-
See: https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737
|
215
|
-
*/
|
216
|
-
|
217
|
-
:-moz-ui-invalid {
|
218
|
-
box-shadow: none;
|
219
|
-
}
|
220
|
-
|
221
|
-
/**
|
222
|
-
Remove the padding so developers are not caught out when they zero out 'fieldset' elements in all browsers.
|
223
|
-
*/
|
224
|
-
|
225
|
-
legend {
|
226
|
-
padding: 0;
|
227
|
-
}
|
228
|
-
|
229
|
-
/**
|
230
|
-
Add the correct vertical alignment in Chrome and Firefox.
|
231
|
-
*/
|
232
|
-
|
233
|
-
progress {
|
234
|
-
vertical-align: baseline;
|
235
|
-
}
|
236
|
-
|
237
|
-
/**
|
238
|
-
Correct the cursor style of increment and decrement buttons in Safari.
|
239
|
-
*/
|
240
|
-
|
241
|
-
::-webkit-inner-spin-button,
|
242
|
-
::-webkit-outer-spin-button {
|
243
|
-
height: auto;
|
244
|
-
}
|
245
|
-
|
246
|
-
/**
|
247
|
-
1. Correct the odd appearance in Chrome and Safari.
|
248
|
-
2. Correct the outline style in Safari.
|
249
|
-
*/
|
250
|
-
|
251
|
-
[type='search'] {
|
252
|
-
-webkit-appearance: textfield; /* 1 */
|
253
|
-
outline-offset: -2px; /* 2 */
|
254
|
-
}
|
255
|
-
|
256
|
-
/**
|
257
|
-
Remove the inner padding in Chrome and Safari on macOS.
|
258
|
-
*/
|
259
|
-
|
260
|
-
::-webkit-search-decoration {
|
261
|
-
-webkit-appearance: none;
|
262
|
-
}
|
263
|
-
|
264
|
-
/**
|
265
|
-
1. Correct the inability to style clickable types in iOS and Safari.
|
266
|
-
2. Change font properties to 'inherit' in Safari.
|
267
|
-
*/
|
268
|
-
|
269
|
-
::-webkit-file-upload-button {
|
270
|
-
-webkit-appearance: button; /* 1 */
|
271
|
-
font: inherit; /* 2 */
|
272
|
-
}
|
273
|
-
|
274
|
-
/*
|
275
|
-
Interactive
|
276
|
-
===========
|
277
|
-
*/
|
278
|
-
|
279
|
-
/*
|
280
|
-
Add the correct display in Chrome and Safari.
|
281
|
-
*/
|
282
|
-
|
283
|
-
summary {
|
284
|
-
display: list-item;
|
285
|
-
}
|