css-zero 0.0.35 → 0.0.37

Sign up to get free protection for your applications and to get access to all the features.
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 +11 -3
  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/clearable_input_controller.js +9 -0
  39. data/lib/generators/css_zero/add/templates/app/javascript/controllers/copyable_input_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/revealable_input_controller.js +19 -0
  46. data/lib/generators/css_zero/add/templates/app/javascript/controllers/tabs_controller.js +19 -8
  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: 8d03cbc1032455ed1426a832bd3f71fcc6091275b6a6a75fa1d2111cf0105f24
4
+ data.tar.gz: e4aae85c8fdcea540a262ae0de03546c367afabb6a3bbb0e769eceff328e3a2b
5
5
  SHA512:
6
- metadata.gz: 39143697d27bd095e2c9c238ad36f69dec5d6733113a58096e14c454ea2dddc5f295a7a1b2035875447e7173da89fbebfc06488c8f4f4a9ef23739270e339c6c
7
- data.tar.gz: df3d03f4cc537150251d0971108a2ae0a2c26f7e07f6a40b1474bdab48c64aa629b483a0092b7d4ee1a493b2eaaeea82bb02a779cad3c926096b889736480322
6
+ metadata.gz: eae8de16d7008f3c47960c19a90840e236b9846505b3e988d20c10c41f21e5319200bb10b1fd0154d9dc61072bddb479efd8369597c9051bd1724ac32b64ecb0
7
+ data.tar.gz: 8fcecce58a61bfa94b08879bd9338357988cb217da22c3398f6832b2a2842fc2d0802c9403502b70f80531dc7100b6d8fd591d0dc10211c4ba2185f994494c6e
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.37"
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/copyable_input_controller.js
44
+ - app/javascript/controllers/clearable_input_controller.js
45
+ - app/javascript/controllers/revealable_input_controller.js
46
+ - app/assets/images/copy.svg
47
+ - app/assets/images/eye.svg
48
+ - app/assets/images/eye-off.svg
49
+ - app/assets/images/x.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
@@ -4,11 +4,19 @@ export default class extends Controller {
4
4
  static targets = [ "content" ]
5
5
 
6
6
  next() {
7
- this.contentTarget.scrollTo({ left: this.#scrollLeft + this.#slideSize, behavior: "smooth" })
7
+ this.contentTarget.scrollTo({ left: this.#nextPosition, behavior: "smooth" })
8
8
  }
9
9
 
10
- previous() {
11
- this.contentTarget.scrollTo({ left: this.#scrollLeft - this.#slideSize, behavior: "smooth" })
10
+ prev() {
11
+ this.contentTarget.scrollTo({ left: this.#prevPosition, behavior: "smooth" })
12
+ }
13
+
14
+ get #nextPosition() {
15
+ return this.#scrollLeft + this.#slideSize
16
+ }
17
+
18
+ get #prevPosition() {
19
+ return this.#scrollLeft - this.#slideSize
12
20
  }
13
21
 
14
22
  get #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/clearable_input_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/copyable_input_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/revealable_input_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,35 @@ 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() {
7
+ indexValueChanged() {
8
8
  this.#showSelectedTab()
9
9
  }
10
10
 
11
11
  select({ target }) {
12
- this.selectedValue = target.dataset.value
13
- this.#showSelectedTab()
12
+ this.indexValue = target.dataset.index
13
+ }
14
+
15
+ prev() {
16
+ if (this.indexValue > 0) this.indexValue--
17
+ }
18
+
19
+ next() {
20
+ if (this.indexValue < this.#lastIndex) this.indexValue++
21
+ }
22
+
23
+ get #lastIndex() {
24
+ return this.tabTargets.length -1
14
25
  }
15
26
 
16
27
  #showSelectedTab() {
17
- this.buttonTargets.forEach(element => {
18
- element.ariaSelected = element.dataset.value === this.selectedValue
28
+ this.buttonTargets.forEach((element, index) => {
29
+ element.ariaSelected = index === this.indexValue
19
30
  })
20
31
 
21
- this.tabTargets.forEach(element => {
22
- element.hidden = element.id !== this.selectedValue
32
+ this.tabTargets.forEach((element, index) => {
33
+ element.hidden = index !== this.indexValue
23
34
  })
24
35
  }
25
36
  }
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.37
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/clearable_input_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/copyable_input_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/revealable_input_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
- }