ably-ui 8.7.0.dev.fa55b85 → 8.7.0.dev.fba161a
Sign up to get free protection for your applications and to get access to all the features.
- 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
|