ably-ui 8.7.0.dev.681c3bf → 8.7.0.dev.734c219

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 (12) hide show
  1. checksums.yaml +4 -4
  2. data/Gemfile.lock +1 -1
  3. data/lib/ably_ui/core/featured_link/component.css +1 -1
  4. data/lib/ably_ui/core/footer/component.css +3 -3
  5. data/lib/ably_ui/core/footer/footer.html.erb +13 -13
  6. data/lib/ably_ui/core/meganav/component.css +7 -7
  7. data/lib/ably_ui/core/meganav_content_platform/meganav_content_platform.html.erb +1 -1
  8. data/lib/ably_ui/core/notice/component.css +1 -1
  9. data/lib/ably_ui/core/notice/notice.html.erb +2 -2
  10. data/lib/ably_ui/core/styles.css +136 -42
  11. data/lib/ably_ui/version.rb +1 -1
  12. metadata +2 -2
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: d19470e367925355335cb422fb67f614fd6e3dc6d50ad7a884d6fe225c410bc8
4
- data.tar.gz: 2948e82b9cba761c77fb2335ea53a3db78171c465c494e26337ab6f9be9ac836
3
+ metadata.gz: 36806061b50991c766671144fc54e7a4ccfcff4beac769153f696f2a38e43da8
4
+ data.tar.gz: e20a19439b7ab8e037be595fd85ea1681556b415763d22bc10b56e97b84e0033
5
5
  SHA512:
6
- metadata.gz: b153d1ffe774071639a6a05656cee2afe58eb3e9cd444f271f3aafe518b4942adc2e7e4c3aab4172a9b7cb8928e55972683bdf9bbbddffc9da8ee9ab11fc4b66
7
- data.tar.gz: 416d39a9089d92450f0fd2772f108bdfabb22b9e5b0f0cdcfa20183a379077c1573dd3f839272b363e53e5b3eccf19cb8dfe0daf42e14079f4fcf524806741f8
6
+ metadata.gz: c7628360e305be71a88986700a807acfcf3d3de2a156d60167391159db3a3716b4d8d707fbe3cd42e43192287790b881a2a73471bec01c21eb56916902c8b4ce
7
+ data.tar.gz: 145e3281c62a1a5cb1f4791e530a11aa42c4a3ead2f50097e88b7a92286ccb4ab3e23cb6fa54c670260b33d0e227a0d78c65bc1ddbe90119d598029c5491a573
data/Gemfile.lock CHANGED
@@ -1,7 +1,7 @@
1
1
  PATH
2
2
  remote: .
3
3
  specs:
4
- ably-ui (8.7.0.dev.bf010f7)
4
+ ably-ui (8.7.0.dev.2b71529)
5
5
  view_component (>= 2.33, < 2.50)
6
6
 
7
7
  GEM
data/lib/ably_ui/core/featured_link/component.css CHANGED
@@ -1,6 +1,6 @@
1
1
  @layer components {
2
2
  .ui-featured-link {
3
- @apply font-sans font-medium block;
3
+ @apply font-manrope font-bold block;
4
4
  @apply text-gui-default hover:text-gui-hover focus:text-gui-focus focus:outline-gui-focus;
5
5
  }
6
6
 
data/lib/ably_ui/core/footer/component.css CHANGED
@@ -1,14 +1,14 @@
1
1
  @layer components {
2
2
  .ui-footer-col-title {
3
- @apply text-overline2 p-menu-row-title font-normal uppercase tracking-widen-0.1;
3
+ @apply font-jetbrains_mono text-overline2 p-menu-row-title font-medium uppercase tracking-widen-0.16;
4
4
  }
5
5
 
6
6
  .ui-footer-menu-row-link {
7
- @apply text-menu3 text-cool-black font-light hover:text-gui-hover block;
7
+ @apply text-menu3 text-cool-black font-manrope font-medium hover:text-gui-hover block;
8
8
  }
9
9
 
10
10
  .ui-footer-link {
11
- @apply text-gui-default hover:text-gui-hover text-menu3 font-light;
11
+ @apply text-gui-default hover:text-gui-hover text-menu3 font-manrope font-medium;
12
12
  }
13
13
 
14
14
  .ui-footer-compliance-text {
data/lib/ably_ui/core/footer/footer.html.erb CHANGED
@@ -1,12 +1,12 @@
1
- <footer class="bg-light-grey font-sans antialiased" data-id="footer">
1
+ <footer class="bg-light-grey font-manrope antialiased leading-normal" data-id="footer">
2
2
  <div class="max-w-screen-xl mx-auto py-32 sm:py-40 md:py-64 ui-grid-gap ui-grid-px grid grid-cols-6">
3
3
  <div class="col-span-full md:col-span-2">
4
4
  <div class="flex flex-row p-menu-row-snug">
5
5
  <%= image_tag(ably_stack_path, alt: "Ably homepage", class: "mr-24 -mt-16") %>
6
- <h2 class="text-overline2 col-span-full font-medium uppercase tracking-widen-0.1">The Ably Platform</h2>
6
+ <h2 class="text-overline2 col-span-full font-jetbrains_mono font-bold uppercase tracking-widen-0.16">The Ably Platform</h2>
7
7
  </div>
8
8
  <div class="md:col-span-4 md:w-3/4 xs:w-3/5 w-full">
9
- <p class="text-p3 py-16 font-medium p-menu-row-snug">
9
+ <p class="font-manrope text-p3 py-16 font-bold p-menu-row-snug">
10
10
  Easily power any realtime experience in your application via a simple API that handles everything realtime.
11
11
  </p>
12
12
  </div>
@@ -180,7 +180,7 @@
180
180
  >
181
181
  <%= render(AblyUi::Core::Icon.new(name: "glassdoor", size: "1.5rem")) %>
182
182
  </a>
183
- <div class="pl-16 text-menu3 font-light">
183
+ <div class="pl-16 text-menu3 font-manrope font-medium">
184
184
  <strong class="block font-medium">We&apos;re hiring!</strong>
185
185
  <a href="https://www.glassdoor.co.uk/Overview/Working-at-Ably-EI_IE2184188.11,15.htm" class="ui-footer-link">
186
186
  Learn more at Glassdoor
@@ -200,7 +200,7 @@
200
200
  >
201
201
  <%= render(AblyUi::Core::Icon.new(name: "glassdoor", size: "1.5rem")) %>
202
202
  </a>
203
- <div class="text-menu3 font-light">
203
+ <div class="text-menu3 font-manrope font-medium">
204
204
  <strong class="block font-medium">We&apos;re hiring!</strong>
205
205
  <a href="https://www.glassdoor.co.uk/Overview/Working-at-Ably-EI_IE2184188.11,15.htm" class="ui-footer-link">
206
206
  Learn more at Glassdoor
@@ -231,29 +231,29 @@
231
231
  <div class="flex mr-24">
232
232
  <%= render(AblyUi::Core::Icon.new(name: "icon-gui-tick", color: "text-active-orange", size: "1.5rem", additional_css:"bg-white rounded-full mr-12 ui-footer-tick-icon")) %>
233
233
  <div>
234
- <p class="ui-footer-compliance-text font-medium whitespace-nowrap">SOC 2 Type 2</p>
235
- <p class="ui-footer-compliance-text font-light mb-24">Certified</p>
234
+ <p class="ui-footer-compliance-text font-bold whitespace-nowrap">SOC 2 Type 2</p>
235
+ <p class="ui-footer-compliance-text font-medium mb-24">Certified</p>
236
236
  </div>
237
237
  </div>
238
238
  <div class="flex mr-24 md:col-start-2">
239
239
  <%= render(AblyUi::Core::Icon.new(name: "icon-gui-tick", color: "text-active-orange", size: "1.5rem", additional_css:"bg-white rounded-full mr-12 ui-footer-tick-icon")) %>
240
240
  <div>
241
- <p class="ui-footer-compliance-text font-medium whitespace-nowrap">HIPAA</p>
242
- <p class="ui-footer-compliance-text font-light mb-24">Compliant</p>
241
+ <p class="ui-footer-compliance-text font-bold whitespace-nowrap">HIPAA</p>
242
+ <p class="ui-footer-compliance-text font-medium mb-24">Compliant</p>
243
243
  </div>
244
244
  </div>
245
245
  <div class="flex mr-24 md:col-start-3">
246
246
  <%= render(AblyUi::Core::Icon.new(name: "icon-gui-tick", color: "text-active-orange", size: "1.5rem", additional_css:"bg-white rounded-full mr-12 ui-footer-tick-icon")) %>
247
247
  <div>
248
- <p class="ui-footer-compliance-text font-medium whitespace-nowrap">EU GDPR</p>
249
- <p class="ui-footer-compliance-text font-light mb-24">Certified</p>
248
+ <p class="ui-footer-compliance-text font-bold whitespace-nowrap">EU GDPR</p>
249
+ <p class="ui-footer-compliance-text font-medium mb-24">Certified</p>
250
250
  </div>
251
251
  </div>
252
252
  <div class="flex mr-24 md:col-start-4">
253
253
  <%= render(AblyUi::Core::Icon.new(name: "icon-gui-tick", color: "text-active-orange", size: "1.5rem", additional_css:"bg-white rounded-full mr-12 ui-footer-tick-icon")) %>
254
254
  <div>
255
- <p class="ui-footer-compliance-text font-medium whitespace-nowrap">256-bit AES</p>
256
- <p class="ui-footer-compliance-text font-light mb-24">Encryption</p>
255
+ <p class="ui-footer-compliance-text font-bold whitespace-nowrap">256-bit AES</p>
256
+ <p class="ui-footer-compliance-text font-medium mb-24">Encryption</p>
257
257
  </div>
258
258
  </div>
259
259
  </div>
data/lib/ably_ui/core/meganav/component.css CHANGED
@@ -7,7 +7,7 @@
7
7
  z-index: var(--stacking-context-page-meganav);
8
8
 
9
9
  @apply fixed top-0 w-full;
10
- @apply antialiased font-sans transition-colors;
10
+ @apply antialiased font-manrope transition-colors;
11
11
  }
12
12
 
13
13
  .ui-meganav {
@@ -51,7 +51,7 @@
51
51
  }
52
52
 
53
53
  .ui-meganav-link {
54
- @apply text-menu2 font-medium block;
54
+ @apply text-menu2 font-bold block font-manrope;
55
55
  @apply mr-12 lg:mr-24 px-0 py-20;
56
56
  @apply hover:text-gui-hover focus:text-gui-focus focus:outline-none;
57
57
  @apply transition-colors;
@@ -63,13 +63,13 @@
63
63
 
64
64
  .ui-meganav-mobile-link {
65
65
  @apply p-menu-row relative -left-8 w-extend-8;
66
- @apply text-menu2 font-medium block text-cool-black text-left;
66
+ @apply text-menu2 font-bold font-jetbrains_mono font-medium block text-cool-black text-left;
67
67
  @apply flex items-center;
68
68
  @apply focus:text-gui-focus focus:outline-none;
69
69
  }
70
70
 
71
71
  .ui-meganav-account-link {
72
- @apply block px-8 py-8 hover:bg-light-grey hover:text-gui-hover rounded relative -left-8 text-menu3 w-extend-8 font-light;
72
+ @apply block px-8 py-8 hover:bg-light-grey hover:text-gui-hover rounded relative -left-8 text-menu3 w-extend-8 font-bold font-jetbrains_mono;
73
73
  }
74
74
 
75
75
  .ui-meganav-content {
@@ -97,15 +97,15 @@
97
97
  }
98
98
 
99
99
  .ui-meganav-media-heading {
100
- @apply text-menu3 text-cool-black font-medium group-hover:text-gui-hover group-focus:text-gui-focus;
100
+ @apply text-menu3 text-cool-black font-bold font-manrope group-hover:text-gui-hover group-focus:text-gui-focus leading-normal;
101
101
  }
102
102
 
103
103
  .ui-meganav-media-copy {
104
- @apply text-p3 text-dark-grey font-light;
104
+ @apply text-p3 font-manrope font-medium text-dark-grey leading-normal;
105
105
  }
106
106
 
107
107
  .ui-meganav-overline {
108
- @apply text-overline2 text-cool-black uppercase font-medium tracking-widen-0.15 p-overline;
108
+ @apply text-overline2 text-cool-black uppercase font-bold font-jetbrains_mono tracking-widen-0.16 p-overline;
109
109
  }
110
110
 
111
111
  .ui-meganav-hr {
data/lib/ably_ui/core/meganav_content_platform/meganav_content_platform.html.erb CHANGED
@@ -7,7 +7,7 @@
7
7
  <h3 class="ui-meganav-overline ml-24">The Ably Platform</h3>
8
8
  </div>
9
9
 
10
- <p class="text-p2 font-medium text-cool-black mb-24" style="max-width: 330px">
10
+ <p class="text-p2 font-bold text-cool-black mb-24 leading-normal" style="max-width: 330px">
11
11
  Easily power any realtime experience in your application. No complex infrastructure to manage or provision. Just a simple API that handles everything
12
12
  realtime, and lets you focus on your code.
13
13
  </p>
data/lib/ably_ui/core/notice/component.css CHANGED
@@ -1,6 +1,6 @@
1
1
  @layer components {
2
2
  .ui-announcement {
3
- @apply font-sans;
3
+ @apply font-manrope;
4
4
  max-height: 37.5rem;
5
5
  transition: max-height 300ms;
6
6
  }
data/lib/ably_ui/core/notice/notice.html.erb CHANGED
@@ -1,8 +1,8 @@
1
1
  <%# Note the style attribute is used for entry animation %>
2
2
  <%= tag.div class: "ui-announcement #{bg_color} #{text_color}", data: { id: "ui-notice" }, style: "max-height: 0; overflow: hidden" do %>
3
3
  <div class="ui-grid-px py-16 max-w-screen-xl mx-auto flex items-start">
4
- <%= content_wrapper class: "font-light w-full pr-8 text-p3 self-center" do %>
5
- <strong class="font-medium whitespace-nowrap pr-4"><%= @contents[:title] %></strong>
4
+ <%= content_wrapper class: "font-medium w-full pr-8 text-p3 self-center" do %>
5
+ <strong class="font-bold whitespace-nowrap pr-4"><%= @contents[:title] %></strong>
6
6
  <span class="pr-4"><%= @contents[:body_text] %></span>
7
7
  <span class="underline cursor-pointer whitespace-nowrap"><%= @contents[:button_label] %></span>
8
8
  <% end %>
data/lib/ably_ui/core/styles.css CHANGED
@@ -1,37 +1,132 @@
1
1
  @layer base {
2
2
  :root {
3
- --color-cool-black: #03020d;
4
- --color-active-orange: #ff5416;
5
- --color-red-orange: #e40000;
6
- --color-white: #ffffff;
7
- --color-electric-cyan: #4ad4ff;
8
- --color-zingy-green: #08ff13;
9
- --color-bright-red: #fe372b;
10
- --color-jazzy-pink: #ff17d2;
11
- --color-extra-light-grey: #f8fafc;
12
- --color-light-grey: #f4f8fb;
13
- --color-mid-grey: #c6ced9;
14
- --color-dark-grey: #667085;
15
- --color-charcoal-grey: #2b303b;
16
- --color-gui-default: #006edc;
17
- --color-gui-hover: #0862b9;
18
- --color-gui-active: #074095;
19
- --color-gui-default-dark: #4da6ff;
20
- --color-gui-hover-dark: #2894ff;
21
- --color-gui-active-dark: #0080ff;
3
+ /* Neutral colors */
4
+ --color-neutral-000: #ffffff;
5
+ --color-neutral-100: #f8fafc;
6
+ --color-neutral-200: #f4f8fb;
7
+ --color-neutral-300: #edf1f7;
8
+ --color-neutral-400: #e2e7ef;
9
+ --color-neutral-500: #c6ced9;
10
+ --color-neutral-600: #adb6c2;
11
+ --color-neutral-700: #89929f;
12
+ --color-neutral-800: #667085;
13
+ --color-neutral-900: #39414e;
14
+ --color-neutral-1000: #2b303b;
15
+ --color-neutral-1100: #202531;
16
+ --color-neutral-1200: #141924;
17
+ --color-neutral-1300: #03020d;
18
+
19
+ /* Ably orange */
20
+ --color-orange-100: #fff5f1;
21
+ --color-orange-200: #ffe3d8;
22
+ --color-orange-300: #ffc4ae;
23
+ --color-orange-400: #ff9c79;
24
+ --color-orange-500: #ff723f;
25
+ --color-orange-600: #ff5416;
26
+ --color-orange-700: #ff2739;
27
+ --color-orange-800: #e40000;
28
+ --color-orange-900: #b82202;
29
+ --color-orange-1000: #751500;
30
+ --color-orange-1100: #2a0b00;
31
+
32
+ /* Secondary colours */
33
+ --color-yellow-100: #fffbef;
34
+ --color-yellow-200: #fff0ba;
35
+ --color-yellow-300: #ffe27c;
36
+ --color-yellow-400: #ffd43d;
37
+ --color-yellow-500: #f8c100;
38
+ --color-yellow-600: #e8a700;
39
+ --color-yellow-700: #ac8600;
40
+ --color-yellow-800: #654f00;
41
+ --color-yellow-900: #291c01;
42
+ --color-green-100: #f1fff1;
43
+ --color-green-200: #b8ffbb;
44
+ --color-green-300: #80ff85;
45
+ --color-green-400: #08ff13;
46
+ --color-green-500: #00e80b;
47
+ --color-green-600: #00c008;
48
+ --color-green-700: #008e06;
49
+ --color-green-800: #005303;
50
+ --color-green-900: #002a02;
51
+ --color-blue-100: #f1fbff;
52
+ --color-blue-200: #b8eaff;
53
+ --color-blue-300: #80d9ff;
54
+ --color-blue-400: #4ad4ff;
55
+ --color-blue-500: #2cc0ff;
56
+ --color-blue-600: #00a5ec;
57
+ --color-blue-700: #0284cd;
58
+ --color-blue-800: #004b75;
59
+ --color-blue-900: #001b2a;
60
+ --color-violet-100: #f7f2fe;
61
+ --color-violet-200: #d8bcfb;
62
+ --color-violet-300: #b986f8;
63
+ --color-violet-400: #9951f5;
64
+ --color-violet-500: #7a1bf2;
65
+ --color-violet-600: #5f0bc9;
66
+ --color-violet-700: #460894;
67
+ --color-violet-800: #2d055e;
68
+ --color-violet-900: #130228;
69
+ --color-pink-100: #fff1fc;
70
+ --color-pink-200: #ffb8f1;
71
+ --color-pink-300: #ff80e6;
72
+ --color-pink-400: #ff47db;
73
+ --color-pink-500: #ff17d2;
74
+ --color-pink-600: #d400ab;
75
+ --color-pink-700: #9c007e;
76
+ --color-pink-800: #630050;
77
+ --color-pink-900: #2a0022;
78
+
79
+ /* GUI colours */
80
+ /* Note: The ‘Light and ‘Dark’ refers to the colour of the background on which the colour is used. */
81
+ --color-gui-blue-default-light: #006edc;
82
+ --color-gui-blue-hover-light: #0862b9;
83
+ --color-gui-blue-active-light: #074095;
84
+ --color-gui-blue-default-dark: #4da6ff;
85
+ --color-gui-blue-hover-dark: #2894ff;
86
+ --color-gui-blue-active-dark: #0080ff;
87
+ --color-gui-blue-focus: #80b9f2;
88
+ --color-gui-unavailable: #a8a8a8;
89
+ --color-gui-success-green: #11cb24;
90
+ --color-gui-error-red: #fb0c0c;
22
91
  --color-gui-focus: #80b9f2;
23
92
  --color-gui-focus-outline: #80b9f2;
24
93
  --color-gui-visited: #4887c2;
25
- --color-gui-unavailable: #a8a8a8;
26
- --color-gui-error: #fb0c0c;
27
- --color-gui-success: #11cb24;
94
+
95
+ /* Colours replaced by neutral colours */
96
+ --color-white: var(--color-neutral-000);
97
+ --color-extra-light-grey: var(--color-neutral-100);
98
+ --color-light-grey: var(--color-neutral-200);
99
+ --color-mid-grey: var(--color-neutral-500);
100
+ --color-dark-grey: var(--color-neutral-800);
101
+ --color-charcoal-grey: var(--color-neutral-1000);
102
+ --color-cool-black: var(--color-neutral-1300);
103
+
104
+ /* Colours replaced by orange colours */
105
+ --color-active-orange: var(--color-orange-600);
106
+ --color-bright-red: var(--color-orange-700);
107
+ --color-red-orange: var(--color-orange-800);
108
+
109
+ /* Colours replaced by secondary colours */
110
+ --color-electric-cyan: var(--color-blue-400);
111
+ --color-zingy-green: var(--color-green-400);
112
+ --color-jazzy-pink: var(--color-pink-500);
113
+
114
+ /* Colours replaced by GUI colours */
115
+ --color-gui-default: var(--color-gui-blue-default-light);
116
+ --color-gui-hover: var(--color-gui-blue-hover-light);
117
+ --color-gui-active: var(--color-gui-blue-active-light);
118
+ --color-gui-error: var(--color-gui-error-red);
119
+ --color-gui-success: var(--color-gui-success-green);
120
+ --color-gui-default-dark: var(--color-gui-blue-default-dark);
121
+ --color-gui-hover-dark: var(--color-gui-blue-hover-dark);
122
+ --color-gui-active-dark: var(--color-gui-blue-active-dark);
28
123
 
29
124
  /* code syntax: theme */
30
- --syntax-black: var(--color-cool-black);
31
- --syntax-dark-grey: var(--color-dark-grey);
32
- --syntax-mid-grey: var(--color-mid-grey);
33
- --syntax-light-grey: var(--color-light-grey);
34
- --syntax-extra-light-grey: var(--color-extra-light-grey);
125
+ --syntax-black: var(--color-neutral-1300);
126
+ --syntax-dark-grey: var(--color-neutral-800);
127
+ --syntax-mid-grey: var(--color-neutral-500);
128
+ --syntax-light-grey: var(--color-neutral-200);
129
+ --syntax-extra-light-grey: var(--color-neutral-100);
35
130
  --syntax-orange: #e78c45;
36
131
  --syntax-yellow: #e7c547;
37
132
  --syntax-blue: #3490ec;
@@ -39,10 +134,6 @@
39
134
  --syntax-red: #d54e53;
40
135
  --syntax-lilac: #bb87d3;
41
136
 
42
- /* New Neutral colors */
43
- --color-neutral-900: #39414e;
44
- --color-neutral-500: #c6ced9;
45
-
46
137
  /* uptime status colors */
47
138
  --uptime-color-up: #39b54a;
48
139
  --uptime-color-trouble: #e87623;
@@ -77,7 +168,7 @@
77
168
 
78
169
  --gradient-hot-pink: linear-gradient(
79
170
  80.2deg,
80
- var(--color-bright-red) 0%,
171
+ var(--color-orange-700) 0%,
81
172
  var(--color-jazzy-pink) 100%
82
173
  );
83
174
 
@@ -118,8 +209,10 @@
118
209
  --lh-dense: 1;
119
210
  --lh-tight: 1.125;
120
211
  --lh-snug: 1.15;
212
+ --lh-min-normal: 1.2;
121
213
  --lh-normal: 1.25;
122
214
  --lh-relaxed: 1.45;
215
+ --lh-extra-relaxed: 1.6;
123
216
 
124
217
  --ls-tighten-0_025: -0.025em;
125
218
  --ls-tighten-0_02: -0.02em;
@@ -395,40 +488,40 @@
395
488
 
396
489
  .ui-text-quote {
397
490
  @apply font-manrope font-normal text-cool-black;
398
- @apply text-quote;
491
+ @apply text-quote leading-normal;
399
492
  @apply tracking-tighten-0.0015;
400
493
  }
401
494
 
402
495
  .ui-text-sub-header {
403
- @apply font-manrope font-semibold text-neutral-900;
404
- @apply text-sub-header-xs xs:text-sub-header;
496
+ @apply font-manrope font-semibold text-neutral-800;
497
+ @apply text-sub-header-xs xs:text-sub-header leading-normal;
405
498
  }
406
499
 
407
500
  .ui-text-overline1 {
408
501
  @apply font-jetbrains_mono font-medium text-active-orange uppercase;
409
- @apply text-overline1;
502
+ @apply text-overline1 leading-normal;
410
503
  @apply tracking-widen-0.16;
411
504
  }
412
505
 
413
506
  .ui-text-overline2 {
414
507
  @apply font-jetbrains_mono font-medium text-active-orange uppercase;
415
- @apply text-overline2;
508
+ @apply text-overline2 leading-normal;
416
509
  @apply tracking-widen-0.16;
417
510
  }
418
511
 
419
512
  .ui-text-menu1 {
420
513
  @apply font-manrope font-medium text-cool-black;
421
- @apply text-menu1;
514
+ @apply text-menu1 leading-snug;
422
515
  }
423
516
 
424
517
  .ui-text-menu2 {
425
518
  @apply font-manrope font-medium text-cool-black;
426
- @apply text-menu2;
519
+ @apply text-menu2 leading-snug;
427
520
  }
428
521
 
429
522
  .ui-text-menu3 {
430
523
  @apply font-manrope font-medium text-cool-black;
431
- @apply text-menu3;
524
+ @apply text-menu3 leading-snug;
432
525
  }
433
526
 
434
527
  .ui-text-code {
@@ -476,7 +569,8 @@
476
569
 
477
570
  .ui-ordered-list li,
478
571
  .ui-unordered-list li {
479
- @apply font-medium font-manrope tracking-widen-0 leading-relaxed;
572
+ @apply font-medium font-manrope tracking-widen-0;
573
+ line-height: var(--lh-extra-relaxed);
480
574
  }
481
575
 
482
576
  .ui-unordered-list-with-emphasis {
@@ -539,7 +633,7 @@
539
633
 
540
634
  .ui-checkbox-label-p1 {
541
635
  @apply select-none;
542
- @apply text-p1 font-light text-cool-black;
636
+ @apply text-p1 font-medium text-cool-black;
543
637
  }
544
638
 
545
639
  .ui-checkbox-label-p2 {
data/lib/ably_ui/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module AblyUi
2
- VERSION = '8.7.0.dev.681c3bf'
2
+ VERSION = '8.7.0.dev.734c219'
3
3
  end
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: ably-ui
3
3
  version: !ruby/object:Gem::Version
4
- version: 8.7.0.dev.681c3bf
4
+ version: 8.7.0.dev.734c219
5
5
  platform: ruby
6
6
  authors:
7
7
  - Dominik Piatek
@@ -10,7 +10,7 @@ authors:
10
10
  autorequire:
11
11
  bindir: bin
12
12
  cert_chain: []
13
- date: 2023-06-15 00:00:00.000000000 Z
13
+ date: 2023-08-11 00:00:00.000000000 Z
14
14
  dependencies:
15
15
  - !ruby/object:Gem::Dependency
16
16
  name: view_component