ably-ui 8.7.0.dev.fa55b85 → 8.7.0.dev.fba161a
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.
- checksums.yaml +4 -4
- data/Gemfile.lock +6 -6
- data/README.md +15 -4
- data/lib/ably_ui/core/code/component.css +2 -0
- data/lib/ably_ui/core/code/component.js +1 -1
- data/lib/ably_ui/core/company_autocomplete/component.js +1 -1
- data/lib/ably_ui/core/connect_state_wrapper/component.js +1 -1
- data/lib/ably_ui/core/contact_footer/component.js +1 -1
- data/lib/ably_ui/core/cookie_message/component.js +1 -1
- data/lib/ably_ui/core/core.rb +12 -4
- data/lib/ably_ui/core/customer_logos/component.js +1 -1
- data/lib/ably_ui/core/dropdown_menu/component.js +1 -1
- data/lib/ably_ui/core/feature_footer/component.js +1 -1
- data/lib/ably_ui/core/featured_link/component.css +1 -1
- data/lib/ably_ui/core/featured_link/component.js +1 -1
- data/lib/ably_ui/core/flash/component.js +1 -1
- data/lib/ably_ui/core/fonts/jetBrains-mono.css +3 -0
- data/lib/ably_ui/core/fonts/manrope.css +3 -0
- data/lib/ably_ui/core/footer/component.css +23 -3
- data/lib/ably_ui/core/footer/component.js +1 -1
- data/lib/ably_ui/core/footer/footer.html.erb +120 -58
- data/lib/ably_ui/core/icon/component.js +1 -1
- data/lib/ably_ui/core/images/ably-logo.png +0 -0
- data/lib/ably_ui/core/images/high-performer-2022.png +0 -0
- data/lib/ably_ui/core/images/highest-user-adoption-2022.png +0 -0
- data/lib/ably_ui/core/images/users-love-us-2022.png +0 -0
- data/lib/ably_ui/core/loader/component.js +1 -1
- data/lib/ably_ui/core/logo/component.js +1 -1
- data/lib/ably_ui/core/logo/logo.html.erb +2 -27
- data/lib/ably_ui/core/logo/logo.rb +15 -6
- data/lib/ably_ui/core/meganav/component.css +8 -10
- data/lib/ably_ui/core/meganav/component.js +1 -1
- data/lib/ably_ui/core/meganav/component.json +1 -1
- data/lib/ably_ui/core/meganav/meganav.html.erb +1 -1
- data/lib/ably_ui/core/meganav/meganav.rb +3 -2
- data/lib/ably_ui/core/meganav_blog_posts_list/component.js +1 -1
- data/lib/ably_ui/core/meganav_content_company/component.js +1 -1
- data/lib/ably_ui/core/meganav_content_company/meganav_content_company.html.erb +9 -0
- data/lib/ably_ui/core/meganav_content_developers/component.js +1 -1
- data/lib/ably_ui/core/meganav_content_developers/meganav_content_developers.html.erb +21 -14
- data/lib/ably_ui/core/meganav_content_platform/component.js +1 -1
- data/lib/ably_ui/core/meganav_content_platform/meganav_content_platform.html.erb +7 -7
- data/lib/ably_ui/core/meganav_content_use_cases/component.js +1 -1
- data/lib/ably_ui/core/meganav_content_use_cases/meganav_content_use_cases.html.erb +42 -38
- data/lib/ably_ui/core/meganav_control/component.js +1 -1
- data/lib/ably_ui/core/meganav_control_mobile_dropdown/component.js +1 -1
- data/lib/ably_ui/core/meganav_control_mobile_panel_close/component.js +1 -1
- data/lib/ably_ui/core/meganav_control_mobile_panel_open/component.js +1 -1
- data/lib/ably_ui/core/meganav_items_desktop/component.js +1 -1
- data/lib/ably_ui/core/meganav_items_mobile/component.js +1 -1
- data/lib/ably_ui/core/meganav_items_signed_in/component.js +1 -1
- data/lib/ably_ui/core/meganav_search/component.js +1 -1
- data/lib/ably_ui/core/meganav_search_autocomplete/component.js +1 -1
- data/lib/ably_ui/core/meganav_search_panel/component.js +1 -1
- data/lib/ably_ui/core/meganav_search_suggestions/component.js +1 -1
- data/lib/ably_ui/core/notice/component.css +1 -1
- data/lib/ably_ui/core/notice/component.js +1 -1
- data/lib/ably_ui/core/notice/notice.html.erb +2 -2
- data/lib/ably_ui/core/scripts.js +1 -1
- data/lib/ably_ui/core/showcase/component.js +1 -1
- data/lib/ably_ui/core/sign_out_link/component.js +1 -1
- data/lib/ably_ui/core/slider/component.js +1 -1
- data/lib/ably_ui/core/sprites.svg +87 -3
- data/lib/ably_ui/core/styles.css +222 -101
- data/lib/ably_ui/core/uptime/component.js +1 -1
- data/lib/ably_ui/reset/scripts.js +1 -1
- data/lib/ably_ui/reset/styles.css +1 -11
- data/lib/ably_ui/version.rb +1 -1
- metadata +8 -2
data/lib/ably_ui/core/styles.css
CHANGED
@@ -1,34 +1,132 @@
|
|
1
1
|
@layer base {
|
2
2
|
:root {
|
3
|
-
|
4
|
-
--color-
|
5
|
-
--color-
|
6
|
-
--color-
|
7
|
-
--color-
|
8
|
-
--color-
|
9
|
-
--color-
|
10
|
-
--color-
|
11
|
-
--color-
|
12
|
-
--color-
|
13
|
-
--color-
|
14
|
-
--color-
|
15
|
-
--color-
|
16
|
-
--color-
|
17
|
-
--color-
|
18
|
-
|
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;
|
91
|
+
--color-gui-focus: #80b9f2;
|
19
92
|
--color-gui-focus-outline: #80b9f2;
|
20
|
-
--color-gui-active: #074095;
|
21
93
|
--color-gui-visited: #4887c2;
|
22
|
-
|
23
|
-
|
24
|
-
--color-
|
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);
|
25
123
|
|
26
124
|
/* code syntax: theme */
|
27
|
-
--syntax-black: var(--color-
|
28
|
-
--syntax-dark-grey: var(--color-
|
29
|
-
--syntax-mid-grey: var(--color-
|
30
|
-
--syntax-light-grey: var(--color-
|
31
|
-
--syntax-extra-light-grey: var(--color-
|
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);
|
32
130
|
--syntax-orange: #e78c45;
|
33
131
|
--syntax-yellow: #e7c547;
|
34
132
|
--syntax-blue: #3490ec;
|
@@ -70,44 +168,51 @@
|
|
70
168
|
|
71
169
|
--gradient-hot-pink: linear-gradient(
|
72
170
|
80.2deg,
|
73
|
-
var(--color-
|
171
|
+
var(--color-orange-700) 0%,
|
74
172
|
var(--color-jazzy-pink) 100%
|
75
173
|
);
|
76
174
|
|
77
|
-
--fs-title-xl:
|
78
|
-
--fs-title:
|
79
|
-
--fs-title-xs:
|
80
|
-
--fs-h1-xl:
|
81
|
-
--fs-h1:
|
82
|
-
--fs-h1-xs:
|
83
|
-
|
175
|
+
--fs-title-xl: 3rem;
|
176
|
+
--fs-title: 2.75rem;
|
177
|
+
--fs-title-xs: 2.5rem;
|
178
|
+
--fs-h1-xl: 2.5rem;
|
179
|
+
--fs-h1: 2.25rem;
|
180
|
+
--fs-h1-xs: 2rem;
|
181
|
+
|
182
|
+
--fs-h2-xl: 2.125rem;
|
84
183
|
--fs-h2: 2rem;
|
85
|
-
--fs-h2-xs: 1.
|
184
|
+
--fs-h2-xs: 1.75rem;
|
185
|
+
|
86
186
|
--fs-h3: 1.5rem;
|
87
|
-
--fs-h4: 1.
|
88
|
-
--fs-
|
89
|
-
|
187
|
+
--fs-h4: 1.25rem;
|
188
|
+
--fs-h5: 1rem;
|
189
|
+
|
190
|
+
--fs-p1: 1rem;
|
191
|
+
--fs-p2: 0.938rem;
|
90
192
|
--fs-p3: 0.875rem;
|
91
193
|
--fs-standfirst-xl: 2.25rem;
|
92
194
|
--fs-standfirst: 1.5rem;
|
93
|
-
--fs-sub-header: 1.
|
94
|
-
--fs-sub-header-xs: 1.
|
195
|
+
--fs-sub-header: 1.125rem;
|
196
|
+
--fs-sub-header-xs: 1.063rem;
|
95
197
|
--fs-overline1: 1rem;
|
96
198
|
--fs-overline2: 0.875rem;
|
97
|
-
--fs-btn1:
|
98
|
-
--fs-btn2:
|
199
|
+
--fs-btn1: 1rem;
|
200
|
+
--fs-btn2: 0.938rem;
|
99
201
|
--fs-btn3: 0.875rem;
|
100
|
-
--fs-menu1:
|
101
|
-
--fs-menu2:
|
202
|
+
--fs-menu1: 1rem;
|
203
|
+
--fs-menu2: 0.938rem;
|
102
204
|
--fs-menu3: 0.875rem;
|
103
|
-
--fs-quote: 1.
|
104
|
-
--fs-code: 0.
|
205
|
+
--fs-quote: 1.25rem;
|
206
|
+
--fs-code: 0.938rem;
|
207
|
+
--fs-code2: 0.813rem;
|
105
208
|
|
106
209
|
--lh-dense: 1;
|
107
210
|
--lh-tight: 1.125;
|
108
211
|
--lh-snug: 1.15;
|
212
|
+
--lh-min-normal: 1.2;
|
109
213
|
--lh-normal: 1.25;
|
110
214
|
--lh-relaxed: 1.45;
|
215
|
+
--lh-extra-relaxed: 1.6;
|
111
216
|
|
112
217
|
--ls-tighten-0_025: -0.025em;
|
113
218
|
--ls-tighten-0_02: -0.02em;
|
@@ -115,7 +220,9 @@
|
|
115
220
|
--ls-tighten-0_01: -0.01em;
|
116
221
|
--ls-tighten-0_005: -0.005em;
|
117
222
|
--ls-tighten-0_0025: -0.0025em;
|
223
|
+
--ls-tighten-0_0015: -0.0015em;
|
118
224
|
--ls-widen-0_1: 0.1em;
|
225
|
+
--ls-widen-0_16: 0.16em;
|
119
226
|
--ls-widen-0_15: 0.15em;
|
120
227
|
|
121
228
|
--spacing-0: 0px;
|
@@ -130,6 +237,7 @@
|
|
130
237
|
--spacing-20: 1.25rem;
|
131
238
|
--spacing-24: 1.5rem;
|
132
239
|
--spacing-32: 2rem;
|
240
|
+
--spacing-36: 2.25rem;
|
133
241
|
--spacing-40: 2.5rem;
|
134
242
|
--spacing-48: 3rem;
|
135
243
|
--spacing-64: 4rem;
|
@@ -177,7 +285,7 @@
|
|
177
285
|
}
|
178
286
|
@layer components {
|
179
287
|
.ui-btn {
|
180
|
-
@apply text-white bg-cool-black text-btn2 font-
|
288
|
+
@apply text-white bg-cool-black text-btn2 font-manrope font-bold inline-block rounded p-btn;
|
181
289
|
@apply hover:text-white hover:bg-active-orange;
|
182
290
|
@apply active:text-white active:bg-red-orange;
|
183
291
|
@apply focus:text-white focus:bg-cool-black focus:outline-gui-focus;
|
@@ -201,7 +309,7 @@
|
|
201
309
|
background-size: 200% 100%;
|
202
310
|
background-position: 0% 0%;
|
203
311
|
|
204
|
-
@apply text-white text-btn2 font-
|
312
|
+
@apply text-white text-btn2 font-manrope font-bold inline-block rounded p-btn;
|
205
313
|
@apply focus:outline-gui-focus;
|
206
314
|
@apply inline-flex items-center justify-center;
|
207
315
|
}
|
@@ -217,7 +325,7 @@
|
|
217
325
|
}
|
218
326
|
|
219
327
|
.ui-btn-invert {
|
220
|
-
@apply text-cool-black bg-white text-btn2 font-
|
328
|
+
@apply text-cool-black bg-white text-btn2 font-manrope font-bold inline-block rounded p-btn;
|
221
329
|
@apply hover:text-white hover:bg-active-orange;
|
222
330
|
@apply active:text-white active:bg-red-orange;
|
223
331
|
@apply focus:text-white focus:bg-cool-black focus:outline-gui-focus;
|
@@ -227,7 +335,7 @@
|
|
227
335
|
}
|
228
336
|
|
229
337
|
.ui-btn-secondary {
|
230
|
-
@apply text-cool-black bg-white text-btn2 font-
|
338
|
+
@apply text-cool-black bg-white text-btn2 font-manrope font-bold inline-block border-btn border-cool-black rounded p-btn;
|
231
339
|
@apply hover:text-cool-black hover:border-active-orange hover:bg-white;
|
232
340
|
@apply active:border-red-orange active:bg-white;
|
233
341
|
@apply focus:border-cool-black focus:bg-white focus:outline-gui-focus;
|
@@ -237,7 +345,7 @@
|
|
237
345
|
}
|
238
346
|
|
239
347
|
.ui-btn-secondary-invert {
|
240
|
-
@apply text-white bg-cool-black text-btn2 font-
|
348
|
+
@apply text-white bg-cool-black text-btn2 font-manrope font-bold inline-block border-btn border-mid-grey rounded p-btn;
|
241
349
|
@apply hover:text-white hover:border-active-orange;
|
242
350
|
@apply active:border-red-orange;
|
243
351
|
@apply focus:outline-gui-focus;
|
@@ -322,47 +430,53 @@
|
|
322
430
|
}
|
323
431
|
@layer components {
|
324
432
|
.ui-text-title {
|
325
|
-
@apply font-
|
433
|
+
@apply font-manrope font-extrabold text-cool-black;
|
326
434
|
@apply text-title-xs xs:text-title xl:text-title-xl;
|
327
|
-
@apply tracking-tighten-0.
|
435
|
+
@apply tracking-tighten-0.015 xs:tracking-tighten-0.02 xl:tracking-tighten-0.02;
|
328
436
|
}
|
329
437
|
|
330
438
|
.ui-text-h1 {
|
331
|
-
@apply font-
|
439
|
+
@apply font-manrope font-extrabold text-cool-black;
|
332
440
|
@apply text-h1-xs xs:text-h1 xl:text-h1-xl;
|
333
|
-
@apply tracking-tighten-0.
|
441
|
+
@apply tracking-tighten-0.0125 xs:tracking-tighten-0.015;
|
334
442
|
}
|
335
443
|
|
336
444
|
.ui-text-h2 {
|
337
|
-
@apply font-
|
445
|
+
@apply font-manrope font-extrabold text-cool-black;
|
338
446
|
@apply text-h2-xs xs:text-h2 xl:text-h2-xl;
|
339
|
-
@apply tracking-tighten-0.
|
447
|
+
@apply tracking-tighten-0.015 xs:tracking-tighten-0.01;
|
340
448
|
}
|
341
449
|
|
342
450
|
.ui-text-h3 {
|
343
|
-
@apply font-
|
451
|
+
@apply font-manrope font-extrabold text-cool-black;
|
344
452
|
@apply text-h3;
|
345
|
-
@apply tracking-tighten-0.
|
453
|
+
@apply tracking-tighten-0.005;
|
346
454
|
}
|
347
455
|
|
348
456
|
.ui-text-h4 {
|
349
|
-
@apply font-
|
350
|
-
@apply text-h4
|
351
|
-
@apply tracking-
|
457
|
+
@apply font-manrope font-extrabold text-cool-black;
|
458
|
+
@apply text-h4;
|
459
|
+
@apply tracking-tighten-0.0015;
|
460
|
+
}
|
461
|
+
|
462
|
+
.ui-text-h5 {
|
463
|
+
@apply font-manrope font-extrabold text-cool-black;
|
464
|
+
@apply text-h5;
|
465
|
+
@apply tracking-tighten-0.0025;
|
352
466
|
}
|
353
467
|
|
354
468
|
.ui-text-p1 {
|
355
|
-
@apply font-
|
469
|
+
@apply font-manrope font-medium text-charcoal-grey;
|
356
470
|
@apply text-p1;
|
357
471
|
}
|
358
472
|
|
359
473
|
.ui-text-p2 {
|
360
|
-
@apply font-
|
474
|
+
@apply font-manrope font-medium text-charcoal-grey;
|
361
475
|
@apply text-p2;
|
362
476
|
}
|
363
477
|
|
364
478
|
.ui-text-p3 {
|
365
|
-
@apply font-
|
479
|
+
@apply font-manrope font-medium text-charcoal-grey;
|
366
480
|
@apply text-p3;
|
367
481
|
}
|
368
482
|
|
@@ -373,60 +487,63 @@
|
|
373
487
|
}
|
374
488
|
|
375
489
|
.ui-text-quote {
|
376
|
-
@apply font-
|
377
|
-
@apply text-quote;
|
378
|
-
@apply tracking-tighten-0.
|
490
|
+
@apply font-manrope font-normal text-cool-black;
|
491
|
+
@apply text-quote leading-normal;
|
492
|
+
@apply tracking-tighten-0.0015;
|
379
493
|
}
|
380
494
|
|
381
495
|
.ui-text-sub-header {
|
382
|
-
@apply font-
|
383
|
-
@apply text-sub-header-xs xs:text-sub-header;
|
384
|
-
@apply tracking-tighten-0.025;
|
496
|
+
@apply font-manrope font-semibold text-neutral-900;
|
497
|
+
@apply text-sub-header-xs xs:text-sub-header leading-normal;
|
385
498
|
}
|
386
499
|
|
387
500
|
.ui-text-overline1 {
|
388
|
-
@apply font-
|
389
|
-
@apply text-overline1;
|
390
|
-
@apply tracking-widen-0.
|
501
|
+
@apply font-jetbrains_mono font-medium text-active-orange uppercase;
|
502
|
+
@apply text-overline1 leading-normal;
|
503
|
+
@apply tracking-widen-0.16;
|
391
504
|
}
|
392
505
|
|
393
506
|
.ui-text-overline2 {
|
394
|
-
@apply font-
|
395
|
-
@apply text-overline2;
|
396
|
-
@apply tracking-widen-0.
|
507
|
+
@apply font-jetbrains_mono font-medium text-active-orange uppercase;
|
508
|
+
@apply text-overline2 leading-normal;
|
509
|
+
@apply tracking-widen-0.16;
|
397
510
|
}
|
398
511
|
|
399
512
|
.ui-text-menu1 {
|
400
|
-
@apply font-
|
401
|
-
@apply text-menu1;
|
513
|
+
@apply font-manrope font-medium text-cool-black;
|
514
|
+
@apply text-menu1 leading-snug;
|
402
515
|
}
|
403
516
|
|
404
517
|
.ui-text-menu2 {
|
405
|
-
@apply font-
|
406
|
-
@apply text-menu2;
|
518
|
+
@apply font-manrope font-medium text-cool-black;
|
519
|
+
@apply text-menu2 leading-snug;
|
407
520
|
}
|
408
521
|
|
409
522
|
.ui-text-menu3 {
|
410
|
-
@apply font-
|
411
|
-
@apply text-menu3;
|
523
|
+
@apply font-manrope font-medium text-cool-black;
|
524
|
+
@apply text-menu3 leading-snug;
|
412
525
|
}
|
413
526
|
|
414
527
|
.ui-text-code {
|
415
|
-
@apply font-
|
528
|
+
@apply font-jetbrains_mono font-medium text-code;
|
529
|
+
}
|
530
|
+
|
531
|
+
.ui-text-code2 {
|
532
|
+
@apply font-jetbrains_mono font-medium text-code2;
|
416
533
|
}
|
417
534
|
|
418
535
|
.ui-text-code-inline {
|
419
|
-
@apply font-
|
536
|
+
@apply font-jetbrains_mono font-medium text-code text-charcoal-grey bg-light-grey p-inline-code rounded-sm mx-1;
|
420
537
|
}
|
421
538
|
|
422
539
|
.ui-unordered-list {
|
423
|
-
@apply text-p1 font-
|
424
|
-
@apply list-disc ml-32
|
540
|
+
@apply text-p1 font-medium text-cool-black;
|
541
|
+
@apply list-disc ml-32 my-16;
|
425
542
|
}
|
426
543
|
|
427
544
|
.ui-ordered-list {
|
428
|
-
@apply text-p1 font-
|
429
|
-
@apply ml-32
|
545
|
+
@apply text-p1 font-medium text-charcoal-grey;
|
546
|
+
@apply ml-32 my-16 list-decimal;
|
430
547
|
}
|
431
548
|
|
432
549
|
.ui-unordered-list li > *:last-of-type:not(ul):not(ol),
|
@@ -443,11 +560,21 @@
|
|
443
560
|
}
|
444
561
|
|
445
562
|
.ui-unordered-list ul ul {
|
446
|
-
@apply list-square;
|
563
|
+
@apply list-square my-8;
|
564
|
+
}
|
565
|
+
|
566
|
+
.ui-unordered-list ul ul {
|
567
|
+
@apply my-8;
|
568
|
+
}
|
569
|
+
|
570
|
+
.ui-ordered-list li,
|
571
|
+
.ui-unordered-list li {
|
572
|
+
@apply font-medium font-manrope tracking-widen-0;
|
573
|
+
line-height: var(--lh-extra-relaxed);
|
447
574
|
}
|
448
575
|
|
449
576
|
.ui-unordered-list-with-emphasis {
|
450
|
-
@apply text-p1 font-
|
577
|
+
@apply text-p1 font-medium text-cool-black;
|
451
578
|
@apply list-disc ml-32 mt-32 -mb-12;
|
452
579
|
}
|
453
580
|
|
@@ -483,11 +610,11 @@
|
|
483
610
|
}
|
484
611
|
@layer components {
|
485
612
|
.ui-checkbox-p1 {
|
486
|
-
@apply flex items-start mb-16 font-
|
613
|
+
@apply flex items-start mb-16 font-manrope font-medium;
|
487
614
|
}
|
488
615
|
|
489
616
|
.ui-checkbox-p2 {
|
490
|
-
@apply flex items-start mb-12 font-
|
617
|
+
@apply flex items-start mb-12 font-manrope font-medium;
|
491
618
|
}
|
492
619
|
|
493
620
|
.ui-checkbox-input {
|
@@ -506,12 +633,12 @@
|
|
506
633
|
|
507
634
|
.ui-checkbox-label-p1 {
|
508
635
|
@apply select-none;
|
509
|
-
@apply text-p1 font-
|
636
|
+
@apply text-p1 font-medium text-cool-black;
|
510
637
|
}
|
511
638
|
|
512
639
|
.ui-checkbox-label-p2 {
|
513
640
|
@apply select-none;
|
514
|
-
@apply text-p2 font-
|
641
|
+
@apply text-p2 font-medium text-cool-black;
|
515
642
|
}
|
516
643
|
|
517
644
|
.ui-checkbox-input:disabled + .ui-checkbox-styled {
|
@@ -532,7 +659,7 @@
|
|
532
659
|
}
|
533
660
|
|
534
661
|
.ui-textarea {
|
535
|
-
@apply font-
|
662
|
+
@apply font-manrope font-medium text-cool-black text-p1;
|
536
663
|
@apply p-input mb-16;
|
537
664
|
@apply bg-light-grey border-mid-grey transition-input border rounded block w-full;
|
538
665
|
@apply hover:bg-white hover:shadow-input hover:border-transparent;
|
@@ -545,12 +672,6 @@
|
|
545
672
|
color: #76767c;
|
546
673
|
}
|
547
674
|
|
548
|
-
.ui-textarea:-ms-input-placeholder {
|
549
|
-
/* CSS vars don't work in ::placeholder in Webkit :( */
|
550
|
-
/* color: var(--text-dark-grey); */
|
551
|
-
color: #76767c;
|
552
|
-
}
|
553
|
-
|
554
675
|
.ui-textarea::placeholder {
|
555
676
|
/* CSS vars don't work in ::placeholder in Webkit :( */
|
556
677
|
/* color: var(--text-dark-grey); */
|
@@ -1 +1 @@
|
|
1
|
-
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.AblyUi=t():(e.AblyUi=e.AblyUi||{},e.AblyUi.Core=e.AblyUi.Core||{},e.AblyUi.Core.Uptime=t())}(this,(
|
1
|
+
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.AblyUi=t():(e.AblyUi=e.AblyUi||{},e.AblyUi.Core=e.AblyUi.Core||{},e.AblyUi.Core.Uptime=t())}(this,(()=>(()=>{"use strict";var e={};return e.default})()));
|
@@ -1 +1 @@
|
|
1
|
-
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.AblyUi=t():(e.AblyUi=e.AblyUi||{},e.AblyUi.Reset=t())}(this,(
|
1
|
+
!function(e,t){"object"==typeof exports&&"object"==typeof module?module.exports=t():"function"==typeof define&&define.amd?define([],t):"object"==typeof exports?exports.AblyUi=t():(e.AblyUi=e.AblyUi||{},e.AblyUi.Reset=t())}(this,(()=>(()=>{"use strict";var e={};return(e=>{"undefined"!=typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})})(e),e})()));
|
@@ -86,8 +86,7 @@
|
|
86
86
|
abbr[title] {
|
87
87
|
border-bottom: none; /* 1 */
|
88
88
|
text-decoration: underline; /* 2 */
|
89
|
-
|
90
|
-
text-decoration: underline dotted; /* 2 */
|
89
|
+
text-decoration: underline dotted; /* 2 */
|
91
90
|
}
|
92
91
|
|
93
92
|
/**
|
@@ -444,19 +443,10 @@
|
|
444
443
|
resize: vertical;
|
445
444
|
}
|
446
445
|
|
447
|
-
input:-ms-input-placeholder,
|
448
|
-
textarea:-ms-input-placeholder {
|
449
|
-
color: #a0aec0;
|
450
|
-
}
|
451
|
-
|
452
446
|
input::-moz-placeholder, textarea::-moz-placeholder {
|
453
447
|
color: #a0aec0;
|
454
448
|
}
|
455
449
|
|
456
|
-
input:-ms-input-placeholder, textarea:-ms-input-placeholder {
|
457
|
-
color: #a0aec0;
|
458
|
-
}
|
459
|
-
|
460
450
|
input::placeholder,
|
461
451
|
textarea::placeholder {
|
462
452
|
color: #a0aec0;
|
data/lib/ably_ui/version.rb
CHANGED
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.
|
4
|
+
version: 8.7.0.dev.fba161a
|
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:
|
13
|
+
date: 2023-08-10 00:00:00.000000000 Z
|
14
14
|
dependencies:
|
15
15
|
- !ruby/object:Gem::Dependency
|
16
16
|
name: view_component
|
@@ -91,6 +91,8 @@ files:
|
|
91
91
|
- lib/ably_ui/core/fonts/NEXT-Book-Medium.otf
|
92
92
|
- lib/ably_ui/core/fonts/NEXT-Book-Medium.woff
|
93
93
|
- lib/ably_ui/core/fonts/NEXT-Book-Medium.woff2
|
94
|
+
- lib/ably_ui/core/fonts/jetBrains-mono.css
|
95
|
+
- lib/ably_ui/core/fonts/manrope.css
|
94
96
|
- lib/ably_ui/core/fonts/next.css
|
95
97
|
- lib/ably_ui/core/fonts/source-code-pro.css
|
96
98
|
- lib/ably_ui/core/footer/component.css
|
@@ -100,6 +102,7 @@ files:
|
|
100
102
|
- lib/ably_ui/core/icon/component.js
|
101
103
|
- lib/ably_ui/core/icon/icon.html.erb
|
102
104
|
- lib/ably_ui/core/icon/icon.rb
|
105
|
+
- lib/ably_ui/core/images/ably-logo.png
|
103
106
|
- lib/ably_ui/core/images/ably-logo.svg
|
104
107
|
- lib/ably_ui/core/images/ably-stack.svg
|
105
108
|
- lib/ably_ui/core/images/cust-logo-ao-col-pos.png
|
@@ -128,10 +131,13 @@ files:
|
|
128
131
|
- lib/ably_ui/core/images/cust-photo-split-pato-echague.jpg
|
129
132
|
- lib/ably_ui/core/images/cust-photo-vitac-joe-antonio.jpg
|
130
133
|
- lib/ably_ui/core/images/flexible-companies.png
|
134
|
+
- lib/ably_ui/core/images/high-performer-2022.png
|
135
|
+
- lib/ably_ui/core/images/highest-user-adoption-2022.png
|
131
136
|
- lib/ably_ui/core/images/icon-tech-aws.svg
|
132
137
|
- lib/ably_ui/core/images/rocket-list-2021.png
|
133
138
|
- lib/ably_ui/core/images/scale-motif-open-empathetic.svg
|
134
139
|
- lib/ably_ui/core/images/technical-support-01-800x533.jpg
|
140
|
+
- lib/ably_ui/core/images/users-love-us-2022.png
|
135
141
|
- lib/ably_ui/core/loader/component.js
|
136
142
|
- lib/ably_ui/core/loader/loader.html.erb
|
137
143
|
- lib/ably_ui/core/loader/loader.rb
|