sass-zero 1.0.10 → 1.0.14
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.
- 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
|
-

|
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
|
-
}
|