css-zero 0.0.8 → 0.0.10
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/README.md +72 -23
- data/app/assets/stylesheets/buttons.css +37 -20
- data/app/assets/stylesheets/colors.css +18 -17
- data/app/assets/stylesheets/dialog.css +33 -0
- data/app/assets/stylesheets/inputs.css +54 -0
- data/app/assets/stylesheets/zutilities.css +21 -15
- data/lib/css_zero/version.rb +1 -1
- metadata +4 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 1627717e8a9e7cedf50a2bf68f7fff9eb3b9a36991d6b9a68dc54271d6a035a2
|
|
4
|
+
data.tar.gz: 6a5fbdf78fe2d73522011672a7b3b536a001e0eeb5953a4ffc7171aca361bfab
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 4efd2234d0690ea705ccd894db2b5d89bce059177f7620d65f0e1d998bf41e94a6470a626b4600e96b1cb99ea9c2e77d95c8e7961569c3a8908045ee1bc2a8af
|
|
7
|
+
data.tar.gz: 83c1cef52f7a3f328af20e97720464c8043d63da94b8694d20b74fdd80762a5c838f624fc4b52ef9224d3e4fcf49fe4993ffc1bc010a49d248af24ba21a821d0
|
data/README.md
CHANGED
|
@@ -26,12 +26,16 @@ If you are using [Sprockets](https://github.com/rails/sprockets) make sure to lo
|
|
|
26
26
|
```css
|
|
27
27
|
*= require _reset
|
|
28
28
|
*= require animations
|
|
29
|
+
*= require base
|
|
29
30
|
*= require borders
|
|
30
31
|
*= require buttons
|
|
31
32
|
*= require colors
|
|
33
|
+
*= require dialog
|
|
32
34
|
*= require effects
|
|
33
35
|
*= require filters
|
|
34
36
|
*= require grid
|
|
37
|
+
*= require inputs
|
|
38
|
+
*= require separators
|
|
35
39
|
*= require sizes
|
|
36
40
|
*= require transform
|
|
37
41
|
*= require transition
|
|
@@ -64,39 +68,84 @@ If you are using [Sprockets](https://github.com/rails/sprockets) make sure to lo
|
|
|
64
68
|
|
|
65
69
|
Check the [CSS files](app/assets/stylesheets) in the repository for reference.
|
|
66
70
|
|
|
67
|
-
##
|
|
71
|
+
## Inputs
|
|
68
72
|
|
|
69
|
-
<img width="
|
|
73
|
+
<img width="436" alt="Inputs" src="https://github.com/lazaronixon/css-zero/assets/2651240/9935df82-606f-4ebb-bfd7-d18c9bc8b5f5">
|
|
70
74
|
|
|
71
|
-
```html
|
|
72
|
-
<div class="flex
|
|
73
|
-
<
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
<
|
|
79
|
-
|
|
80
|
-
<
|
|
81
|
-
</
|
|
75
|
+
```html
|
|
76
|
+
<div class="flex flex-col w-full gap" style="max-inline-size: 24rem;">
|
|
77
|
+
<div class="flex flex-col grow gap-small">
|
|
78
|
+
<label for="name_field" class="text-sm font-medium">Full name</label>
|
|
79
|
+
<input type="text" id="name_field" class="input">
|
|
80
|
+
</div>
|
|
81
|
+
|
|
82
|
+
<div class="flex flex-col grow gap-small">
|
|
83
|
+
<label for="date_field" class="text-sm font-medium">Date picker</label>
|
|
84
|
+
<input type="date" id="date_field" class="input">
|
|
85
|
+
</div>
|
|
86
|
+
|
|
87
|
+
<div class="flex flex-col grow gap-small">
|
|
88
|
+
<label for="file_field" class="text-sm font-medium">File</label>
|
|
89
|
+
<input type="file" id="file_field" class="input">
|
|
90
|
+
</div>
|
|
91
|
+
|
|
92
|
+
<div class="flex flex-col grow gap-small">
|
|
93
|
+
<label for="age_range_Field" class="text-sm font-medium">Age Range</label>
|
|
94
|
+
<select id="age_range_Field" class="input">
|
|
95
|
+
<option value="0-13">0-13</option>
|
|
96
|
+
<option value="14-17">14-17</option>
|
|
97
|
+
</select>
|
|
98
|
+
</div>
|
|
99
|
+
|
|
100
|
+
<div class="flex flex-col grow gap-small">
|
|
101
|
+
<label for="comment_field" class="text-sm font-medium">Comment</label>
|
|
102
|
+
<textarea id="comment_field" class="input"></textarea>
|
|
103
|
+
</div>
|
|
104
|
+
|
|
105
|
+
<div class="flex items-center gap-small">
|
|
106
|
+
<input type="checkbox" id="terms">
|
|
107
|
+
<label for="terms" class="text-sm font-medium">Accept terms and conditions</label>
|
|
108
|
+
</div>
|
|
109
|
+
</div>
|
|
110
|
+
```
|
|
82
111
|
|
|
83
|
-
|
|
84
|
-
Colored button
|
|
85
|
-
</button>
|
|
112
|
+
## Buttons
|
|
86
113
|
|
|
87
|
-
|
|
88
|
-
|
|
114
|
+
<img width="783" alt="image" src="https://github.com/lazaronixon/css-zero/assets/2651240/4e6a6829-5dd0-4eff-9b2f-33c9de85d3ef">
|
|
115
|
+
|
|
116
|
+
```html
|
|
117
|
+
<div class="flex justify-center gap">
|
|
118
|
+
<button class="btn">Primary</button>
|
|
119
|
+
<button class="btn btn--secondary">Secondary</button>
|
|
120
|
+
<button class="btn btn--outline">Outline</button>
|
|
121
|
+
<button class="btn btn--plain">Plain</button>
|
|
122
|
+
<button class="btn btn--positive">Positive</button>
|
|
123
|
+
<button class="btn btn--negative">Negative</button>
|
|
124
|
+
|
|
125
|
+
<button class="btn">
|
|
126
|
+
<%= image_tag "plus.svg", role: "presentation", size: 20 %>
|
|
127
|
+
<span>With icon</span>
|
|
89
128
|
</button>
|
|
90
129
|
</div>
|
|
91
130
|
```
|
|
92
131
|
|
|
93
|
-
##
|
|
132
|
+
## Dialog
|
|
94
133
|
|
|
95
|
-
|
|
134
|
+
<img width="572" alt="Dialog" src="https://github.com/lazaronixon/css-zero/assets/2651240/381dd7eb-8024-4ffc-992a-d47d370a3c24">
|
|
96
135
|
|
|
97
|
-
|
|
136
|
+
```html
|
|
137
|
+
<dialog id="my_modal" class="dialog">
|
|
138
|
+
<h1 class="text-lg font-semibold">Are you absolutely sure?</h1>
|
|
139
|
+
<p class="text-sm text-subtle mbs-2">This action cannot be undone. This will permanently delete your account and remove your data from our servers.</p>
|
|
98
140
|
|
|
99
|
-
|
|
141
|
+
<div class="flex gap-small justify-end mbs-4">
|
|
142
|
+
<form method="dialog"><button class="btn btn--outline">Cancel</button></form>
|
|
143
|
+
<button class="btn">Continue</button>
|
|
144
|
+
</div>
|
|
145
|
+
</dialog>
|
|
146
|
+
|
|
147
|
+
<button class="btn" onClick="my_modal.showModal();">Show modal</button>
|
|
148
|
+
```
|
|
100
149
|
|
|
101
150
|
## Customization
|
|
102
151
|
|
|
@@ -124,7 +173,7 @@ Soon...
|
|
|
124
173
|
### Style level
|
|
125
174
|
|
|
126
175
|
```html
|
|
127
|
-
<button class="btn
|
|
176
|
+
<button class="btn" style="--btn-background: #67e8f9; --btn-color: #083344;">
|
|
128
177
|
Colored button
|
|
129
178
|
</button>
|
|
130
179
|
```
|
|
@@ -1,22 +1,26 @@
|
|
|
1
1
|
.btn {
|
|
2
2
|
align-items: center;
|
|
3
|
-
background-color: var(--btn-background,
|
|
4
|
-
border-radius: var(--btn-border-radius, var(--rounded-
|
|
5
|
-
border: 1px solid var(--btn-border-color,
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
column-gap: var(--size-2);
|
|
3
|
+
background-color: var(--btn-background, var(--color-primary));
|
|
4
|
+
border-radius: var(--btn-border-radius, var(--rounded-md));
|
|
5
|
+
border: 1px solid var(--btn-border-color, transparent);
|
|
6
|
+
color: var(--btn-color, var(--color-text-reversed));
|
|
7
|
+
column-gap: var(--btn-gap, var(--size-2));
|
|
9
8
|
cursor: pointer;
|
|
10
9
|
display: inline-flex;
|
|
11
10
|
font-size: var(--btn-font-size, var(--text-sm));
|
|
12
|
-
font-weight: var(--btn-font-weight, var(--font-
|
|
11
|
+
font-weight: var(--btn-font-weight, var(--font-medium));
|
|
13
12
|
justify-content: center;
|
|
14
|
-
|
|
15
|
-
padding: var(--btn-padding, var(--size-1_5) var(--size-3_5));
|
|
13
|
+
padding: var(--btn-padding, .5rem 1rem);
|
|
16
14
|
text-align: center;
|
|
15
|
+
white-space: nowrap;
|
|
17
16
|
|
|
18
|
-
|
|
19
|
-
filter:
|
|
17
|
+
img:not([class]) {
|
|
18
|
+
filter: var(--btn-icon-color, var(--color-filter-text-reversed));
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
&:focus-visible {
|
|
22
|
+
outline: 2px solid var(--color-selected);
|
|
23
|
+
outline-offset: var(--border-2);
|
|
20
24
|
}
|
|
21
25
|
|
|
22
26
|
&:disabled {
|
|
@@ -25,18 +29,31 @@
|
|
|
25
29
|
}
|
|
26
30
|
}
|
|
27
31
|
|
|
28
|
-
.btn--
|
|
29
|
-
--btn-background: var(--color-
|
|
30
|
-
--btn-
|
|
31
|
-
--btn-color:
|
|
32
|
+
.btn--secondary {
|
|
33
|
+
--btn-background: var(--color-secondary);
|
|
34
|
+
--btn-color: var(--color-text);
|
|
35
|
+
--btn-icon-color: var(--color-filter-text);
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
.btn--outline {
|
|
39
|
+
--btn-background: transparent;
|
|
40
|
+
--btn-border-color: var(--color-border);
|
|
41
|
+
--btn-color: var(--color-text);
|
|
42
|
+
--btn-icon-color: var(--color-filter-text);
|
|
32
43
|
}
|
|
33
44
|
|
|
34
45
|
.btn--plain {
|
|
35
|
-
--btn-
|
|
36
|
-
--btn-
|
|
46
|
+
--btn-background: transparent;
|
|
47
|
+
--btn-color: var(--color-text);
|
|
48
|
+
--btn-icon-color: var(--color-filter-text);
|
|
37
49
|
}
|
|
38
50
|
|
|
39
|
-
.btn--
|
|
40
|
-
--btn-
|
|
41
|
-
--btn-
|
|
51
|
+
.btn--positive {
|
|
52
|
+
--btn-background: var(--color-positive);
|
|
53
|
+
--btn-color: white;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
.btn--negative {
|
|
57
|
+
--btn-background: var(--color-negative);
|
|
58
|
+
--btn-color: white;
|
|
42
59
|
}
|
|
@@ -264,27 +264,28 @@
|
|
|
264
264
|
--rose-900: #881337;
|
|
265
265
|
--rose-950: #4c0519;
|
|
266
266
|
|
|
267
|
+
color-scheme: light dark;
|
|
268
|
+
|
|
267
269
|
/* Abstractions */
|
|
268
|
-
--color-
|
|
269
|
-
--color-
|
|
270
|
-
--color-text: var(--zinc-950);
|
|
271
|
-
--color-text-
|
|
272
|
-
--color-
|
|
273
|
-
--color-border:
|
|
270
|
+
--color-bg: light-dark(white, var(--zinc-950));
|
|
271
|
+
--color-text: light-dark(var(--zinc-950), var(--zinc-50));
|
|
272
|
+
--color-text-reversed: light-dark(var(--zinc-50), var(--zinc-950));
|
|
273
|
+
--color-text-subtle: light-dark(var(--zinc-500), var(--zinc-400));
|
|
274
|
+
--color-selected: light-dark(var(--zinc-400), var(--zinc-300));
|
|
275
|
+
--color-border: light-dark(var(--zinc-200), var(--zinc-800));
|
|
276
|
+
|
|
277
|
+
/* Accent colors */
|
|
278
|
+
--color-primary: light-dark(var(--zinc-900), var(--zinc-50));
|
|
279
|
+
--color-secondary: light-dark(var(--zinc-100), var(--zinc-800));
|
|
280
|
+
--color-negative: light-dark(var(--red-600), var(--red-900));
|
|
281
|
+
--color-positive: light-dark(var(--green-600), var(--green-900));
|
|
274
282
|
|
|
275
283
|
/* Filtered color values */
|
|
276
|
-
--color-filter-
|
|
277
|
-
--color-filter-
|
|
284
|
+
--color-filter-text: invert(5%) sepia(10%) saturate(497%) hue-rotate(201deg) brightness(96%) contrast(102%);
|
|
285
|
+
--color-filter-text-reversed: invert(100%) sepia(67%) saturate(49%) hue-rotate(230deg) brightness(119%) contrast(96%);
|
|
278
286
|
|
|
279
|
-
/* Redefine named color values for dark mode */
|
|
280
287
|
@media (prefers-color-scheme: dark) {
|
|
281
|
-
--color-
|
|
282
|
-
--color-
|
|
283
|
-
--color-text: white;
|
|
284
|
-
--color-text-reversed: var(--zinc-950);
|
|
285
|
-
--color-text-subtle: var(--zinc-400);
|
|
286
|
-
--color-border: var(--zinc-700);
|
|
287
|
-
--color-filter-black: var(--invert);
|
|
288
|
-
--color-filter-white: var(--invert-0);
|
|
288
|
+
--color-filter-text: invert(100%) sepia(67%) saturate(49%) hue-rotate(230deg) brightness(119%) contrast(96%);
|
|
289
|
+
--color-filter-text-reversed: invert(5%) sepia(10%) saturate(497%) hue-rotate(201deg) brightness(96%) contrast(102%);
|
|
289
290
|
}
|
|
290
291
|
}
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
.dialog {
|
|
2
|
+
background-color: var(--dialog-background, var(--color-bg));
|
|
3
|
+
border: 1px solid var(--dialog-border-color, var(--color-border));
|
|
4
|
+
border-radius: var(--dialog-border-radius, var(--rounded-lg));
|
|
5
|
+
box-shadow: var(--dialog-shadow, var(--shadow-lg));
|
|
6
|
+
margin: auto; inline-size: 100%;
|
|
7
|
+
max-inline-size: var(--dialog-size, var(--width-lg));
|
|
8
|
+
padding: var(--dialog-padding, var(--size-6));
|
|
9
|
+
|
|
10
|
+
&::backdrop {
|
|
11
|
+
background-color: var(--dialog-backdrop-background, #000c);
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
/* Setup transition */
|
|
15
|
+
&, &::backdrop {
|
|
16
|
+
opacity: 0; transition: all var(--time-300) allow-discrete;
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
/* Fade in */
|
|
20
|
+
&[open], &[open]::backdrop {
|
|
21
|
+
opacity: 1
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
/* Fade out */
|
|
25
|
+
@starting-style {
|
|
26
|
+
&[open], &[open]::backdrop { opacity: 0; }
|
|
27
|
+
}
|
|
28
|
+
|
|
29
|
+
/* Responsiveness */
|
|
30
|
+
@media (width <= 40rem) {
|
|
31
|
+
border-radius: 0;
|
|
32
|
+
}
|
|
33
|
+
}
|
|
@@ -0,0 +1,54 @@
|
|
|
1
|
+
.input {
|
|
2
|
+
appearance: none;
|
|
3
|
+
background-color: var(--input-background, transparent);
|
|
4
|
+
border-radius: var(--input-border-radius, var(--rounded-md));
|
|
5
|
+
border: 1px solid var(--input-border-color, var(--color-border));
|
|
6
|
+
box-shadow: var(--input-shadow, var(--shadow-xs));
|
|
7
|
+
color: var(--input-color, var(--color-text));
|
|
8
|
+
font-size: var(--input-font-size, var(--text-sm));
|
|
9
|
+
inline-size: 100%;
|
|
10
|
+
padding: var(--input-padding, .5rem .75rem);
|
|
11
|
+
|
|
12
|
+
&::file-selector-button {
|
|
13
|
+
font-weight: var(--font-medium);
|
|
14
|
+
margin-inline-end: var(--size-2);
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
&:is(textarea) {
|
|
18
|
+
field-sizing: content;
|
|
19
|
+
min-block-size: var(--input-lines, 4lh);
|
|
20
|
+
resize: none;
|
|
21
|
+
}
|
|
22
|
+
|
|
23
|
+
&:is(select):not([multiple]) {
|
|
24
|
+
background-image: var(--icon-chevron, url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='rgb(113,113,122)' stroke-width='2'%3E%3Cpath d='m6 9 6 6 6-6'%3E%3C/path%3E%3C/svg%3E"));
|
|
25
|
+
background-position: center right var(--icon-chevron-padding, .75rem);
|
|
26
|
+
background-size: 1rem auto;
|
|
27
|
+
background-repeat: no-repeat;
|
|
28
|
+
}
|
|
29
|
+
|
|
30
|
+
&:focus-visible {
|
|
31
|
+
outline: 2px solid var(--color-selected);
|
|
32
|
+
outline-offset: var(--border-2);
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
&:disabled {
|
|
36
|
+
cursor: not-allowed;
|
|
37
|
+
opacity: var(--opacity-50);
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
&::placeholder {
|
|
41
|
+
color: var(--color-text-subtle);
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
[type="checkbox"], [type="radio"] {
|
|
46
|
+
accent-color: var(--check-color, var(--color-primary));
|
|
47
|
+
height: var(--check-size, var(--size-4));
|
|
48
|
+
width: var(--check-size, var(--size-4));
|
|
49
|
+
|
|
50
|
+
&:focus-visible {
|
|
51
|
+
outline: 2px solid var(--color-selected);
|
|
52
|
+
outline-offset: var(--border-2);
|
|
53
|
+
}
|
|
54
|
+
}
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
.self-center { align-self: center; }
|
|
24
24
|
|
|
25
25
|
.gap { column-gap: var(--column-gap, 1rem); row-gap: var(--row-gap, 1rem); }
|
|
26
|
-
.gap-
|
|
26
|
+
.gap-small { column-gap: 0.5rem; row-gap: 0.5rem; }
|
|
27
27
|
|
|
28
28
|
/****************************************************************
|
|
29
29
|
* Text
|
|
@@ -60,6 +60,8 @@
|
|
|
60
60
|
|
|
61
61
|
.text-primary { color: var(--color-text); }
|
|
62
62
|
.text-reversed { color: var(--color-text-reversed); }
|
|
63
|
+
.text-negative { color: var(--color-negative); }
|
|
64
|
+
.text-positive { color: var(--color-positive); }
|
|
63
65
|
.text-subtle { color: var(--color-text-subtle); }
|
|
64
66
|
|
|
65
67
|
.text-xs { font-size: var(--text-xs); }
|
|
@@ -82,12 +84,13 @@
|
|
|
82
84
|
.bg-main { background-color: var(--color-bg); }
|
|
83
85
|
.bg-black { background-color: var(--color-text); }
|
|
84
86
|
.bg-white { background-color: var(--color-text-reversed); }
|
|
85
|
-
.bg-shade { background-color: var(--color-border); }
|
|
86
87
|
.bg-transparent { background-color: transparent; }
|
|
87
88
|
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
89
|
+
/****************************************************************
|
|
90
|
+
* SVG colors
|
|
91
|
+
*****************************************************************/
|
|
92
|
+
.colorize-black { filter: var(--color-filter-text); }
|
|
93
|
+
.colorize-white { filter: var(--color-filter-text-reversed); }
|
|
91
94
|
|
|
92
95
|
/****************************************************************
|
|
93
96
|
* Border
|
|
@@ -141,16 +144,6 @@
|
|
|
141
144
|
.overflow-y-auto { overflow-y: auto; scroll-snap-type: y mandatory; scroll-behavior: smooth; }
|
|
142
145
|
.overflow-hidden { overflow: hidden; }
|
|
143
146
|
|
|
144
|
-
.sr-only {
|
|
145
|
-
position: absolute;
|
|
146
|
-
width: 1px; height: 1px;
|
|
147
|
-
padding: 0; margin: -1px;
|
|
148
|
-
overflow: hidden;
|
|
149
|
-
clip: rect(0, 0, 0, 0);
|
|
150
|
-
white-space: nowrap;
|
|
151
|
-
border-width: 0;
|
|
152
|
-
}
|
|
153
|
-
|
|
154
147
|
/****************************************************************
|
|
155
148
|
* Margin
|
|
156
149
|
*****************************************************************/
|
|
@@ -289,3 +282,16 @@
|
|
|
289
282
|
.pie-6 { padding-inline-end: var(--size-6); }
|
|
290
283
|
.pie-8 { padding-inline-end: var(--size-8); }
|
|
291
284
|
.pie-10 { padding-inline-end: var(--size-10); }
|
|
285
|
+
|
|
286
|
+
/****************************************************************
|
|
287
|
+
* Accessibility
|
|
288
|
+
*****************************************************************/
|
|
289
|
+
.sr-only {
|
|
290
|
+
position: absolute;
|
|
291
|
+
width: 1px; height: 1px;
|
|
292
|
+
padding: 0; margin: -1px;
|
|
293
|
+
overflow: hidden;
|
|
294
|
+
clip: rect(0, 0, 0, 0);
|
|
295
|
+
white-space: nowrap;
|
|
296
|
+
border-width: 0;
|
|
297
|
+
}
|
data/lib/css_zero/version.rb
CHANGED
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: css-zero
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.0.
|
|
4
|
+
version: 0.0.10
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Lázaro Nixon
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: bin
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2024-06-
|
|
11
|
+
date: 2024-06-18 00:00:00.000000000 Z
|
|
12
12
|
dependencies: []
|
|
13
13
|
description:
|
|
14
14
|
email: lazaronixon@hotmail.com
|
|
@@ -23,9 +23,11 @@ files:
|
|
|
23
23
|
- app/assets/stylesheets/borders.css
|
|
24
24
|
- app/assets/stylesheets/buttons.css
|
|
25
25
|
- app/assets/stylesheets/colors.css
|
|
26
|
+
- app/assets/stylesheets/dialog.css
|
|
26
27
|
- app/assets/stylesheets/effects.css
|
|
27
28
|
- app/assets/stylesheets/filters.css
|
|
28
29
|
- app/assets/stylesheets/grid.css
|
|
30
|
+
- app/assets/stylesheets/inputs.css
|
|
29
31
|
- app/assets/stylesheets/sizes.css
|
|
30
32
|
- app/assets/stylesheets/transform.css
|
|
31
33
|
- app/assets/stylesheets/transition.css
|