sass-zero 0.0.45 → 0.0.46
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 +1 -1
- data/app/assets/stylesheets/sass-zero/breadboard.scss +56 -58
- data/app/assets/stylesheets/sass-zero/utilities.scss +0 -7
- data/app/assets/stylesheets/sass-zero/utilities/text.scss +0 -33
- data/lib/sass/zero/version.rb +1 -1
- data/package.json +1 -1
- metadata +6 -6
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: a70d79a12adc6f8ce1f1e8cb6010376853a05f3811220d802bdba66807af5f73
|
|
4
|
+
data.tar.gz: 468f771702b25513dd37bfb8fc80e3ebbc61816db3680b3bc3839976676eaafb
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: d1b54a51fe3aff5ca9203f97ac299afbef75c7fc823d6809ef33c8157856d253126d215bf635eb34ffd53e70387b682cc4b4f9db942ca7a21d8450302127d199
|
|
7
|
+
data.tar.gz: dc64fedbee094996ad563e765e3edbd70e53a659d653437e26baea00abe691b925e564929c1932c22e0d3411d0e7855b5e6806103a13b302eb4213b592a490e7
|
data/Example.html
CHANGED
|
@@ -6,29 +6,25 @@ $font-family: $font-sans;
|
|
|
6
6
|
$radius-input: $rounded;
|
|
7
7
|
$radius-button: $rounded;
|
|
8
8
|
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
9
|
+
:root {
|
|
10
|
+
--color-bg--main: #{$white};
|
|
11
|
+
--color-bg--surface: #{$gray-100};
|
|
12
|
+
--color-primary: #{$gray-900};
|
|
13
|
+
--color-txt: #{$gray-900};
|
|
14
|
+
--color-focus-ring: #{rgba($gray-900, $opacity-50)};
|
|
14
15
|
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
16
|
+
--image-bg-select: url('data:image/svg+xml,<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg"><path stroke="black" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="M6 8l4 4 4-4"/></svg>');
|
|
17
|
+
--image-checked-checkbox: url('data:image/svg+xml,<svg viewBox="0 0 16 16" fill="white" xmlns="http://www.w3.org/2000/svg"><path d="M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z"/></svg>');
|
|
18
|
+
--image-checked-radio: url('data:image/svg+xml,<svg viewBox="0 0 16 16" fill="white" xmlns="http://www.w3.org/2000/svg"><circle cx="8" cy="8" r="3"/></svg>');
|
|
19
|
+
}
|
|
18
20
|
|
|
19
21
|
html {
|
|
20
|
-
background:
|
|
21
|
-
color:
|
|
22
|
+
background: var(--color-bg--main);
|
|
23
|
+
color: var(--color-txt);
|
|
22
24
|
font-family: $font-family;
|
|
23
25
|
font-size: 16px;
|
|
24
26
|
}
|
|
25
27
|
|
|
26
|
-
blockquote {
|
|
27
|
-
border-color: $color-primary;
|
|
28
|
-
border-left-width: $border-4;
|
|
29
|
-
padding: $size-3 $size-4;
|
|
30
|
-
}
|
|
31
|
-
|
|
32
28
|
.btn {
|
|
33
29
|
border-radius: $radius-button;
|
|
34
30
|
border-width: $border;
|
|
@@ -38,7 +34,7 @@ blockquote {
|
|
|
38
34
|
cursor: pointer;
|
|
39
35
|
|
|
40
36
|
&:focus {
|
|
41
|
-
outline: 2px dotted
|
|
37
|
+
outline: 2px dotted var(--color-primary);
|
|
42
38
|
outline-offset: 2px;
|
|
43
39
|
}
|
|
44
40
|
|
|
@@ -48,14 +44,14 @@ blockquote {
|
|
|
48
44
|
}
|
|
49
45
|
|
|
50
46
|
&--primary {
|
|
51
|
-
background-color:
|
|
52
|
-
border-color:
|
|
53
|
-
color:
|
|
47
|
+
background-color: var(--color-primary);
|
|
48
|
+
border-color: var(--color-primary);
|
|
49
|
+
color: var(--color-bg--main);
|
|
54
50
|
}
|
|
55
51
|
|
|
56
52
|
&--secondary {
|
|
57
|
-
background-color:
|
|
58
|
-
border-color:
|
|
53
|
+
background-color: var(--color-bg--main);
|
|
54
|
+
border-color: var(--color-primary);
|
|
59
55
|
}
|
|
60
56
|
|
|
61
57
|
&--tertiary {
|
|
@@ -64,33 +60,6 @@ blockquote {
|
|
|
64
60
|
}
|
|
65
61
|
}
|
|
66
62
|
|
|
67
|
-
code {
|
|
68
|
-
background-color: $color-bg--surface;
|
|
69
|
-
border-radius: $rounded-xl;
|
|
70
|
-
font-size: $text-sm;
|
|
71
|
-
margin: $size-0 $size-1;
|
|
72
|
-
padding: $size-1 $size-2;
|
|
73
|
-
white-space: nowrap;
|
|
74
|
-
}
|
|
75
|
-
|
|
76
|
-
pre {
|
|
77
|
-
background-color: $color-bg--surface;
|
|
78
|
-
border-color: $color-primary;
|
|
79
|
-
border-left-width: $border-4;
|
|
80
|
-
overflow-y: hidden;
|
|
81
|
-
|
|
82
|
-
& > code {
|
|
83
|
-
border-radius: $rounded-none;
|
|
84
|
-
display: block;
|
|
85
|
-
padding: $size-2 $size-3;
|
|
86
|
-
white-space: pre;
|
|
87
|
-
}
|
|
88
|
-
}
|
|
89
|
-
|
|
90
|
-
hr {
|
|
91
|
-
margin: $size-6 $size-0;
|
|
92
|
-
}
|
|
93
|
-
|
|
94
63
|
.input {
|
|
95
64
|
appearance: none;
|
|
96
65
|
background-color: $transparent;
|
|
@@ -100,7 +69,7 @@ hr {
|
|
|
100
69
|
width: $size-full;
|
|
101
70
|
|
|
102
71
|
&--select {
|
|
103
|
-
background-image:
|
|
72
|
+
background-image: var(--image-bg-select);
|
|
104
73
|
background-position: right $size-2 center;
|
|
105
74
|
background-repeat: no-repeat;
|
|
106
75
|
background-size: auto $size-5;
|
|
@@ -108,41 +77,70 @@ hr {
|
|
|
108
77
|
}
|
|
109
78
|
|
|
110
79
|
&:focus {
|
|
111
|
-
box-shadow: ring($color:
|
|
80
|
+
box-shadow: ring($color: var(--color-focus-ring));
|
|
112
81
|
@include outline-none;
|
|
113
82
|
}
|
|
114
83
|
}
|
|
115
84
|
|
|
116
85
|
.checkbox {
|
|
117
86
|
border-radius: $rounded;
|
|
118
|
-
@include input-selection(
|
|
87
|
+
@include input-selection(var(--color-primary));
|
|
119
88
|
|
|
120
89
|
&:checked {
|
|
121
|
-
background-image:
|
|
90
|
+
background-image: var(--image-checked-checkbox);
|
|
122
91
|
@include checked;
|
|
123
92
|
}
|
|
124
93
|
|
|
125
94
|
&:focus {
|
|
126
|
-
box-shadow: ring($color:
|
|
95
|
+
box-shadow: ring($color: var(--color-focus-ring));
|
|
127
96
|
@include outline-none;
|
|
128
97
|
}
|
|
129
98
|
}
|
|
130
99
|
|
|
131
100
|
.radio {
|
|
132
101
|
border-radius: $rounded-full;
|
|
133
|
-
@include input-selection(
|
|
102
|
+
@include input-selection(var(--color-primary));
|
|
134
103
|
|
|
135
104
|
&:checked {
|
|
136
|
-
background-image:
|
|
105
|
+
background-image: var(--image-checked-radio);
|
|
137
106
|
@include checked;
|
|
138
107
|
}
|
|
139
108
|
|
|
140
109
|
&:focus {
|
|
141
|
-
box-shadow: ring($color:
|
|
110
|
+
box-shadow: ring($color: var(--color-focus-ring));
|
|
142
111
|
@include outline-none;
|
|
143
112
|
}
|
|
144
113
|
}
|
|
145
114
|
|
|
115
|
+
blockquote {
|
|
116
|
+
border-left-width: $border-4;
|
|
117
|
+
padding: $size-3 $size-4;
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
code {
|
|
121
|
+
background-color: var(--color-bg--surface);
|
|
122
|
+
border-radius: $rounded;
|
|
123
|
+
font-size: $text-sm;
|
|
124
|
+
margin: $size-0 $size-1;
|
|
125
|
+
padding: $size-1 $size-2;
|
|
126
|
+
white-space: nowrap;
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
pre {
|
|
130
|
+
background-color: var(--color-bg--surface);
|
|
131
|
+
overflow-y: hidden;
|
|
132
|
+
|
|
133
|
+
& > code {
|
|
134
|
+
display: block;
|
|
135
|
+
padding: $size-2 $size-3;
|
|
136
|
+
white-space: pre;
|
|
137
|
+
}
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
hr {
|
|
141
|
+
margin: $size-6 $size-0;
|
|
142
|
+
}
|
|
143
|
+
|
|
146
144
|
a {
|
|
147
145
|
font-weight: $font-bold;
|
|
148
146
|
}
|
|
@@ -182,7 +180,7 @@ table {
|
|
|
182
180
|
td, th {
|
|
183
181
|
border-bottom-width: $border;
|
|
184
182
|
padding: $size-3 $size-4;
|
|
185
|
-
text-align:
|
|
183
|
+
text-align: inherit;
|
|
186
184
|
}
|
|
187
185
|
|
|
188
186
|
h1, h2, h3, h4, h5, h6, .hdg {
|
|
@@ -1,10 +1,3 @@
|
|
|
1
|
-
$color-txt: #18181b;
|
|
2
|
-
$color-txt--subtle: #3f3f46;
|
|
3
|
-
$color-txt--subtle-reversed: #fff;
|
|
4
|
-
$color-txt--decorated: #3b82f6;
|
|
5
|
-
|
|
6
|
-
$color-bg--highlight: #f4f4f5;
|
|
7
|
-
|
|
8
1
|
@import "sass-zero/utilities/align";
|
|
9
2
|
@import "sass-zero/utilities/animation";
|
|
10
3
|
@import "sass-zero/utilities/container";
|
|
@@ -18,23 +18,6 @@
|
|
|
18
18
|
text-transform: uppercase;
|
|
19
19
|
}
|
|
20
20
|
|
|
21
|
-
.txt--subtle {
|
|
22
|
-
color: $color-txt--subtle;
|
|
23
|
-
}
|
|
24
|
-
|
|
25
|
-
.txt--subtle-reversed {
|
|
26
|
-
color: $color-txt--subtle-reversed;
|
|
27
|
-
}
|
|
28
|
-
|
|
29
|
-
.txt--full-contrast {
|
|
30
|
-
color: $color-txt;
|
|
31
|
-
}
|
|
32
|
-
|
|
33
|
-
.txt--meta {
|
|
34
|
-
font-size: $text-sm;
|
|
35
|
-
color: $color-txt--subtle;
|
|
36
|
-
}
|
|
37
|
-
|
|
38
21
|
.txt--nowrap {
|
|
39
22
|
white-space: nowrap;
|
|
40
23
|
}
|
|
@@ -63,12 +46,6 @@
|
|
|
63
46
|
opacity: $opacity-50;
|
|
64
47
|
}
|
|
65
48
|
|
|
66
|
-
.txt--highlight {
|
|
67
|
-
background-color: $color-bg--highlight;
|
|
68
|
-
border-radius: $rounded-full;
|
|
69
|
-
padding: $size-0 $size-1;
|
|
70
|
-
}
|
|
71
|
-
|
|
72
49
|
.txt--overflow-hidden {
|
|
73
50
|
overflow: hidden;
|
|
74
51
|
}
|
|
@@ -138,16 +115,6 @@
|
|
|
138
115
|
line-height: $leading-none;
|
|
139
116
|
}
|
|
140
117
|
|
|
141
|
-
.decorated {
|
|
142
|
-
color: $color-txt--decorated;
|
|
143
|
-
text-decoration: underline;
|
|
144
|
-
}
|
|
145
|
-
|
|
146
|
-
.decorated--subtle {
|
|
147
|
-
color: $color-txt--subtle;
|
|
148
|
-
text-decoration: underline;
|
|
149
|
-
}
|
|
150
|
-
|
|
151
118
|
.undecorated {
|
|
152
119
|
color: inherit;
|
|
153
120
|
text-decoration: none;
|
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.46",
|
|
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.46
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- lazaronixon
|
|
8
|
-
autorequire:
|
|
8
|
+
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2020-12-
|
|
11
|
+
date: 2020-12-19 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: autoprefixer-rails
|
|
@@ -24,7 +24,7 @@ dependencies:
|
|
|
24
24
|
- - ">="
|
|
25
25
|
- !ruby/object:Gem::Version
|
|
26
26
|
version: 9.7.4
|
|
27
|
-
description:
|
|
27
|
+
description:
|
|
28
28
|
email:
|
|
29
29
|
- lazaronixon@hotmail.com
|
|
30
30
|
executables: []
|
|
@@ -75,7 +75,7 @@ homepage: http://github.com/lazaronixon/sass-zero
|
|
|
75
75
|
licenses:
|
|
76
76
|
- MIT
|
|
77
77
|
metadata: {}
|
|
78
|
-
post_install_message:
|
|
78
|
+
post_install_message:
|
|
79
79
|
rdoc_options: []
|
|
80
80
|
require_paths:
|
|
81
81
|
- lib
|
|
@@ -91,7 +91,7 @@ required_rubygems_version: !ruby/object:Gem::Requirement
|
|
|
91
91
|
version: '0'
|
|
92
92
|
requirements: []
|
|
93
93
|
rubygems_version: 3.1.4
|
|
94
|
-
signing_key:
|
|
94
|
+
signing_key:
|
|
95
95
|
specification_version: 4
|
|
96
96
|
summary: A CSS framework for rapid UI development based on tailwindcss, miligram and
|
|
97
97
|
BEM.
|