css-zero 0.0.26 → 0.0.28
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 +2 -2
- data/app/assets/stylesheets/_reset.css +16 -19
- data/lib/css_zero/version.rb +1 -1
- data/lib/generators/css_zero/add/USAGE +1 -1
- data/lib/generators/css_zero/add/resources.yml +2 -0
- data/lib/generators/css_zero/add/templates/app/assets/stylesheets/accordion.css +0 -2
- data/lib/generators/css_zero/add/templates/app/assets/stylesheets/badge.css +0 -1
- data/lib/generators/css_zero/add/templates/app/assets/stylesheets/button.css +1 -1
- data/lib/generators/css_zero/add/templates/app/assets/stylesheets/card.css +0 -2
- data/lib/generators/css_zero/add/templates/app/assets/stylesheets/carousel.css +4 -0
- data/lib/generators/css_zero/add/templates/app/assets/stylesheets/dialog.css +1 -5
- data/lib/generators/css_zero/add/templates/app/assets/stylesheets/flash.css +1 -7
- data/lib/generators/css_zero/add/templates/app/assets/stylesheets/input.css +0 -1
- data/lib/generators/css_zero/add/templates/app/assets/stylesheets/toggle.css +17 -0
- metadata +3 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 5d00718d05a40dc614c0fda5d71c5959ad693c89e1fd5493c132a5d4144cbe5e
|
|
4
|
+
data.tar.gz: b1f8b29d85f5ba031dfd416a80c57dc12d1b0903e0881c2e4cac3d18e2a39aa8
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 6e0e3afefccb4f99330a9c3a3942b8619714b8152dd24e04bb421029f55fdff57ec3e1fbde841036151586235e5dcc07a505f0d713d661e15dbfcb37477e9653
|
|
7
|
+
data.tar.gz: f4207685a64ce0a9b70cc1553aa6cede199c9eda2238823c1f713a4049d38992e8fe28b76c64678c6854fc627144a283bba92b2314ac2f6958b3546bef9d001c
|
data/README.md
CHANGED
|
@@ -19,7 +19,7 @@ bin/rails generate css_zero:install
|
|
|
19
19
|
Add only the components you need. (Optional)
|
|
20
20
|
|
|
21
21
|
```
|
|
22
|
-
bin/rails generate css_zero:add accordion alert avatar badge breadcrumb button card carousel collapsible dialog flash input pagination progress prose sheet skeleton switch table
|
|
22
|
+
bin/rails generate css_zero:add accordion alert avatar badge breadcrumb button card carousel collapsible dialog flash input pagination progress prose sheet skeleton switch table toggle
|
|
23
23
|
```
|
|
24
24
|
|
|
25
25
|
### Requirements
|
|
@@ -52,9 +52,9 @@ If you are using [Sprockets](https://github.com/rails/sprockets) make sure to lo
|
|
|
52
52
|
*= require transform
|
|
53
53
|
*= require transition
|
|
54
54
|
*= require typography
|
|
55
|
+
*= require zindex
|
|
55
56
|
*= require_tree .
|
|
56
57
|
*= require_self
|
|
57
|
-
*= require zindex
|
|
58
58
|
*= require zutilities
|
|
59
59
|
*/
|
|
60
60
|
```
|
|
@@ -36,6 +36,15 @@ html,
|
|
|
36
36
|
-webkit-tap-highlight-color: transparent; /* 7 */
|
|
37
37
|
}
|
|
38
38
|
|
|
39
|
+
/*
|
|
40
|
+
Prevent page scroll when modal dialog is open.
|
|
41
|
+
*/
|
|
42
|
+
|
|
43
|
+
html:has(dialog:modal[open]) {
|
|
44
|
+
overflow: hidden;
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
|
|
39
48
|
/*
|
|
40
49
|
Inherit line-height from `html` so users can set them as a class directly on the `html` element.
|
|
41
50
|
*/
|
|
@@ -242,14 +251,6 @@ progress {
|
|
|
242
251
|
line-height: 1em;
|
|
243
252
|
}
|
|
244
253
|
|
|
245
|
-
/*
|
|
246
|
-
Correct empty date field height on safari IOS.
|
|
247
|
-
*/
|
|
248
|
-
|
|
249
|
-
::-webkit-date-and-time-value {
|
|
250
|
-
height: 1.5em;
|
|
251
|
-
}
|
|
252
|
-
|
|
253
254
|
/*
|
|
254
255
|
Remove the inner padding in Chrome and Safari on macOS.
|
|
255
256
|
*/
|
|
@@ -259,16 +260,11 @@ progress {
|
|
|
259
260
|
}
|
|
260
261
|
|
|
261
262
|
/*
|
|
262
|
-
|
|
263
|
+
Correct empty date field height on safari IOS.
|
|
263
264
|
*/
|
|
264
265
|
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
-webkit-appearance: none;
|
|
268
|
-
}
|
|
269
|
-
|
|
270
|
-
input[step='any'] {
|
|
271
|
-
-moz-appearance: textfield;
|
|
266
|
+
::-webkit-date-and-time-value {
|
|
267
|
+
height: 1.5em;
|
|
272
268
|
}
|
|
273
269
|
|
|
274
270
|
/*
|
|
@@ -344,10 +340,11 @@ video {
|
|
|
344
340
|
}
|
|
345
341
|
|
|
346
342
|
/*
|
|
347
|
-
|
|
343
|
+
Make turbo frame become pseudo-box by default.
|
|
348
344
|
*/
|
|
349
|
-
|
|
350
|
-
|
|
345
|
+
|
|
346
|
+
turbo-frame {
|
|
347
|
+
display: contents;
|
|
351
348
|
}
|
|
352
349
|
|
|
353
350
|
/*
|
data/lib/css_zero/version.rb
CHANGED
|
@@ -2,7 +2,7 @@ Description:
|
|
|
2
2
|
This will add components into your project.
|
|
3
3
|
|
|
4
4
|
Components:
|
|
5
|
-
accordion alert avatar badge breadcrumb button card carousel collapsible dialog flash input pagination progress prose sheet skeleton switch table
|
|
5
|
+
accordion alert avatar badge breadcrumb button card carousel collapsible dialog flash input pagination progress prose sheet skeleton switch table toggle
|
|
6
6
|
|
|
7
7
|
Example:
|
|
8
8
|
bin/rails generate css_zero:add [components...]
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
.btn {
|
|
2
2
|
align-items: center;
|
|
3
3
|
background-color: var(--btn-background, var(--color-primary));
|
|
4
|
-
border-color: var(--color-border);
|
|
5
4
|
border-radius: var(--rounded-md);
|
|
6
5
|
border-width: var(--btn-border-width, 0);
|
|
7
6
|
color: var(--btn-color, var(--color-text-reversed));
|
|
@@ -71,6 +70,7 @@
|
|
|
71
70
|
|
|
72
71
|
&::after {
|
|
73
72
|
animation: var(--animate-spin);
|
|
73
|
+
animation-duration: 1s;
|
|
74
74
|
background-image: url("loader-circle.svg");
|
|
75
75
|
background-size: cover;
|
|
76
76
|
block-size: var(--size-4);
|
|
@@ -51,7 +51,7 @@
|
|
|
51
51
|
border-end-end-radius: 0;
|
|
52
52
|
border-end-start-radius: 0;
|
|
53
53
|
margin-block-end: 0;
|
|
54
|
-
max-inline-size: none
|
|
54
|
+
max-inline-size: none;
|
|
55
55
|
}
|
|
56
56
|
}
|
|
57
57
|
|
|
@@ -59,8 +59,4 @@
|
|
|
59
59
|
inset-block-start: var(--size-4);
|
|
60
60
|
inset-inline-end: var(--size-4);
|
|
61
61
|
position: absolute;
|
|
62
|
-
|
|
63
|
-
@media (width < 40rem) {
|
|
64
|
-
display: none;
|
|
65
|
-
}
|
|
66
62
|
}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
.flash {
|
|
2
2
|
animation: appear-then-fade 4s 300ms both;
|
|
3
|
-
|
|
4
|
-
background-color: hsl(from var(--color-text) h s l / .65);
|
|
3
|
+
background-color: var(--color-text);
|
|
5
4
|
border-radius: var(--rounded-full);
|
|
6
5
|
color: var(--color-text-reversed);
|
|
7
6
|
margin-block-start: var(--size-4);
|
|
@@ -9,11 +8,6 @@
|
|
|
9
8
|
padding: var(--size-2) var(--size-4);
|
|
10
9
|
position: fixed;
|
|
11
10
|
text-align: center;
|
|
12
|
-
|
|
13
|
-
img {
|
|
14
|
-
display: inline;
|
|
15
|
-
margin-block-end: var(--size-1);
|
|
16
|
-
}
|
|
17
11
|
}
|
|
18
12
|
|
|
19
13
|
@keyframes appear-then-fade {
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
.toggle {
|
|
2
|
+
display: inline-flex;
|
|
3
|
+
position: relative;
|
|
4
|
+
|
|
5
|
+
&:has(:focus-visible) .btn {
|
|
6
|
+
outline: var(--border-2) solid var(--color-selected-dark);
|
|
7
|
+
outline-offset: var(--border-2);
|
|
8
|
+
}
|
|
9
|
+
|
|
10
|
+
[type="checkbox"] {
|
|
11
|
+
position: absolute; clip: rect(0, 0, 0, 0);
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
[type="checkbox"]:checked + .btn {
|
|
15
|
+
--btn-background: var(--color-secondary);
|
|
16
|
+
}
|
|
17
|
+
}
|
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.28
|
|
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-07-
|
|
11
|
+
date: 2024-07-26 00:00:00.000000000 Z
|
|
12
12
|
dependencies: []
|
|
13
13
|
description:
|
|
14
14
|
email: lazaronixon@hotmail.com
|
|
@@ -66,6 +66,7 @@ files:
|
|
|
66
66
|
- lib/generators/css_zero/add/templates/app/assets/stylesheets/skeleton.css
|
|
67
67
|
- lib/generators/css_zero/add/templates/app/assets/stylesheets/switch.css
|
|
68
68
|
- lib/generators/css_zero/add/templates/app/assets/stylesheets/table.css
|
|
69
|
+
- lib/generators/css_zero/add/templates/app/assets/stylesheets/toggle.css
|
|
69
70
|
- lib/generators/css_zero/add/templates/app/javascript/controllers/carousel_controller.js
|
|
70
71
|
- lib/generators/css_zero/add/templates/app/javascript/controllers/collapsible_controller.js
|
|
71
72
|
- lib/generators/css_zero/add/templates/app/javascript/controllers/dialog_controller.js
|