sass-zero 0.0.31 → 0.0.32
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 +8 -3
- data/app/assets/stylesheets/sass-zero/base/breadboard.scss +6 -50
- data/app/assets/stylesheets/sass-zero/mixins.scss +8 -0
- data/app/assets/stylesheets/sass-zero/utilities/layout.scss +5 -1
- data/app/assets/stylesheets/sass-zero/utilities/list.scss +6 -0
- data/app/assets/stylesheets/sass-zero/utilities/text.scss +7 -19
- data/lib/sass/zero/version.rb +1 -1
- data/package.json +1 -1
- metadata +2 -2
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 8a938a8984b061ac6f78e52e4fa3f89bda2b3786f2e45dc11eb79d6d12f9337c
|
4
|
+
data.tar.gz: 4517f9c31478d0eb64520cd26196a4f7bde9ac42f0ba9208dfecabe08d725b97
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: bdca8b227b9bf6cccc345decd7814a829560d5b2429da1c4e6aaa537440c90e65d2368c89f60c0910ff2bc25bed51817171a1631887edce9bf52ca7e29158c1f
|
7
|
+
data.tar.gz: 9bdacc79bf814a124784e011935932eec5762751d62f137782aa6791b1460cfc719b46a09f9e8940f5eb863b27142776bdf978a5b88d4425610b7199274d64fd
|
data/Example.html
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
<main>
|
2
2
|
<p>The base type is 1.6rem (16px) over 1.6 line height (24px)</p>
|
3
|
-
<a>Anchor</a>
|
3
|
+
<a href="#">Anchor</a>
|
4
4
|
<em>Emphasis</em>
|
5
5
|
<small>Small</small>
|
6
6
|
<strong>Strong</strong>
|
@@ -11,8 +11,6 @@
|
|
11
11
|
<h4>Heading</h4>
|
12
12
|
<h5>Heading</h5>
|
13
13
|
<h6>Heading</h6>
|
14
|
-
<h6 class="hdg hdg--divider"><span>Divider</span></h6>
|
15
|
-
|
16
14
|
|
17
15
|
<button class="btn btn--primary">Button Primary</button>
|
18
16
|
<button class="btn btn--secondary">Button Secondary</button>
|
@@ -119,8 +117,15 @@
|
|
119
117
|
<li>Unordered list item 1</li>
|
120
118
|
<li>Unordered list item 2</li>
|
121
119
|
</ul>
|
120
|
+
|
122
121
|
<ol>
|
123
122
|
<li>Ordered list item 1</li>
|
124
123
|
<li>Ordered list item 2</li>
|
125
124
|
</ol>
|
125
|
+
|
126
|
+
<dl>
|
127
|
+
<dt class="txt--bold">Description lists</dt>
|
128
|
+
<dd>A description list is perfect for defining terms.</dd>
|
129
|
+
<dd>Vestibulum id ligula porta felis euismod semper eget lacinia odio sem.</dd>
|
130
|
+
</dl>
|
126
131
|
</main>
|
@@ -2,6 +2,7 @@
|
|
2
2
|
@import "sass-zero/mixins";
|
3
3
|
|
4
4
|
html {
|
5
|
+
color: $breadboard-color;
|
5
6
|
font-size: 14px;
|
6
7
|
}
|
7
8
|
|
@@ -35,10 +36,6 @@ blockquote {
|
|
35
36
|
opacity: $opacity-50;
|
36
37
|
}
|
37
38
|
|
38
|
-
&:focus {
|
39
|
-
outline: 0;
|
40
|
-
}
|
41
|
-
|
42
39
|
&--primary {
|
43
40
|
background-color: $breadboard-primary;
|
44
41
|
border-color: $breadboard-primary;
|
@@ -49,13 +46,11 @@ blockquote {
|
|
49
46
|
&--secondary {
|
50
47
|
background-color: $white;
|
51
48
|
border-color: $breadboard-primary;
|
52
|
-
color: $breadboard-primary;
|
53
49
|
}
|
54
50
|
|
55
51
|
&--tertiary {
|
56
52
|
background-color: transparent;
|
57
53
|
border-color: transparent;
|
58
|
-
color: $breadboard-color;
|
59
54
|
}
|
60
55
|
}
|
61
56
|
|
@@ -63,7 +58,7 @@ code {
|
|
63
58
|
background-color: $breadboard-background;
|
64
59
|
border-radius: $rounded;
|
65
60
|
font-size: $text-sm;
|
66
|
-
margin: 0 $size-1;
|
61
|
+
margin: $size-0 $size-1;
|
67
62
|
padding: $size-1 $size-2;
|
68
63
|
white-space: nowrap;
|
69
64
|
}
|
@@ -84,11 +79,9 @@ pre {
|
|
84
79
|
|
85
80
|
hr {
|
86
81
|
margin: $size-10 $size-0;
|
87
|
-
border-bottom-width: $border-2;
|
88
82
|
}
|
89
83
|
|
90
84
|
.input {
|
91
|
-
appearance: none;
|
92
85
|
border-radius: $rounded;
|
93
86
|
border-width: $border;
|
94
87
|
padding: $size-2 $size-3;
|
@@ -101,6 +94,7 @@ hr {
|
|
101
94
|
}
|
102
95
|
|
103
96
|
&--select {
|
97
|
+
appearance: none;
|
104
98
|
background-image: url('data:image/svg+xml,<svg viewBox="0 0 24 24" fill="%23a0aec0" xmlns="http://www.w3.org/2000/svg"><path d="M15.3 9.3a1 1 0 0 1 1.4 1.4l-4 4a1 1 0 0 1-1.4 0l-4-4a1 1 0 0 1 1.4-1.4l3.3 3.29 3.3-3.3z"/></svg>');
|
105
99
|
background-position: right $size-2 center;
|
106
100
|
background-repeat: no-repeat;
|
@@ -110,16 +104,14 @@ hr {
|
|
110
104
|
}
|
111
105
|
|
112
106
|
label, legend {
|
113
|
-
display: block;
|
107
|
+
display: inline-block;
|
114
108
|
margin-bottom: $size-1;
|
115
109
|
}
|
116
110
|
|
117
111
|
.checkbox, .radio {
|
118
112
|
appearance: none;
|
119
|
-
background-origin: border-box;
|
120
113
|
border-width: $border;
|
121
114
|
color: $breadboard-primary;
|
122
|
-
display: inline-block;
|
123
115
|
margin-bottom: -0.2rem;
|
124
116
|
height: $size-4;
|
125
117
|
width: $size-4;
|
@@ -155,9 +147,7 @@ label, legend {
|
|
155
147
|
}
|
156
148
|
|
157
149
|
a {
|
158
|
-
color: $breadboard-primary;
|
159
150
|
font-weight: $font-bold;
|
160
|
-
cursor: pointer;
|
161
151
|
}
|
162
152
|
|
163
153
|
ol {
|
@@ -176,19 +166,11 @@ dd, dt, li, .btn {
|
|
176
166
|
margin-bottom: $size-2;
|
177
167
|
}
|
178
168
|
|
179
|
-
fieldset, .input
|
169
|
+
fieldset, .input {
|
180
170
|
margin-bottom: $size-4;
|
181
171
|
}
|
182
172
|
|
183
|
-
blockquote,
|
184
|
-
dl,
|
185
|
-
figure,
|
186
|
-
form,
|
187
|
-
ol,
|
188
|
-
p,
|
189
|
-
pre,
|
190
|
-
table,
|
191
|
-
ul {
|
173
|
+
blockquote, dl, figure, form, ol, p, pre, table, ul {
|
192
174
|
margin-bottom: $size-6;
|
193
175
|
}
|
194
176
|
|
@@ -196,10 +178,6 @@ table {
|
|
196
178
|
width: $size-full;
|
197
179
|
}
|
198
180
|
|
199
|
-
thead th {
|
200
|
-
border-bottom-width: $border-2;
|
201
|
-
}
|
202
|
-
|
203
181
|
td, th {
|
204
182
|
border-bottom-width: $border;
|
205
183
|
padding: $size-3 $size-4;
|
@@ -235,30 +213,8 @@ h6, .hdg--base {
|
|
235
213
|
font-size: $text-base;
|
236
214
|
}
|
237
215
|
|
238
|
-
.hdg--divider {
|
239
|
-
position: relative;
|
240
|
-
z-index: 0;
|
241
|
-
|
242
|
-
> span {
|
243
|
-
background-color: $breadboard-background;
|
244
|
-
padding-right: $size-2;
|
245
|
-
}
|
246
|
-
|
247
|
-
::before {
|
248
|
-
content: '';
|
249
|
-
position: absolute;
|
250
|
-
top: 50%;
|
251
|
-
left: $size-0;
|
252
|
-
right: $size-0;
|
253
|
-
height: $size-px;
|
254
|
-
background: $breadboard-border;
|
255
|
-
z-index: -1;
|
256
|
-
}
|
257
|
-
}
|
258
|
-
|
259
216
|
@media (min-width: $breakpoint-md) {
|
260
217
|
html {
|
261
|
-
color: $breadboard-color;
|
262
218
|
font-size: 16px;
|
263
219
|
}
|
264
220
|
|
@@ -1,4 +1,4 @@
|
|
1
|
-
@import "sass-zero/variables";
|
1
|
+
@import "sass-zero/variables/breakpoints";
|
2
2
|
@import "sass-zero/mixins";
|
3
3
|
|
4
4
|
.u-full-width {
|
@@ -30,6 +30,10 @@
|
|
30
30
|
margin-left: auto;
|
31
31
|
}
|
32
32
|
|
33
|
+
.u-clearfix {
|
34
|
+
@include clearfix;
|
35
|
+
}
|
36
|
+
|
33
37
|
.u-float-l {
|
34
38
|
float: left;
|
35
39
|
}
|
@@ -1,4 +1,7 @@
|
|
1
|
-
@import "sass-zero/variables";
|
1
|
+
@import "sass-zero/variables/typography";
|
2
|
+
@import "sass-zero/variables/spacing";
|
3
|
+
@import "sass-zero/variables/border";
|
4
|
+
@import "sass-zero/variables/colors";
|
2
5
|
@import "sass-zero/mixins";
|
3
6
|
|
4
7
|
.txt {
|
@@ -47,24 +50,9 @@
|
|
47
50
|
}
|
48
51
|
|
49
52
|
&--highlight {
|
50
|
-
background-color: $gray-
|
51
|
-
|
52
|
-
padding: 0
|
53
|
-
border-radius: 4rem 2rem 4.2rem 1.1rem;
|
54
|
-
box-shadow: 0.2em 0 0 $gray-300, -0.2em 0 0 $gray-300;
|
55
|
-
}
|
56
|
-
|
57
|
-
&--highlight-underline {
|
58
|
-
background-image: url('data:image/svg+xml,<svg viewBox="0 0 284 11" fill="%23e2e8f0" xmlns="http://www.w3.org/2000/svg"><path d="m31.803886 8.47027008c68.843749-9.56054688 255.210937-9.56054693 250.988281-9.56054688-4.222656.00000006-250.9882818 16.4023438-250.9882818 16.4023438s-68.8437485 2.71875.0000008-6.84179692z" fill-rule="evenodd" transform="matrix(.99862953 .05233596 -.05233596 .99862953 .57616 -7.423532)"/></svg>');
|
59
|
-
background-repeat: no-repeat;
|
60
|
-
background-position: center 103%;
|
61
|
-
background-size: 105%
|
62
|
-
}
|
63
|
-
|
64
|
-
&--highlight-bottom {
|
65
|
-
border-bottom: $border solid $gray-300;
|
66
|
-
box-shadow: inset 0 -6px 0 $gray-300;
|
67
|
-
font-style: normal;
|
53
|
+
background-color: $gray-200;
|
54
|
+
border-radius: $rounded;
|
55
|
+
padding: $size-0 $size-1;
|
68
56
|
}
|
69
57
|
|
70
58
|
&--normal {
|
data/lib/sass/zero/version.rb
CHANGED
data/package.json
CHANGED
@@ -1,6 +1,6 @@
|
|
1
1
|
{
|
2
2
|
"name": "sass-zero",
|
3
|
-
"version": "0.0.
|
3
|
+
"version": "0.0.32",
|
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: 0.0.
|
4
|
+
version: 0.0.32
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- lazaronixon
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2020-05-
|
11
|
+
date: 2020-05-09 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: autoprefixer-rails
|