css-zero 0.0.35 → 0.0.36

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.
Files changed (51) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +1 -1
  3. data/app/assets/stylesheets/zutilities.css +0 -7
  4. data/lib/css_zero/version.rb +1 -1
  5. data/lib/generators/css_zero/add/USAGE +1 -1
  6. data/lib/generators/css_zero/add/resources.yml +29 -1
  7. data/lib/generators/css_zero/add/templates/app/assets/images/camera.svg +1 -0
  8. data/lib/generators/css_zero/add/templates/app/assets/images/chevron-down.svg +1 -1
  9. data/lib/generators/css_zero/add/templates/app/assets/images/chevron-left.svg +1 -1
  10. data/lib/generators/css_zero/add/templates/app/assets/images/chevron-right.svg +1 -1
  11. data/lib/generators/css_zero/add/templates/app/assets/images/circle-alert.svg +1 -1
  12. data/lib/generators/css_zero/add/templates/app/assets/images/copy.svg +1 -0
  13. data/lib/generators/css_zero/add/templates/app/assets/images/default-picture.webp +0 -0
  14. data/lib/generators/css_zero/add/templates/app/assets/images/download.svg +1 -0
  15. data/lib/generators/css_zero/add/templates/app/assets/images/ellipsis.svg +1 -1
  16. data/lib/generators/css_zero/add/templates/app/assets/images/eye-off.svg +1 -0
  17. data/lib/generators/css_zero/add/templates/app/assets/images/eye.svg +1 -0
  18. data/lib/generators/css_zero/add/templates/app/assets/images/loader-circle.svg +1 -1
  19. data/lib/generators/css_zero/add/templates/app/assets/images/maximize.svg +1 -0
  20. data/lib/generators/css_zero/add/templates/app/assets/images/minus.svg +1 -0
  21. data/lib/generators/css_zero/add/templates/app/assets/images/select-arrow.svg +1 -1
  22. data/lib/generators/css_zero/add/templates/app/assets/images/share.svg +1 -0
  23. data/lib/generators/css_zero/add/templates/app/assets/images/x.svg +1 -1
  24. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/avatar.css +17 -0
  25. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/badge.css +12 -9
  26. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/breadcrumb.css +2 -2
  27. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/button.css +43 -25
  28. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/input.css +0 -5
  29. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/layouts.css +4 -4
  30. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/lightbox.css +41 -0
  31. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/sheet.css +1 -1
  32. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/skeleton.css +1 -1
  33. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/tabs.css +7 -4
  34. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/toggle.css +6 -6
  35. data/lib/generators/css_zero/add/templates/app/javascript/controllers/autoselect_controller.js +11 -0
  36. data/lib/generators/css_zero/add/templates/app/javascript/controllers/carousel_controller.js +1 -1
  37. data/lib/generators/css_zero/add/templates/app/javascript/controllers/check_all_controller.js +9 -0
  38. data/lib/generators/css_zero/add/templates/app/javascript/controllers/clear_button_controller.js +9 -0
  39. data/lib/generators/css_zero/add/templates/app/javascript/controllers/copy_button_controller.js +13 -0
  40. data/lib/generators/css_zero/add/templates/app/javascript/controllers/dialog_controller.js +4 -4
  41. data/lib/generators/css_zero/add/templates/app/javascript/controllers/form_controller.js +13 -0
  42. data/lib/generators/css_zero/add/templates/app/javascript/controllers/fullscreen_controller.js +33 -0
  43. data/lib/generators/css_zero/add/templates/app/javascript/controllers/hotkey_controller.js +17 -0
  44. data/lib/generators/css_zero/add/templates/app/javascript/controllers/lightbox_controller.js +26 -0
  45. data/lib/generators/css_zero/add/templates/app/javascript/controllers/reveal_button_controller.js +19 -0
  46. data/lib/generators/css_zero/add/templates/app/javascript/controllers/tabs_controller.js +8 -9
  47. data/lib/generators/css_zero/add/templates/app/javascript/controllers/upload_preview_controller.js +21 -0
  48. data/lib/generators/css_zero/add/templates/app/javascript/controllers/web_share_controller.js +42 -0
  49. data/lib/generators/css_zero/install/templates/app/assets/stylesheets/base.css +2 -7
  50. metadata +23 -3
  51. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/pagination.css +0 -32
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: 1860fb6136673d380985cf9fe42371a58d99bbda6c64f3c506a1412e6447e163
4
- data.tar.gz: 27595e7ed7052f1cd5f05fe4e5c807738224530328062d41b09f1d5327478289
3
+ metadata.gz: 02bf5fecc4db0a341a8e9787bf93ff11f447b0c36d71d02105fccfb544db431e
4
+ data.tar.gz: 6c39de744cd1c74965873dc531e55b8c8229785d698bcbf355de88a6f5f4ff04
5
5
  SHA512:
6
- metadata.gz: 39143697d27bd095e2c9c238ad36f69dec5d6733113a58096e14c454ea2dddc5f295a7a1b2035875447e7173da89fbebfc06488c8f4f4a9ef23739270e339c6c
7
- data.tar.gz: df3d03f4cc537150251d0971108a2ae0a2c26f7e07f6a40b1474bdab48c64aa629b483a0092b7d4ee1a493b2eaaeea82bb02a779cad3c926096b889736480322
6
+ metadata.gz: eb4d6e6c8b0ec2b26e98eb4b3cd504d20024787ab435a65b0b624cbf1acdf044e5afe13be4118091bfb2b321e7f7d0e6afc5ab08b8e12bbcbdce93e9196fae0b
7
+ data.tar.gz: d93dfdf03c9752c3c938c81282b48c4fef238b344f7409e35af9a4f5369eca79b8c2feed210c0301639c9b21e367258640a7e97c4142b83adb5e393129ac674c
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 layouts pagination progress prose sheet skeleton switch table tabs toggle
22
+ bin/rails generate css_zero:add accordion alert avatar badge breadcrumb button card carousel collapsible dialog flash fullscreen hotkey input input_concerns layouts lightbox pagination progress prose sheet skeleton switch table tabs upload_preview toggle web_share
23
23
  ```
24
24
 
25
25
  ### Requirements
data/app/assets/stylesheets/zutilities.css CHANGED
@@ -122,16 +122,11 @@
122
122
  .border-main { border-color: var(--color-border); }
123
123
  .border-dark { border-color: var(--color-border-dark); }
124
124
 
125
- .border-solid { border-style: solid; }
126
- .border-dashed { border-style: dashed; }
127
- .border-dotted { border-style: dotted; }
128
-
129
125
  .rounded-none { border-radius: none; }
130
126
  .rounded-sm { border-radius: var(--rounded-sm); }
131
127
  .rounded { border-radius: var(--rounded); }
132
128
  .rounded-md { border-radius: var(--rounded-md); }
133
129
  .rounded-lg { border-radius: var(--rounded-lg); }
134
- .rounded-xl { border-radius: var(--rounded-xl); }
135
130
  .rounded-full { border-radius: var(--rounded-full); }
136
131
 
137
132
  /****************************************************************
@@ -142,8 +137,6 @@
142
137
  .shadow { box-shadow: var(--shadow); }
143
138
  .shadow-md { box-shadow: var(--shadow-md); }
144
139
  .shadow-lg { box-shadow: var(--shadow-lg); }
145
- .shadow-xl { box-shadow: var(--shadow-xl); }
146
- .shadow-2xl { box-shadow: var(--shadow-2xl); }
147
140
 
148
141
  /****************************************************************
149
142
  * Layout
data/lib/css_zero/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module CssZero
2
- VERSION = "0.0.35"
2
+ VERSION = "0.0.36"
3
3
  end
data/lib/generators/css_zero/add/USAGE 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 layouts pagination progress prose sheet skeleton switch table tabs toggle
5
+ accordion alert avatar badge breadcrumb button card carousel collapsible dialog flash fullscreen hotkey input input_concerns layouts lightbox pagination progress prose sheet skeleton switch table tabs upload_preview toggle web_share
6
6
 
7
7
  Example:
8
8
  bin/rails generate css_zero:add [components...]
data/lib/generators/css_zero/add/resources.yml CHANGED
@@ -29,14 +29,34 @@ dialog:
29
29
  flash:
30
30
  - app/assets/stylesheets/flash.css
31
31
  - app/javascript/controllers/element_removal_controller.js
32
+ fullscreen:
33
+ - app/javascript/controllers/fullscreen_controller.js
34
+ - app/assets/images/maximize.svg
35
+ hotkey:
36
+ - app/javascript/controllers/hotkey_controller.js
32
37
  input:
33
38
  - app/assets/stylesheets/input.css
34
39
  - app/assets/images/select-arrow.svg
40
+ - app/javascript/controllers/check_all_controller.js
41
+ input_concerns:
42
+ - app/javascript/controllers/autoselect_controller.js
43
+ - app/javascript/controllers/clear_button_controller.js
44
+ - app/assets/images/x.svg
45
+ - app/javascript/controllers/reveal_button_controller.js
46
+ - app/assets/images/eye.svg
47
+ - app/assets/images/eye-off.svg
48
+ - app/javascript/controllers/copy_button_controller.js
49
+ - app/assets/images/copy.svg
35
50
  layouts:
36
51
  - app/assets/stylesheets/layouts.css
37
52
  - app/assets/images/menu.svg
53
+ lightbox:
54
+ - app/assets/stylesheets/lightbox.css
55
+ - app/javascript/controllers/lightbox_controller.js
56
+ - app/assets/images/download.svg
57
+ - app/assets/images/share.svg
58
+ - app/assets/images/x.svg
38
59
  pagination:
39
- - app/assets/stylesheets/pagination.css
40
60
  - app/assets/images/chevron-right.svg
41
61
  - app/assets/images/chevron-left.svg
42
62
  - app/assets/images/ellipsis.svg
@@ -50,6 +70,7 @@ sheet:
50
70
  - app/assets/images/x.svg
51
71
  skeleton:
52
72
  - app/assets/stylesheets/skeleton.css
73
+ - app/javascript/controllers/form_controller.js
53
74
  switch:
54
75
  - app/assets/stylesheets/switch.css
55
76
  table:
@@ -57,5 +78,12 @@ table:
57
78
  tabs:
58
79
  - app/assets/stylesheets/tabs.css
59
80
  - app/javascript/controllers/tabs_controller.js
81
+ upload_preview:
82
+ - app/javascript/controllers/upload_preview_controller.js
83
+ - app/assets/images/default-picture.webp
84
+ - app/assets/images/camera.svg
85
+ - app/assets/images/minus.svg
60
86
  toggle:
61
87
  - app/assets/stylesheets/toggle.css
88
+ web_share:
89
+ - app/javascript/controllers/web_share_controller.js
data/lib/generators/css_zero/add/templates/app/assets/images/camera.svg ADDED
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-camera"><path d="M14.5 4h-5L7 7H4a2 2 0 0 0-2 2v9a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2V9a2 2 0 0 0-2-2h-3l-2.5-3z"/><circle cx="12" cy="13" r="3"/></svg>
data/lib/generators/css_zero/add/templates/app/assets/images/chevron-down.svg CHANGED
@@ -1 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg>
data/lib/generators/css_zero/add/templates/app/assets/images/chevron-left.svg CHANGED
@@ -1 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m15 18-6-6 6-6"/></svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m15 18-6-6 6-6"/></svg>
data/lib/generators/css_zero/add/templates/app/assets/images/chevron-right.svg CHANGED
@@ -1 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m9 18 6-6-6-6"/></svg>
data/lib/generators/css_zero/add/templates/app/assets/images/circle-alert.svg CHANGED
@@ -1 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="12" x2="12" y1="8" y2="12"/><line x1="12" x2="12.01" y1="16" y2="16"/></svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"/><line x1="12" x2="12" y1="8" y2="12"/><line x1="12" x2="12.01" y1="16" y2="16"/></svg>
data/lib/generators/css_zero/add/templates/app/assets/images/copy.svg ADDED
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-copy"><rect width="14" height="14" x="8" y="8" rx="2" ry="2"/><path d="M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2"/></svg>
data/lib/generators/css_zero/add/templates/app/assets/images/download.svg ADDED
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-download"><path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" x2="12" y1="15" y2="3"/></svg>
data/lib/generators/css_zero/add/templates/app/assets/images/ellipsis.svg CHANGED
@@ -1 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="1"/><circle cx="19" cy="12" r="1"/><circle cx="5" cy="12" r="1"/></svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="1"/><circle cx="19" cy="12" r="1"/><circle cx="5" cy="12" r="1"/></svg>
data/lib/generators/css_zero/add/templates/app/assets/images/eye-off.svg ADDED
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-eye-off"><path d="M10.733 5.076a10.744 10.744 0 0 1 11.205 6.575 1 1 0 0 1 0 .696 10.747 10.747 0 0 1-1.444 2.49"/><path d="M14.084 14.158a3 3 0 0 1-4.242-4.242"/><path d="M17.479 17.499a10.75 10.75 0 0 1-15.417-5.151 1 1 0 0 1 0-.696 10.75 10.75 0 0 1 4.446-5.143"/><path d="m2 2 20 20"/></svg>
data/lib/generators/css_zero/add/templates/app/assets/images/eye.svg ADDED
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-eye"><path d="M2.062 12.348a1 1 0 0 1 0-.696 10.75 10.75 0 0 1 19.876 0 1 1 0 0 1 0 .696 10.75 10.75 0 0 1-19.876 0"/><circle cx="12" cy="12" r="3"/></svg>
data/lib/generators/css_zero/add/templates/app/assets/images/loader-circle.svg CHANGED
@@ -1 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12a9 9 0 1 1-6.219-8.56"/></svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12a9 9 0 1 1-6.219-8.56"/></svg>
data/lib/generators/css_zero/add/templates/app/assets/images/maximize.svg ADDED
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-maximize"><path d="M8 3H5a2 2 0 0 0-2 2v3"/><path d="M21 8V5a2 2 0 0 0-2-2h-3"/><path d="M3 16v3a2 2 0 0 0 2 2h3"/><path d="M16 21h3a2 2 0 0 0 2-2v-3"/></svg>
data/lib/generators/css_zero/add/templates/app/assets/images/minus.svg ADDED
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-minus"><path d="M5 12h14"/></svg>
data/lib/generators/css_zero/add/templates/app/assets/images/select-arrow.svg CHANGED
@@ -1 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#71717a" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#71717a" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="m6 9 6 6 6-6"/></svg>
data/lib/generators/css_zero/add/templates/app/assets/images/share.svg ADDED
@@ -0,0 +1 @@
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-share"><path d="M4 12v8a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2v-8"/><polyline points="16 6 12 2 8 6"/><line x1="12" x2="12" y1="2" y2="15"/></svg>
data/lib/generators/css_zero/add/templates/app/assets/images/x.svg CHANGED
@@ -1 +1 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>
1
+ <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="#000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M18 6 6 18"/><path d="m6 6 12 12"/></svg>
data/lib/generators/css_zero/add/templates/app/assets/stylesheets/avatar.css CHANGED
@@ -16,6 +16,23 @@
16
16
  }
17
17
  }
18
18
 
19
+ .avatar--btn {
20
+ cursor: pointer;
21
+
22
+ &:hover {
23
+ filter: var(--brightness-75);
24
+ }
25
+
26
+ &:focus-visible {
27
+ outline: var(--border-2) solid var(--color-selected-dark);
28
+ outline-offset: var(--border-2);
29
+ }
30
+
31
+ &:disabled {
32
+ pointer-events: none;
33
+ }
34
+ }
35
+
19
36
  .avatar__fallback {
20
37
  align-items: center;
21
38
  background-color: var(--color-border-light);
data/lib/generators/css_zero/add/templates/app/assets/stylesheets/badge.css CHANGED
@@ -1,31 +1,34 @@
1
1
  .badge {
2
- background-color: var(--badge-background, var(--color-primary));
2
+ background-color: var(--badge-background, var(--color-bg));
3
3
  border-radius: var(--rounded-full);
4
- border-width: var(--badge-border-width, 0);
5
- color: var(--badge-color, var(--color-text-reversed));
4
+ border: 1px solid var(--badge-border-color, var(--color-border));
5
+ color: var(--badge-color, var(--color-text));
6
6
  display: inline-flex;
7
7
  font-size: var(--text-xs);
8
8
  font-weight: var(--font-semibold);
9
9
  padding: var(--size-0_5) var(--size-2_5);
10
10
  }
11
11
 
12
- .badge--secondary {
13
- --badge-background: var(--color-secondary);
14
- --badge-color: var(--color-text);
12
+ .badge--primary {
13
+ --badge-background: var(--color-primary);
14
+ --badge-border-color: transparent;
15
+ --badge-color: var(--color-text-reversed);
15
16
  }
16
17
 
17
- .badge--outline {
18
- --badge-background: transparent;
19
- --badge-border-width: var(--border);
18
+ .badge--secondary {
19
+ --badge-background: var(--color-secondary);
20
+ --badge-border-color: transparent;
20
21
  --badge-color: var(--color-text);
21
22
  }
22
23
 
23
24
  .badge--positive {
24
25
  --badge-background: var(--color-positive);
26
+ --badge-border-color: transparent;
25
27
  --badge-color: white;
26
28
  }
27
29
 
28
30
  .badge--negative {
29
31
  --badge-background: var(--color-negative);
32
+ --badge-border-color: transparent;
30
33
  --badge-color: white;
31
34
  }
data/lib/generators/css_zero/add/templates/app/assets/stylesheets/breadcrumb.css CHANGED
@@ -4,7 +4,7 @@
4
4
  display: flex;
5
5
  flex-wrap: wrap;
6
6
  font-size: var(--text-sm);
7
- gap: var(--size-2_5);
7
+ gap: var(--size-2);
8
8
  overflow-wrap: break-word;
9
9
 
10
10
  img {
@@ -16,6 +16,6 @@
16
16
  }
17
17
 
18
18
  @media (width < 40rem) {
19
- gap: var(--size-1_5);
19
+ gap: var(--size-1);
20
20
  }
21
21
  }
data/lib/generators/css_zero/add/templates/app/assets/stylesheets/button.css CHANGED
@@ -1,9 +1,9 @@
1
1
  .btn {
2
2
  align-items: center;
3
- background-color: var(--btn-background, var(--color-primary));
4
- border-radius: var(--rounded-md);
5
- border-width: var(--btn-border-width, 0);
6
- color: var(--btn-color, var(--color-text-reversed));
3
+ background-color: var(--btn-background, var(--color-bg));
4
+ border-radius: var(--btn-radius, var(--rounded-md));
5
+ border: 1px solid var(--btn-border-color, var(--color-border));
6
+ color: var(--btn-color, var(--color-text));
7
7
  cursor: pointer;
8
8
  display: inline-flex;
9
9
  font-size: var(--text-sm);
@@ -11,11 +11,15 @@
11
11
  gap: var(--size-2);
12
12
  justify-content: center;
13
13
  white-space: nowrap;
14
- padding: var(--size-2) var(--size-4);
14
+ padding: var(--btn-padding, 0.5rem 1rem);
15
15
  text-align: center;
16
16
 
17
- img {
18
- filter: var(--btn-icon-color, var(--color-filter-text-reversed));
17
+ img:not([class]) {
18
+ filter: var(--btn-icon-color, var(--color-filter-text));
19
+ }
20
+
21
+ &:hover {
22
+ filter: var(--btn-filter-hover, var(--brightness-95));
19
23
  }
20
24
 
21
25
  &:focus-visible {
@@ -29,35 +33,49 @@
29
33
  }
30
34
  }
31
35
 
32
- .btn--secondary {
33
- --btn-background: var(--color-secondary);
34
- --btn-color: var(--color-text);
35
- --btn-icon-color: var(--color-filter-text);
36
+ .btn--primary {
37
+ --btn-background: var(--color-primary);
38
+ --btn-border-color: transparent;
39
+ --btn-color: var(--color-text-reversed);
40
+ --btn-icon-color: var(--color-filter-text-reversed);
36
41
  }
37
42
 
38
- .btn--outline {
39
- --btn-background: var(--color-bg);
40
- --btn-border-width: var(--border);
41
- --btn-color: var(--color-text);
42
- --btn-icon-color: var(--color-filter-text);
43
+ .btn--secondary {
44
+ --btn-background: var(--color-secondary);
45
+ --btn-border-color: transparent;
43
46
  }
44
47
 
45
- .btn--plain {
46
- --btn-background: transparent;
47
- --btn-color: var(--color-text);
48
- --btn-icon-color: var(--color-filter-text);
48
+ .btn--borderless {
49
+ --btn-border-color: transparent;
49
50
  }
50
51
 
51
52
  .btn--positive {
52
53
  --btn-background: var(--color-positive);
53
- --btn-color: white;
54
- --btn-icon-color: var(--color-filter-positive);
54
+ --btn-border-color: transparent;
55
+ --btn-color: var(--color-text-reversed);
56
+ --btn-icon-color: var(--color-filter-text-reversed);
55
57
  }
56
58
 
57
59
  .btn--negative {
58
60
  --btn-background: var(--color-negative);
59
- --btn-color: white;
60
- --btn-icon-color: var(--color-filter-negative);
61
+ --btn-border-color: transparent;
62
+ --btn-color: var(--color-text-reversed);
63
+ --btn-icon-color: var(--color-filter-text-reversed);
64
+ }
65
+
66
+ .btn--plain {
67
+ --btn-background: transparent;
68
+ --btn-border-color: transparent;
69
+ --btn-padding: 0;
70
+ }
71
+
72
+ .btn--rounded {
73
+ --btn-padding: var(--size-2);
74
+ --btn-radius: var(--rounded-full);
75
+ }
76
+
77
+ .btn--pressed:active {
78
+ opacity: var(--opacity-50);
61
79
  }
62
80
 
63
81
  [aria-busy] .btn--loading:disabled {
@@ -66,7 +84,7 @@
66
84
  }
67
85
 
68
86
  &::after {
69
- filter: var(--btn-icon-color, var(--color-filter-text-reversed));
87
+ filter: var(--btn-icon-color, var(--color-filter-text));
70
88
  }
71
89
 
72
90
  &::after {
data/lib/generators/css_zero/add/templates/app/assets/stylesheets/input.css CHANGED
@@ -50,11 +50,6 @@
50
50
 
51
51
  /* Containers that act like (and contain) inputs */
52
52
  .input--actor {
53
- &:has(:-webkit-autofill) {
54
- -webkit-text-fill-color: var(--color-text);
55
- -webkit-box-shadow: 0 0 0px 1000px var(--color-selected) inset;
56
- }
57
-
58
53
  &:focus-within {
59
54
  outline: var(--border-2) solid var(--color-selected-dark);
60
55
  outline-offset: var(--border-2);
data/lib/generators/css_zero/add/templates/app/assets/stylesheets/layouts.css CHANGED
@@ -1,4 +1,4 @@
1
- .layout-sidebar {
1
+ .sidebar-layout {
2
2
  display: grid;
3
3
  grid-template-areas: "header header" "sidebar main";
4
4
  grid-template-columns: var(--sidebar-width, 0) 1fr;
@@ -18,15 +18,15 @@
18
18
  @media (width >= 48rem) { display: none; }
19
19
  }
20
20
 
21
- .layout-pancake {
21
+ .pancake-stack {
22
22
  display: grid;
23
23
  grid-template-rows: auto 1fr auto;
24
24
  min-block-size: 100dvh;
25
25
  }
26
26
 
27
- .layout-centered {
27
+ .super-centered {
28
28
  display: grid;
29
- place-content: center;
29
+ place-items: center;
30
30
  min-block-size: 100dvh;
31
31
  }
32
32
 
data/lib/generators/css_zero/add/templates/app/assets/stylesheets/lightbox.css ADDED
@@ -0,0 +1,41 @@
1
+ :root {
2
+ --lightbox-padding: var(--size-4);
3
+ }
4
+
5
+ .lightbox {
6
+ background-color: rgba(0, 0, 0, .8);
7
+ block-size: 100dvh;
8
+ max-block-size: unset;
9
+ inline-size: 100dvw;
10
+ max-inline-size: unset;
11
+ padding: var(--lightbox-padding);
12
+
13
+ &[open] {
14
+ display: grid;
15
+ place-items: center;
16
+ }
17
+ }
18
+
19
+ .lightbox__close {
20
+ align-self: start;
21
+ grid-area: 1/1;
22
+ justify-self: end;
23
+ }
24
+
25
+ .lightbox__download {
26
+ align-self: end;
27
+ grid-area: 1/1;
28
+ justify-self: end;
29
+ }
30
+
31
+ .lightbox__share {
32
+ align-self: start;
33
+ grid-area: 1/1;
34
+ justify-self: start;
35
+ }
36
+
37
+ .lightbox__image {
38
+ grid-area: 1/1;
39
+ max-inline-size: calc(100dvw - (var(--lightbox-padding) * 2));
40
+ max-block-size: calc(100dvh - (var(--lightbox-padding) * 2));
41
+ }
data/lib/generators/css_zero/add/templates/app/assets/stylesheets/sheet.css CHANGED
@@ -6,7 +6,7 @@
6
6
  color: var(--color-text);
7
7
  inline-size: var(--size-3-4);
8
8
  margin-inline: var(--sheet-margin);
9
- max-block-size: none;
9
+ max-block-size: unset;
10
10
  max-inline-size: var(--width-sm);
11
11
 
12
12
  &::backdrop {
data/lib/generators/css_zero/add/templates/app/assets/stylesheets/skeleton.css CHANGED
@@ -2,4 +2,4 @@
2
2
  animation: var(--animate-blink);
3
3
  border-radius: var(--rounded-md);
4
4
  background-color: var(--color-border-light);
5
- }
5
+ }
data/lib/generators/css_zero/add/templates/app/assets/stylesheets/tabs.css CHANGED
@@ -14,13 +14,16 @@
14
14
  padding: var(--size-1);
15
15
 
16
16
  button {
17
- background-color: transparent;
18
- color: var(--color-text-subtle);
19
17
  inline-size: var(--size-full);
20
18
  }
21
19
 
20
+ button {
21
+ --btn-background: transparent;
22
+ --btn-border-color: transparent;
23
+ --btn-filter-hover: none;
24
+ }
25
+
22
26
  button[aria-selected=true] {
23
- background-color: var(--color-bg);
24
- color: var(--color-text);
27
+ --btn-background: var(--color-bg);
25
28
  }
26
29
  }
data/lib/generators/css_zero/add/templates/app/assets/stylesheets/toggle.css CHANGED
@@ -1,16 +1,16 @@
1
1
  .toggle {
2
2
  display: inline-flex;
3
3
 
4
- &:has(:focus-visible) .btn {
5
- outline: var(--border-2) solid var(--color-selected-dark);
6
- outline-offset: var(--border-2);
7
- }
8
-
9
4
  [type="checkbox"] {
10
5
  position: absolute; clip: rect(0, 0, 0, 0);
11
6
  }
12
7
 
13
- [type="checkbox"]:checked + .btn {
8
+ &:has([type="checkbox"]:checked) {
14
9
  --btn-background: var(--color-secondary);
15
10
  }
11
+
12
+ &:has(:focus-visible) {
13
+ outline: var(--border-2) solid var(--color-selected-dark);
14
+ outline-offset: var(--border-2);
15
+ }
16
16
  }
data/lib/generators/css_zero/add/templates/app/javascript/controllers/autoselect_controller.js ADDED
@@ -0,0 +1,11 @@
1
+ import { Controller } from "@hotwired/stimulus"
2
+
3
+ export default class extends Controller {
4
+ connect() {
5
+ if (this.autoselect) this.element.select()
6
+ }
7
+
8
+ get autoselect() {
9
+ return this.element.autofocus
10
+ }
11
+ }
data/lib/generators/css_zero/add/templates/app/javascript/controllers/carousel_controller.js CHANGED
@@ -9,7 +9,7 @@ export default class extends Controller {
9
9
 
10
10
  previous() {
11
11
  this.contentTarget.scrollTo({ left: this.#scrollLeft - this.#slideSize, behavior: "smooth" })
12
- }
12
+ }
13
13
 
14
14
  get #scrollLeft() {
15
15
  return this.contentTarget.scrollLeft
data/lib/generators/css_zero/add/templates/app/javascript/controllers/check_all_controller.js ADDED
@@ -0,0 +1,9 @@
1
+ import { Controller } from "@hotwired/stimulus"
2
+
3
+ export default class extends Controller {
4
+ static targets = [ "dependent" ]
5
+
6
+ check({target}) {
7
+ this.dependentTargets.forEach(element => element.checked = target.checked)
8
+ }
9
+ }
data/lib/generators/css_zero/add/templates/app/javascript/controllers/clear_button_controller.js ADDED
@@ -0,0 +1,9 @@
1
+ import { Controller } from "@hotwired/stimulus"
2
+
3
+ export default class extends Controller {
4
+ static targets = [ "input" ]
5
+
6
+ clear() {
7
+ this.inputTarget.value = ""
8
+ }
9
+ }
data/lib/generators/css_zero/add/templates/app/javascript/controllers/copy_button_controller.js ADDED
@@ -0,0 +1,13 @@
1
+ import { Controller } from "@hotwired/stimulus"
2
+
3
+ export default class extends Controller {
4
+ static targets = [ "input" ]
5
+
6
+ async copy() {
7
+ try {
8
+ await navigator.clipboard.writeText(this.inputTarget.value)
9
+ } catch (error) {
10
+ console.warn(error.message);
11
+ }
12
+ }
13
+ }
data/lib/generators/css_zero/add/templates/app/javascript/controllers/dialog_controller.js CHANGED
@@ -1,18 +1,18 @@
1
1
  import { Controller } from "@hotwired/stimulus"
2
2
 
3
3
  export default class extends Controller {
4
- static targets = [ "box" ]
4
+ static targets = [ "menu" ]
5
5
 
6
6
  show() {
7
- this.boxTarget.show()
7
+ this.menuTarget.show()
8
8
  }
9
9
 
10
10
  showModal() {
11
- this.boxTarget.showModal()
11
+ this.menuTarget.showModal()
12
12
  }
13
13
 
14
14
  close() {
15
- this.boxTarget.close()
15
+ this.menuTarget.close()
16
16
  }
17
17
 
18
18
  closeOnClickOutside({ target }) {
data/lib/generators/css_zero/add/templates/app/javascript/controllers/form_controller.js ADDED
@@ -0,0 +1,13 @@
1
+ import { Controller } from "@hotwired/stimulus"
2
+
3
+ export default class extends Controller {
4
+ static targets = [ "cancel" ]
5
+
6
+ submit() {
7
+ this.element.requestSubmit()
8
+ }
9
+
10
+ cancel() {
11
+ this.cancelTarget?.click()
12
+ }
13
+ }
data/lib/generators/css_zero/add/templates/app/javascript/controllers/fullscreen_controller.js ADDED
@@ -0,0 +1,33 @@
1
+ import { Controller } from "@hotwired/stimulus"
2
+
3
+ export default class extends Controller {
4
+ static targets = [ "button" ]
5
+
6
+ connect() {
7
+ if (this.hasButtonTarget) this.#hideButtonIfNotSupported()
8
+ }
9
+
10
+ toggle() {
11
+ this.#fullScreenMode ? this.#exitFullscreen() : this.#requestFullscreen()
12
+ }
13
+
14
+ #hideButtonIfNotSupported() {
15
+ this.buttonTarget.hidden = !this.#supportsFullScreen
16
+ }
17
+
18
+ #exitFullscreen() {
19
+ document.exitFullscreen()
20
+ }
21
+
22
+ #requestFullscreen() {
23
+ document.documentElement.requestFullscreen()
24
+ }
25
+
26
+ get #supportsFullScreen() {
27
+ return this.element.requestFullscreen
28
+ }
29
+
30
+ get #fullScreenMode() {
31
+ return document.fullscreenElement
32
+ }
33
+ }
data/lib/generators/css_zero/add/templates/app/javascript/controllers/hotkey_controller.js ADDED
@@ -0,0 +1,17 @@
1
+ import { Controller } from "@hotwired/stimulus"
2
+
3
+ export default class extends Controller {
4
+ click(event) {
5
+ if (this.#isClickable && !this.#shouldIgnore(event)) {
6
+ this.element.click()
7
+ }
8
+ }
9
+
10
+ #shouldIgnore(event) {
11
+ return event.defaultPrevented || event.target.closest("input, textarea")
12
+ }
13
+
14
+ get #isClickable() {
15
+ return getComputedStyle(this.element).pointerEvents !== "none"
16
+ }
17
+ }
data/lib/generators/css_zero/add/templates/app/javascript/controllers/lightbox_controller.js ADDED
@@ -0,0 +1,26 @@
1
+ import { Controller } from "@hotwired/stimulus"
2
+
3
+ export default class extends Controller {
4
+ static targets = [ "dialog", "zoomedImage", "download", "share" ]
5
+
6
+ show(event) {
7
+ this.dialogTarget.showModal()
8
+ this.#set(event.target.parentNode)
9
+ }
10
+
11
+ close() {
12
+ this.dialogTarget.close()
13
+ }
14
+
15
+ reset() {
16
+ this.zoomedImageTarget.src = ""
17
+ this.downloadTarget.href = ""
18
+ this.shareTarget.dataset.webShareFileValue = "";
19
+ }
20
+
21
+ #set(target) {
22
+ this.zoomedImageTarget.src = target.href
23
+ this.downloadTarget.href = target.dataset.lightboxUrlValue;
24
+ this.shareTarget.dataset.webShareFileValue = target.dataset.lightboxUrlValue;
25
+ }
26
+ }
data/lib/generators/css_zero/add/templates/app/javascript/controllers/reveal_button_controller.js ADDED
@@ -0,0 +1,19 @@
1
+ import { Controller } from "@hotwired/stimulus"
2
+
3
+ export default class extends Controller {
4
+ static targets = [ "input", "image" ]
5
+ static values = { showImage: String, hideImage: String }
6
+
7
+ reveal() {
8
+ this.inputTarget.type = this.#inputType
9
+ this.imageTarget.src = this.#imageSrc
10
+ }
11
+
12
+ get #inputType() {
13
+ return this.inputTarget.type === "text" ? "password" : "text"
14
+ }
15
+
16
+ get #imageSrc() {
17
+ return this.inputTarget.type === "text" ? this.hideImageValue : this.showImageValue
18
+ }
19
+ }
data/lib/generators/css_zero/add/templates/app/javascript/controllers/tabs_controller.js CHANGED
@@ -2,24 +2,23 @@ import { Controller } from "@hotwired/stimulus"
2
2
 
3
3
  export default class extends Controller {
4
4
  static targets = [ "button", "tab" ]
5
- static values = { selected: String }
5
+ static values = { index: Number, default: 0 }
6
6
 
7
- initialize() {
8
- this.#showSelectedTab()
7
+ select({ target }) {
8
+ this.indexValue = target.dataset.index
9
9
  }
10
10
 
11
- select({ target }) {
12
- this.selectedValue = target.dataset.value
11
+ indexValueChanged() {
13
12
  this.#showSelectedTab()
14
13
  }
15
14
 
16
15
  #showSelectedTab() {
17
- this.buttonTargets.forEach(element => {
18
- element.ariaSelected = element.dataset.value === this.selectedValue
16
+ this.buttonTargets.forEach((element, index) => {
17
+ element.ariaSelected = index === this.indexValue
19
18
  })
20
19
 
21
- this.tabTargets.forEach(element => {
22
- element.hidden = element.id !== this.selectedValue
20
+ this.tabTargets.forEach((element, index) => {
21
+ element.hidden = index !== this.indexValue
23
22
  })
24
23
  }
25
24
  }
data/lib/generators/css_zero/add/templates/app/javascript/controllers/upload_preview_controller.js ADDED
@@ -0,0 +1,21 @@
1
+ import { Controller } from "@hotwired/stimulus"
2
+
3
+ export default class extends Controller {
4
+ static targets = [ "image", "input", "removeInput" ]
5
+ static values = { defaultImage: String }
6
+
7
+ previewImage() {
8
+ const selectedFile = this.inputTarget.files[0]
9
+
10
+ if (selectedFile) {
11
+ this.imageTarget.src = URL.createObjectURL(selectedFile);
12
+ this.imageTarget.onload = () => { URL.revokeObjectURL(this.imageTarget.src) }
13
+ this.removeInputTarget.value = false
14
+ }
15
+ }
16
+
17
+ clear() {
18
+ this.imageTarget.src = this.defaultImageValue
19
+ this.removeInputTarget.value = true
20
+ }
21
+ }
data/lib/generators/css_zero/add/templates/app/javascript/controllers/web_share_controller.js ADDED
@@ -0,0 +1,42 @@
1
+ import { Controller } from "@hotwired/stimulus"
2
+
3
+ export default class extends Controller {
4
+ static values = { title: String, text: String, url: String, file: String }
5
+
6
+ #applicationName = 'MyApplication'
7
+
8
+ connect() {
9
+ this.element.hidden = !navigator.canShare
10
+ }
11
+
12
+ async share() {
13
+ try {
14
+ await navigator.share(await this.#getShareData())
15
+ } catch(error) {
16
+ console.warn(error.message);
17
+ }
18
+ }
19
+
20
+ async #getShareData() {
21
+ const data = { title: this.titleValue, text: this.textValue }
22
+
23
+ if (this.urlValue) {
24
+ data.url = this.urlValue
25
+ }
26
+
27
+ if (this.fileValue) {
28
+ data.files = [ await this.#getFileObject()]
29
+ }
30
+
31
+ return data;
32
+ }
33
+
34
+ async #getFileObject() {
35
+ const response = await fetch(this.fileValue)
36
+ const blob = await response.blob()
37
+ const randomPrefix = `${this.#applicationName}_${Math.random().toString(36).slice(2)}`
38
+ const fileName = `${randomPrefix}.${blob.type.split('/').pop()}`
39
+
40
+ return new File([ blob ], fileName, { type: blob.type })
41
+ }
42
+ }
data/lib/generators/css_zero/install/templates/app/assets/stylesheets/base.css CHANGED
@@ -40,8 +40,8 @@
40
40
  /* Accent colors */
41
41
  --color-primary: var(--zinc-50);
42
42
  --color-secondary: var(--zinc-800);
43
- --color-negative: var(--red-900);
44
- --color-positive: var(--green-900);
43
+ --color-negative: var(--red-400);
44
+ --color-positive: var(--green-400);
45
45
 
46
46
  /* SVG color values */
47
47
  --color-filter-text: invert(100%);
@@ -70,8 +70,3 @@ body {
70
70
  ::selection {
71
71
  background-color: var(--color-selected);
72
72
  }
73
-
74
- :-webkit-autofill {
75
- -webkit-text-fill-color: var(--color-text);
76
- -webkit-box-shadow: 0 0 0px 1000px var(--color-selected) inset;
77
- }
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.35
4
+ version: 0.0.36
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-09-10 00:00:00.000000000 Z
11
+ date: 2024-09-23 00:00:00.000000000 Z
12
12
  dependencies: []
13
13
  description:
14
14
  email: lazaronixon@hotmail.com
@@ -37,14 +37,23 @@ files:
37
37
  - lib/generators/css_zero/add/resources.yml
38
38
  - lib/generators/css_zero/add/templates/app/assets/images/arrow-left.svg
39
39
  - lib/generators/css_zero/add/templates/app/assets/images/arrow-right.svg
40
+ - lib/generators/css_zero/add/templates/app/assets/images/camera.svg
40
41
  - lib/generators/css_zero/add/templates/app/assets/images/chevron-down.svg
41
42
  - lib/generators/css_zero/add/templates/app/assets/images/chevron-left.svg
42
43
  - lib/generators/css_zero/add/templates/app/assets/images/chevron-right.svg
43
44
  - lib/generators/css_zero/add/templates/app/assets/images/circle-alert.svg
45
+ - lib/generators/css_zero/add/templates/app/assets/images/copy.svg
46
+ - lib/generators/css_zero/add/templates/app/assets/images/default-picture.webp
47
+ - lib/generators/css_zero/add/templates/app/assets/images/download.svg
44
48
  - lib/generators/css_zero/add/templates/app/assets/images/ellipsis.svg
49
+ - lib/generators/css_zero/add/templates/app/assets/images/eye-off.svg
50
+ - lib/generators/css_zero/add/templates/app/assets/images/eye.svg
45
51
  - lib/generators/css_zero/add/templates/app/assets/images/loader-circle.svg
52
+ - lib/generators/css_zero/add/templates/app/assets/images/maximize.svg
46
53
  - lib/generators/css_zero/add/templates/app/assets/images/menu.svg
54
+ - lib/generators/css_zero/add/templates/app/assets/images/minus.svg
47
55
  - lib/generators/css_zero/add/templates/app/assets/images/select-arrow.svg
56
+ - lib/generators/css_zero/add/templates/app/assets/images/share.svg
48
57
  - lib/generators/css_zero/add/templates/app/assets/images/x.svg
49
58
  - lib/generators/css_zero/add/templates/app/assets/stylesheets/accordion.css
50
59
  - lib/generators/css_zero/add/templates/app/assets/stylesheets/alert.css
@@ -58,7 +67,7 @@ files:
58
67
  - lib/generators/css_zero/add/templates/app/assets/stylesheets/flash.css
59
68
  - lib/generators/css_zero/add/templates/app/assets/stylesheets/input.css
60
69
  - lib/generators/css_zero/add/templates/app/assets/stylesheets/layouts.css
61
- - lib/generators/css_zero/add/templates/app/assets/stylesheets/pagination.css
70
+ - lib/generators/css_zero/add/templates/app/assets/stylesheets/lightbox.css
62
71
  - lib/generators/css_zero/add/templates/app/assets/stylesheets/progress.css
63
72
  - lib/generators/css_zero/add/templates/app/assets/stylesheets/prose.css
64
73
  - lib/generators/css_zero/add/templates/app/assets/stylesheets/sheet.css
@@ -67,11 +76,22 @@ files:
67
76
  - lib/generators/css_zero/add/templates/app/assets/stylesheets/table.css
68
77
  - lib/generators/css_zero/add/templates/app/assets/stylesheets/tabs.css
69
78
  - lib/generators/css_zero/add/templates/app/assets/stylesheets/toggle.css
79
+ - lib/generators/css_zero/add/templates/app/javascript/controllers/autoselect_controller.js
70
80
  - lib/generators/css_zero/add/templates/app/javascript/controllers/carousel_controller.js
81
+ - lib/generators/css_zero/add/templates/app/javascript/controllers/check_all_controller.js
82
+ - lib/generators/css_zero/add/templates/app/javascript/controllers/clear_button_controller.js
71
83
  - lib/generators/css_zero/add/templates/app/javascript/controllers/collapsible_controller.js
84
+ - lib/generators/css_zero/add/templates/app/javascript/controllers/copy_button_controller.js
72
85
  - lib/generators/css_zero/add/templates/app/javascript/controllers/dialog_controller.js
73
86
  - lib/generators/css_zero/add/templates/app/javascript/controllers/element_removal_controller.js
87
+ - lib/generators/css_zero/add/templates/app/javascript/controllers/form_controller.js
88
+ - lib/generators/css_zero/add/templates/app/javascript/controllers/fullscreen_controller.js
89
+ - lib/generators/css_zero/add/templates/app/javascript/controllers/hotkey_controller.js
90
+ - lib/generators/css_zero/add/templates/app/javascript/controllers/lightbox_controller.js
91
+ - lib/generators/css_zero/add/templates/app/javascript/controllers/reveal_button_controller.js
74
92
  - lib/generators/css_zero/add/templates/app/javascript/controllers/tabs_controller.js
93
+ - lib/generators/css_zero/add/templates/app/javascript/controllers/upload_preview_controller.js
94
+ - lib/generators/css_zero/add/templates/app/javascript/controllers/web_share_controller.js
75
95
  - lib/generators/css_zero/install/USAGE
76
96
  - lib/generators/css_zero/install/install_generator.rb
77
97
  - lib/generators/css_zero/install/templates/app/assets/stylesheets/base.css
data/lib/generators/css_zero/add/templates/app/assets/stylesheets/pagination.css DELETED
@@ -1,32 +0,0 @@
1
- :where(.pagination) {
2
- align-items: center;
3
- display: flex;
4
- gap: var(--size-1);
5
-
6
- img {
7
- filter: var(--color-filter-text);
8
- }
9
-
10
- a {
11
- align-items: center;
12
- border-radius: var(--rounded-md);
13
- display: inline-flex;
14
- font-size: var(--text-sm);
15
- font-weight: var(--font-medium);
16
- gap: var(--size-2);
17
- justify-content: center;
18
- padding: var(--size-2) var(--size-4);
19
- }
20
-
21
- a:is([aria-current]) {
22
- border-width: var(--border);
23
- }
24
-
25
- a:is([aria-disabled]) {
26
- pointer-events: none;
27
- }
28
-
29
- a:not([aria-disabled]):hover {
30
- background-color: var(--color-border-light);
31
- }
32
- }