css-zero 0.0.79 → 0.0.81

Sign up to get free protection for your applications and to get access to all the features.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: ac5381f999fc236eaa78ad29eb8a89ee368cbb1414740bf14fbda48793a74118
4
- data.tar.gz: dfbd29593d603f29321d5a015a1016af4868b5d0ffaf0161bf7a3161de227684
3
+ metadata.gz: '093a0bb191b8b84a8caa29e3a141fba1cf4680150a26960134fa63fd06b42294'
4
+ data.tar.gz: d1e303641e4f440a1ac65545946bbaff931ad31cdb49150bf7cdd270ecf2e3b3
5
5
  SHA512:
6
- metadata.gz: 7fc56726cef33481158b4aca435b109b8f277ab1079e1c1efbcf6067d9101d47ef8bc25ea27df22ecadb3c5363186e0b1530ebc04f8c19fcee40b97001a5952f
7
- data.tar.gz: 2d3edb86abcd3440ab003b4cd57981a5e28776113ddd1cccd9a83df20a2270627b25899e0dc0e00cd87b198403ac932388ace41276c030fd7465abae73d6f463
6
+ metadata.gz: 5f54e73025fb075cfe9b876f3c7ea4ce83e4687053a8595034459cd2ef59aea41c8e44869929a9840bacac3eef4d5f9ed963982d155930790d559b651faa4951
7
+ data.tar.gz: 584b223cf4b28bf706a1ebeab29b750dbbf1207aa0014285d7662106ec1ea9135b7f7b85502e5735cd9e432583f61649f045c7b08db96b22db31dd61b6fda5b3
@@ -18,17 +18,17 @@
18
18
  --text-8xl: 6rem; /* 96px */
19
19
  --text-9xl: 8rem; /* 128px */
20
20
 
21
- --text-xs-responsive: clamp(0.75rem, 0.64rem + 0.57vw, 1rem); /* 12px..16px */
22
- --text-sm-responsive: clamp(0.875rem, 0.761rem + 0.568vw, 1.125rem); /* 14px..18px */
23
- --text-base-responsive: clamp(1rem, 0.89rem + 0.57vw, 1.25rem); /* 16px..20px */
24
- --text-lg-responsive: clamp(1.125rem, 0.955rem + 0.852vw, 1.5rem); /* 18px..24px */
25
- --text-xl-responsive: clamp(1.25rem, 0.966rem + 1.42vw, 1.875rem); /* 20px..30px */
26
- --text-2xl-responsive: clamp(1.5rem, 1.16rem + 1.7vw, 2.25rem); /* 24px..36px */
27
- --text-3xl-responsive: clamp(1.875rem, 1.364rem + 2.557vw, 3rem); /* 30px..48px */
28
- --text-4xl-responsive: clamp(2.25rem, 1.57rem + 3.41vw, 3.75rem); /* 36px..60px */
29
- --text-5xl-responsive: clamp(3rem, 2.32rem + 3.41vw, 4.5rem); /* 48px..72px */
30
- --text-6xl-responsive: clamp(3.75rem, 2.73rem + 5.11vw, 6rem); /* 60px..96px */
31
- --text-7xl-responsive: clamp(4.5rem, 2.91rem + 7.95vw, 8rem); /* 72px..128px */
21
+ --text-fluid-xs: clamp(0.75rem, 0.64rem + 0.57vw, 1rem); /* 12px..16px */
22
+ --text-fluid-sm: clamp(0.875rem, 0.761rem + 0.568vw, 1.125rem); /* 14px..18px */
23
+ --text-fluid-base: clamp(1rem, 0.89rem + 0.57vw, 1.25rem); /* 16px..20px */
24
+ --text-fluid-lg: clamp(1.125rem, 0.955rem + 0.852vw, 1.5rem); /* 18px..24px */
25
+ --text-fluid-xl: clamp(1.25rem, 0.966rem + 1.42vw, 1.875rem); /* 20px..30px */
26
+ --text-fluid-2xl: clamp(1.5rem, 1.16rem + 1.7vw, 2.25rem); /* 24px..36px */
27
+ --text-fluid-3xl: clamp(1.875rem, 1.364rem + 2.557vw, 3rem); /* 30px..48px */
28
+ --text-fluid-4xl: clamp(2.25rem, 1.57rem + 3.41vw, 3.75rem); /* 36px..60px */
29
+ --text-fluid-5xl: clamp(3rem, 2.32rem + 3.41vw, 4.5rem); /* 48px..72px */
30
+ --text-fluid-6xl: clamp(3.75rem, 2.73rem + 5.11vw, 6rem); /* 60px..96px */
31
+ --text-fluid-7xl: clamp(4.5rem, 2.91rem + 7.95vw, 8rem); /* 72px..128px */
32
32
 
33
33
  /****************************************************************
34
34
  * Font Weight
@@ -77,15 +77,14 @@
77
77
  .text-3xl { font-size: var(--text-3xl); }
78
78
  .text-4xl { font-size: var(--text-4xl); }
79
79
  .text-5xl { font-size: var(--text-5xl); }
80
- .text-6xl { font-size: var(--text-6xl); }
81
- .text-7xl { font-size: var(--text-7xl); }
82
- .text-8xl { font-size: var(--text-8xl); }
83
- .text-9xl { font-size: var(--text-9xl); }
84
-
85
- .text-sm--responsive { font-size: var(--text-sm-responsive); }
86
- .text-base--responsive { font-size: var(--text-base-responsive); }
87
- .text-lg--responsive { font-size: var(--text-lg-responsive); }
88
- .text-xl--responsive { font-size: var(--text-xl-responsive); }
80
+
81
+ .text-fluid-xs { font-size: var(--text-fluid-xs); }
82
+ .text-fluid-sm { font-size: var(--text-fluid-sm); }
83
+ .text-fluid-base { font-size: var(--text-fluid-base); }
84
+ .text-fluid-lg { font-size: var(--text-fluid-lg); }
85
+ .text-fluid-xl { font-size: var(--text-fluid-xl); }
86
+ .text-fluid-2xl { font-size: var(--text-fluid-2xl); }
87
+ .text-fluid-3xl { font-size: var(--text-fluid-3xl); }
89
88
 
90
89
  /****************************************************************
91
90
  * Background
@@ -1,3 +1,3 @@
1
1
  module CssZero
2
- VERSION = "0.0.79"
2
+ VERSION = "0.0.81"
3
3
  end
@@ -1,14 +1,20 @@
1
+ .carousel {
2
+ align-items: center;
3
+ display: flex;
4
+ gap: var(--size-4);
5
+ }
6
+
1
7
  .carousel__content {
2
8
  display: flex;
3
9
  gap: var(--size-6);
4
10
  inline-size: var(--size-full);
5
11
  overflow: hidden;
6
- padding: var(--size-1);
7
12
  scroll-snap-type: x mandatory;
13
+ }
8
14
 
9
- > * {
10
- flex: 0 0 var(--carousel-item-size, 100%);
11
- scroll-snap-stop: always;
12
- scroll-snap-align: start;
13
- }
15
+ .carousel__item {
16
+ flex: 0 0 var(--carousel-item-size, 100%);
17
+ padding: var(--size-1);
18
+ scroll-snap-stop: always;
19
+ scroll-snap-align: start;
14
20
  }
@@ -6,7 +6,7 @@
6
6
  border-radius: var(--rounded-full);
7
7
  color: var(--color-text-reversed);
8
8
  display: flex;
9
- font-size: var(--text-base-responsive);
9
+ font-size: var(--text-fluid-base);
10
10
  gap: var(--size-2);
11
11
  justify-content: center;
12
12
  line-height: var(--leading-none);
@@ -7,11 +7,13 @@
7
7
 
8
8
  @media (width >= 48rem) {
9
9
  --sidebar-border-width: var(--border);
10
+ --sidebar-padding: var(--size-2);
10
11
  --sidebar-width: 220px;
11
12
  }
12
13
 
13
14
  @media (width >= 64rem) {
14
15
  --sidebar-border-width: var(--border);
16
+ --sidebar-padding: var(--size-2);
15
17
  --sidebar-width: 280px;
16
18
  }
17
19
  }
@@ -54,7 +56,7 @@
54
56
  grid-area: sidebar;
55
57
  gap: var(--size-2);
56
58
  overflow-x: hidden;
57
- padding: var(--size-2);
59
+ padding: var(--sidebar-padding, 0);
58
60
  }
59
61
 
60
62
  #main {
@@ -25,3 +25,7 @@
25
25
  }
26
26
  }
27
27
  }
28
+
29
+ .popover--tooltip {
30
+ font-size: var(--text-sm); padding: var(--size-1_5) var(--size-3);
31
+ }
@@ -1,5 +1,5 @@
1
1
  :where(.prose) {
2
- font-size: var(--text-base-responsive);
2
+ font-size: var(--text-fluid-base);
3
3
  max-inline-size: 65ch;
4
4
 
5
5
  /* Antialiased fonts */
@@ -4,11 +4,11 @@ import { computePosition, flip, shift, offset, autoUpdate } from "https://cdn.sk
4
4
  export default class extends Controller {
5
5
  static targets = [ "button", "menu" ]
6
6
  static values = { placement: { type: String, default: "bottom" } }
7
-
7
+
8
8
  initialize() {
9
9
  this.orient = this.orient.bind(this)
10
10
  }
11
-
11
+
12
12
  connect() {
13
13
  this.cleanup = autoUpdate(this.buttonTarget, this.menuTarget, this.orient)
14
14
  }
@@ -16,11 +16,15 @@ export default class extends Controller {
16
16
  disconnect() {
17
17
  this.cleanup()
18
18
  }
19
-
19
+
20
20
  show() {
21
21
  this.menuTarget.showPopover()
22
22
  }
23
23
 
24
+ showLater() {
25
+ setTimeout(() => this.show(), 700)
26
+ }
27
+
24
28
  hide() {
25
29
  this.menuTarget.hidePopover()
26
30
  }
@@ -30,7 +34,7 @@ export default class extends Controller {
30
34
  Object.assign(this.menuTarget.style, { insetInlineStart: `${x}px`, insetBlockStart: `${y}px` })
31
35
  })
32
36
  }
33
-
37
+
34
38
  get #options() {
35
39
  return { placement: this.placementValue, middleware: [offset(4), flip(), shift({padding: 4})] }
36
40
  }
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.79
4
+ version: 0.0.81
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: 2025-01-05 00:00:00.000000000 Z
11
+ date: 2025-01-07 00:00:00.000000000 Z
12
12
  dependencies: []
13
13
  description:
14
14
  email: lazaronixon@hotmail.com