css-zero 0.0.46 → 0.0.47

Sign up to get free protection for your applications and to get access to all the features.
Files changed (10) hide show
  1. checksums.yaml +4 -4
  2. data/lib/css_zero/version.rb +1 -1
  3. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/button.css +1 -1
  4. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/command.css +9 -1
  5. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/input.css +5 -1
  6. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/menu.css +6 -1
  7. data/lib/generators/css_zero/add/templates/app/assets/stylesheets/tabs.css +1 -1
  8. data/lib/generators/css_zero/add/templates/app/javascript/controllers/menu_controller.js +13 -9
  9. data/lib/generators/css_zero/add/templates/app/javascript/controllers/tabs_controller.js +9 -6
  10. metadata +2 -2
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: e7ffebd97b488ac4e393dc73e07f275f26eb725047c9eaa38ae5d8e4b2b1f269
4
- data.tar.gz: dbf4888048ff67654e774494e939769966039ebbb9b3d81a1d528f1e9300c710
3
+ metadata.gz: e2efe1919888b0e11a440ada88d32d728814c3a96f67e877e87009836a5c9e3a
4
+ data.tar.gz: eac6e9c80a23b456a92dec265859959fadb0e34298904308714df91bb3220d84
5
5
  SHA512:
6
- metadata.gz: fdd78709eb65d56e40ba410ef5696658498cf0bd8038472b491c671bacf64d5566ad673b1489946b87f3aca0276f1dc2acfab6166db1227bb771f8d7cca3ed26
7
- data.tar.gz: 28b8fafdafc09e8ec66815b0a1c5461bca0d5209d35528d3ede1b0fdfc7818c518a0a73928c6841da64d60711f9b42e8152380ebab5314eac5c98b50ab9edcc4
6
+ metadata.gz: 9180e92a3179e523600fe9c2a1090a56fc1625798f9d261262f0d2fe6e998e11b777db777c9a3982d7ca76570bc8d43bc68c48efc6016879462adcd23c300cab
7
+ data.tar.gz: e05418691df476b525df12b6df0e4a1159947bc45cc21b3d2f7378dfb7767dd235bb20f3d4fdb4dd6c481851ac60b0d2255101b3f09dd01d323bdbd27a9d7acc
data/lib/css_zero/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module CssZero
2
- VERSION = "0.0.46"
2
+ VERSION = "0.0.47"
3
3
  end
data/lib/generators/css_zero/add/templates/app/assets/stylesheets/button.css CHANGED
@@ -69,7 +69,7 @@
69
69
  .btn--plain {
70
70
  --btn-background: transparent;
71
71
  --btn-border-color: transparent;
72
- --btn-hover-lightness: 100%;
72
+ --btn-hover-lightness: l;
73
73
  --btn-padding: 0;
74
74
  }
75
75
 
data/lib/generators/css_zero/add/templates/app/assets/stylesheets/command.css CHANGED
@@ -42,10 +42,15 @@
42
42
  .command__item {
43
43
  --btn-border-color: transparent;
44
44
  --btn-font-weight: var(--font-normal);
45
+ --btn-hover-lightness: l;
45
46
  --btn-justify-content: start;
46
47
  --btn-outline-size: 0;
47
48
  --btn-padding: var(--size-1_5) var(--size-2);
48
49
 
50
+ &:hover {
51
+ --btn-background: var(--color-secondary);
52
+ }
53
+
49
54
  &:focus-visible {
50
55
  --btn-background: var(--color-secondary);
51
56
  }
@@ -57,8 +62,11 @@
57
62
  margin-inline-start: auto;
58
63
  }
59
64
 
65
+ .command__list--filtering:not(:has(.selected)) {
66
+ .command__empty { display: flex; }
67
+ }
68
+
60
69
  .command__list--filtering {
61
- &:not(:has(.selected)) > .command__empty { display: flex; }
62
70
  .command__group { display: none; }
63
71
  .command__group:has(.selected) { display: flex; }
64
72
  .command__item { display: none; }
data/lib/generators/css_zero/add/templates/app/assets/stylesheets/input.css CHANGED
@@ -54,6 +54,10 @@
54
54
  border: 0; inline-size: 100%; outline: 0;
55
55
  }
56
56
 
57
+ img:not([class]) {
58
+ filter: var(--input-icon-color, var(--color-filter-text));
59
+ }
60
+
57
61
  &:focus-within {
58
62
  outline: var(--input-outline-size, 2px) solid var(--color-selected-dark);
59
63
  outline-offset: var(--border-2);
@@ -63,7 +67,7 @@
63
67
  /* Checkbox, radio, and range */
64
68
  .checkbox, .radio {
65
69
  accent-color: var(--color-primary);
66
- block-size: 18px; inline-size: 18px;
70
+ block-size: 16px; inline-size: 18px;
67
71
  }
68
72
 
69
73
  .range {
data/lib/generators/css_zero/add/templates/app/assets/stylesheets/menu.css CHANGED
@@ -23,11 +23,16 @@
23
23
  .menu__item {
24
24
  --btn-border-color: transparent;
25
25
  --btn-font-weight: var(--font-normal);
26
+ --btn-hover-lightness: l;
26
27
  --btn-justify-content: start;
27
28
  --btn-outline-size: 0;
28
29
  --btn-padding: var(--size-1_5) var(--size-2);
29
30
 
30
- &:focus {
31
+ &:hover {
32
+ --btn-background: var(--color-secondary);
33
+ }
34
+
35
+ &:focus-visible {
31
36
  --btn-background: var(--color-secondary);
32
37
  }
33
38
  }
data/lib/generators/css_zero/add/templates/app/assets/stylesheets/tabs.css CHANGED
@@ -11,7 +11,7 @@
11
11
  .btn--tab {
12
12
  --btn-background: transparent;
13
13
  --btn-border-color: transparent;
14
- --btn-hover-lightness: 100%;
14
+ --btn-hover-lightness: l;
15
15
  --btn-inline-size: var(--size-full);
16
16
 
17
17
  &[aria-selected=true] {
data/lib/generators/css_zero/add/templates/app/javascript/controllers/menu_controller.js CHANGED
@@ -2,32 +2,36 @@ import { Controller } from "@hotwired/stimulus"
2
2
 
3
3
  export default class extends Controller {
4
4
  static targets = [ "item" ]
5
- static values = { index: { type: Number, default: -1 } }
5
+ static values = { index: Number }
6
6
 
7
- indexValueChanged(index) {
7
+ indexValueChanged() {
8
8
  this.#removeTabstops()
9
- this.#focusCurrentItem(index !== -1)
10
9
  }
11
10
 
12
11
  prev() {
13
- this.indexValue > 0 && this.indexValue--
12
+ const hasPrevious = this.indexValue > 0
13
+ hasPrevious && this.indexValue--
14
+ hasPrevious && this.#focusCurrentItem()
14
15
  }
15
16
 
16
17
  next() {
17
- this.indexValue < this.#lastIndex && this.indexValue++
18
+ const hasNext = this.indexValue < this.#lastIndex
19
+ hasNext && this.indexValue++
20
+ hasNext && this.#focusCurrentItem()
18
21
  }
19
22
 
20
23
  reset() {
21
- this.indexValue = -1
24
+ this.indexValue = 0
25
+ this.#focusCurrentItem()
22
26
  }
23
27
 
24
28
  #removeTabstops() {
25
29
  this.itemTargets.forEach(item => item.tabIndex = -1)
26
30
  }
27
31
 
28
- #focusCurrentItem(shouldFocus) {
29
- if (shouldFocus) this.itemTargets[this.indexValue].tabIndex = 0
30
- if (shouldFocus) this.itemTargets[this.indexValue].focus()
32
+ #focusCurrentItem() {
33
+ this.itemTargets[this.indexValue].tabIndex = 0
34
+ this.itemTargets[this.indexValue].focus()
31
35
  }
32
36
 
33
37
  get #lastIndex() {
data/lib/generators/css_zero/add/templates/app/javascript/controllers/tabs_controller.js CHANGED
@@ -4,9 +4,8 @@ export default class extends Controller {
4
4
  static targets = [ "button", "tab" ]
5
5
  static values = { index: Number }
6
6
 
7
- indexValueChanged(index, previousIndex) {
7
+ indexValueChanged() {
8
8
  this.#showCurrentTab()
9
- this.#focusCurrentButton(previousIndex !== undefined)
10
9
  }
11
10
 
12
11
  select({ target }) {
@@ -14,11 +13,15 @@ export default class extends Controller {
14
13
  }
15
14
 
16
15
  prev() {
17
- this.indexValue > 0 && this.indexValue--
16
+ const hasPrevious = this.indexValue > 0
17
+ hasPrevious && this.indexValue--
18
+ hasPrevious && this.#focusCurrentButton()
18
19
  }
19
20
 
20
21
  next() {
21
- this.indexValue < this.#lastIndex && this.indexValue++
22
+ const hasNext = this.indexValue < this.#lastIndex
23
+ hasNext && this.indexValue++
24
+ hasNext && this.#focusCurrentButton()
22
25
  }
23
26
 
24
27
  #showCurrentTab() {
@@ -32,8 +35,8 @@ export default class extends Controller {
32
35
  })
33
36
  }
34
37
 
35
- #focusCurrentButton(shouldFocus) {
36
- shouldFocus && this.buttonTargets[this.indexValue].focus()
38
+ #focusCurrentButton() {
39
+ this.buttonTargets[this.indexValue].focus()
37
40
  }
38
41
 
39
42
  get #lastIndex() {
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.46
4
+ version: 0.0.47
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-10-14 00:00:00.000000000 Z
11
+ date: 2024-10-15 00:00:00.000000000 Z
12
12
  dependencies: []
13
13
  description:
14
14
  email: lazaronixon@hotmail.com