css-zero 0.0.15 → 0.0.16
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/README.md +3 -1
- data/app/assets/stylesheets/_reset.css +6 -6
- data/app/assets/stylesheets/zutilities.css +4 -0
- data/lib/css_zero/version.rb +1 -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/dialog.css +4 -4
- data/lib/generators/css_zero/add/templates/app/assets/stylesheets/table.css +1 -1
- data/lib/generators/css_zero/add/templates/app/javascript/controllers/dialog_controller.js +1 -1
- data/lib/generators/css_zero/install/templates/app/assets/stylesheets/base.css +25 -13
- 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: 25eac2e80a7b075843033e5db405786dd14e9f802cb47ce2fd1f0375e7841565
|
|
4
|
+
data.tar.gz: 52cd0c2ed8d8eb740d44e29210ff8652088cac7509ccf024a957f837ada2cfc2
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 39e8b29cb429cf7e8d4d180682c17cef15e5105f51fc9c0b88ece548f688a41558569f2aeda76bf9365df202b6e01f791dd7520b5225ef0357a80e1d0a39ed70
|
|
7
|
+
data.tar.gz: 52d7914ad684c3b27766979afa42834796a361846dc679d2a44300ed1858a92490f1f5c09665b0bb40a0e4671303de8402dc4127eda6ab25d8cebc7df389318c
|
data/README.md
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# CSS Zero
|
|
2
2
|
|
|
3
|
-
An opinionated CSS starter kit for your application. You can think of it like a "no build" Tailwind CSS.
|
|
3
|
+
An opinionated CSS starter kit for your Ruby on Rails application. You can think of it like a "no build" Tailwind CSS.
|
|
4
4
|
|
|
5
5
|
## Installation
|
|
6
6
|
|
|
@@ -413,6 +413,8 @@ Check the [CSS files](app/assets/stylesheets) in the repository to see the avail
|
|
|
413
413
|
```
|
|
414
414
|
</details>
|
|
415
415
|
|
|
416
|
+
### More components soon...
|
|
417
|
+
|
|
416
418
|
## Development
|
|
417
419
|
|
|
418
420
|
To release a new version, update the version number in `version.rb`, and then run `bundle exec rake release`, which will create a git tag for the version, push git commits and the created tag, and push the `.gem` file to [rubygems.org](https://rubygems.org).
|
|
@@ -60,7 +60,7 @@ body {
|
|
|
60
60
|
*/
|
|
61
61
|
|
|
62
62
|
hr {
|
|
63
|
-
|
|
63
|
+
block-size: 0; /* 1 */
|
|
64
64
|
color: inherit; /* 2 */
|
|
65
65
|
border-block-start-width: 1px; /* 3 */
|
|
66
66
|
}
|
|
@@ -155,11 +155,11 @@ sup {
|
|
|
155
155
|
}
|
|
156
156
|
|
|
157
157
|
sub {
|
|
158
|
-
|
|
158
|
+
inset-block-end: -0.25em;
|
|
159
159
|
}
|
|
160
160
|
|
|
161
161
|
sup {
|
|
162
|
-
|
|
162
|
+
inset-block-start: -0.5em;
|
|
163
163
|
}
|
|
164
164
|
|
|
165
165
|
/*
|
|
@@ -242,7 +242,7 @@ progress {
|
|
|
242
242
|
|
|
243
243
|
::-webkit-inner-spin-button,
|
|
244
244
|
::-webkit-outer-spin-button {
|
|
245
|
-
|
|
245
|
+
block-size: auto;
|
|
246
246
|
}
|
|
247
247
|
|
|
248
248
|
/*
|
|
@@ -321,8 +321,8 @@ object {
|
|
|
321
321
|
|
|
322
322
|
img,
|
|
323
323
|
video {
|
|
324
|
-
max-
|
|
325
|
-
|
|
324
|
+
max-inline-size: 100%;
|
|
325
|
+
block-size: auto;
|
|
326
326
|
}
|
|
327
327
|
|
|
328
328
|
/*
|
|
@@ -16,6 +16,9 @@
|
|
|
16
16
|
.items-center { align-items: center; }
|
|
17
17
|
|
|
18
18
|
.grow { flex-grow: 1; }
|
|
19
|
+
.grow-0 { flex-grow: 0; }
|
|
20
|
+
|
|
21
|
+
.shrink { flex-shrink: 1; }
|
|
19
22
|
.shrink-0 { flex-shrink: 0; }
|
|
20
23
|
|
|
21
24
|
.self-start { align-self: start; }
|
|
@@ -85,6 +88,7 @@
|
|
|
85
88
|
.bg-main { background-color: var(--color-bg); }
|
|
86
89
|
.bg-black { background-color: var(--color-text); }
|
|
87
90
|
.bg-white { background-color: var(--color-text-reversed); }
|
|
91
|
+
.bg-shade { background-color: var(--color-secondary); }
|
|
88
92
|
.bg-transparent { background-color: transparent; }
|
|
89
93
|
|
|
90
94
|
/****************************************************************
|
data/lib/css_zero/version.rb
CHANGED
|
@@ -11,9 +11,9 @@
|
|
|
11
11
|
font-weight: var(--font-medium);
|
|
12
12
|
gap: var(--size-2);
|
|
13
13
|
justify-content: center;
|
|
14
|
+
min-inline-size: fit-content;
|
|
14
15
|
padding: var(--size-2) var(--size-4);
|
|
15
16
|
text-align: center;
|
|
16
|
-
white-space: nowrap;
|
|
17
17
|
|
|
18
18
|
img:not([class]) {
|
|
19
19
|
filter: var(--btn-icon-color, var(--color-filter-text-reversed));
|
|
@@ -7,7 +7,6 @@
|
|
|
7
7
|
inline-size: var(--size-full);
|
|
8
8
|
margin: auto;
|
|
9
9
|
max-inline-size: var(--width-lg);
|
|
10
|
-
overflow: hidden;
|
|
11
10
|
padding: var(--size-6);
|
|
12
11
|
|
|
13
12
|
&::backdrop {
|
|
@@ -19,13 +18,13 @@
|
|
|
19
18
|
transform: var(--scale-95);
|
|
20
19
|
transition-behavior: allow-discrete;
|
|
21
20
|
transition-duration: var(--time-150);
|
|
22
|
-
transition-property: display overlay opacity transform;
|
|
21
|
+
transition-property: display, overlay, opacity, transform;
|
|
23
22
|
|
|
24
23
|
&::backdrop {
|
|
25
24
|
opacity: 0;
|
|
26
25
|
transition-behavior: allow-discrete;
|
|
27
26
|
transition-duration: var(--time-150);
|
|
28
|
-
transition-property: display overlay opacity;
|
|
27
|
+
transition-property: display, overlay, opacity;
|
|
29
28
|
}
|
|
30
29
|
|
|
31
30
|
/* In animation */
|
|
@@ -55,8 +54,9 @@
|
|
|
55
54
|
}
|
|
56
55
|
|
|
57
56
|
.dialog__close {
|
|
57
|
+
inset-block-start: var(--size-4);
|
|
58
|
+
inset-inline-end: var(--size-4);
|
|
58
59
|
position: absolute;
|
|
59
|
-
inset: var(--size-4) var(--size-4) auto auto;
|
|
60
60
|
}
|
|
61
61
|
|
|
62
62
|
/* Prevent page scroll when dialog is open */
|
|
@@ -1,20 +1,17 @@
|
|
|
1
1
|
:root {
|
|
2
|
-
/* Color Scheme */
|
|
3
|
-
color-scheme: light dark;
|
|
4
|
-
|
|
5
2
|
/* Abstractions */
|
|
6
|
-
--color-bg:
|
|
7
|
-
--color-text:
|
|
8
|
-
--color-text-reversed:
|
|
9
|
-
--color-text-subtle:
|
|
10
|
-
--color-border:
|
|
11
|
-
--color-border-darker:
|
|
3
|
+
--color-bg: white;
|
|
4
|
+
--color-text: black;
|
|
5
|
+
--color-text-reversed: white;
|
|
6
|
+
--color-text-subtle: var(--zinc-500);
|
|
7
|
+
--color-border: var(--zinc-200);
|
|
8
|
+
--color-border-darker: var(--zinc-400);
|
|
12
9
|
|
|
13
10
|
/* Accent colors */
|
|
14
|
-
--color-primary:
|
|
15
|
-
--color-secondary:
|
|
16
|
-
--color-negative:
|
|
17
|
-
--color-positive:
|
|
11
|
+
--color-primary: var(--zinc-900);
|
|
12
|
+
--color-secondary: var(--zinc-100);
|
|
13
|
+
--color-negative: var(--red-600);
|
|
14
|
+
--color-positive: var(--green-600);
|
|
18
15
|
|
|
19
16
|
/* SVG color values */
|
|
20
17
|
--color-filter-text: invert(0);
|
|
@@ -23,6 +20,21 @@
|
|
|
23
20
|
--color-filter-positive: invert(48%) sepia(74%) saturate(520%) hue-rotate(90deg) brightness(89%) contrast(90%);
|
|
24
21
|
|
|
25
22
|
@media (prefers-color-scheme: dark) {
|
|
23
|
+
/* Abstractions */
|
|
24
|
+
--color-bg: var(--zinc-950);
|
|
25
|
+
--color-text: white;
|
|
26
|
+
--color-text-reversed: black;
|
|
27
|
+
--color-text-subtle: var(--zinc-400);
|
|
28
|
+
--color-border: var(--zinc-800);
|
|
29
|
+
--color-border-darker: var(--zinc-300);
|
|
30
|
+
|
|
31
|
+
/* Accent colors */
|
|
32
|
+
--color-primary: var(--zinc-50);
|
|
33
|
+
--color-secondary: var(--zinc-800);
|
|
34
|
+
--color-negative: var(--red-900);
|
|
35
|
+
--color-positive: var(--green-900);
|
|
36
|
+
|
|
37
|
+
/* SVG color values */
|
|
26
38
|
--color-filter-text: invert(100%);
|
|
27
39
|
--color-filter-text-reversed: invert(0);
|
|
28
40
|
--color-filter-negative: invert(15%) sepia(83%) saturate(2066%) hue-rotate(345deg) brightness(87%) contrast(88%);
|
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.16
|
|
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-04 00:00:00.000000000 Z
|
|
12
12
|
dependencies: []
|
|
13
13
|
description:
|
|
14
14
|
email: lazaronixon@hotmail.com
|