@ably/ui 11.7.0 → 11.7.1-dev.a87b30a
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.
- package/README.md +7 -7
- package/core/Code/component.css +2 -0
- package/core/CompanyAutocomplete/component.js +2 -1
- package/core/CompanyAutocomplete/component.js.LICENSE.txt +1 -0
- package/core/FeaturedLink/component.css +1 -1
- package/core/Footer/component.css +3 -3
- package/core/Footer.jsx +15 -15
- package/core/Meganav/component.css +6 -6
- package/core/Meganav.jsx +336 -751
- package/core/MeganavBlogPostsList/component.js +2 -1
- package/core/MeganavBlogPostsList/component.js.LICENSE.txt +1 -0
- package/core/MeganavContentCompany.jsx +295 -710
- package/core/MeganavContentDevelopers.jsx +1 -1
- package/core/MeganavContentProducts.jsx +1 -1
- package/core/Notice.jsx +2 -2
- package/core/Uptime.jsx +289 -704
- package/core/fonts/jetBrains-mono.css +3 -0
- package/core/fonts/manrope.css +3 -0
- package/core/scripts.js +2 -1
- package/core/scripts.js.LICENSE.txt +1 -0
- package/core/styles.css +221 -94
- package/package.json +3 -3
- package/src/core/FeaturedLink/component.css +1 -1
- package/src/core/Footer/component.css +3 -3
- package/src/core/Footer/component.html.erb +14 -14
- package/src/core/Footer/component.jsx +15 -15
- package/src/core/Meganav/component.css +6 -6
- package/src/core/MeganavContentDevelopers/component.html.erb +1 -1
- package/src/core/MeganavContentDevelopers/component.jsx +1 -1
- package/src/core/MeganavContentProducts/component.html.erb +1 -1
- package/src/core/MeganavContentProducts/component.jsx +1 -1
- package/src/core/Notice/component.html.erb +2 -2
- package/src/core/Notice/component.jsx +2 -2
- package/src/core/fonts/jetBrains-mono.css +3 -0
- package/src/core/fonts/manrope.css +3 -0
- package/src/core/styles/buttons.css +5 -5
- package/src/core/styles/forms.css +5 -5
- package/src/core/styles/properties.css +153 -45
- package/src/core/styles/text.css +58 -39
- package/src/core/utils/syntax-highlighter.css +2 -0
- package/tailwind.config.js +177 -49
package/src/core/styles/text.css
CHANGED
|
@@ -1,46 +1,52 @@
|
|
|
1
1
|
@layer components {
|
|
2
2
|
.ui-text-title {
|
|
3
|
-
@apply font-sans font-
|
|
3
|
+
@apply font-sans font-extrabold text-cool-black;
|
|
4
4
|
@apply text-title-xs xs:text-title xl:text-title-xl;
|
|
5
|
-
@apply tracking-tighten-0.
|
|
5
|
+
@apply tracking-tighten-0.015 xs:tracking-tighten-0.02 xl:tracking-tighten-0.02;
|
|
6
6
|
}
|
|
7
7
|
|
|
8
8
|
.ui-text-h1 {
|
|
9
|
-
@apply font-sans font-
|
|
9
|
+
@apply font-sans font-extrabold text-cool-black;
|
|
10
10
|
@apply text-h1-xs xs:text-h1 xl:text-h1-xl;
|
|
11
|
-
@apply tracking-tighten-0.
|
|
11
|
+
@apply tracking-tighten-0.0125 xs:tracking-tighten-0.015;
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
.ui-text-h2 {
|
|
15
|
-
@apply font-sans font-
|
|
15
|
+
@apply font-sans font-extrabold text-cool-black;
|
|
16
16
|
@apply text-h2-xs xs:text-h2 xl:text-h2-xl;
|
|
17
|
-
@apply tracking-tighten-0.
|
|
17
|
+
@apply tracking-tighten-0.015 xs:tracking-tighten-0.01;
|
|
18
18
|
}
|
|
19
19
|
|
|
20
20
|
.ui-text-h3 {
|
|
21
|
-
@apply font-sans font-
|
|
21
|
+
@apply font-sans font-extrabold text-cool-black;
|
|
22
22
|
@apply text-h3;
|
|
23
|
-
@apply tracking-tighten-0.
|
|
23
|
+
@apply tracking-tighten-0.005;
|
|
24
24
|
}
|
|
25
25
|
|
|
26
26
|
.ui-text-h4 {
|
|
27
|
-
@apply font-sans font-
|
|
27
|
+
@apply font-sans font-extrabold text-cool-black;
|
|
28
28
|
@apply text-h4;
|
|
29
|
-
@apply tracking-
|
|
29
|
+
@apply tracking-tighten-0.0015;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
.ui-text-h5 {
|
|
33
|
+
@apply font-sans font-extrabold text-cool-black;
|
|
34
|
+
@apply text-h5;
|
|
35
|
+
@apply tracking-tighten-0.0025;
|
|
30
36
|
}
|
|
31
37
|
|
|
32
38
|
.ui-text-p1 {
|
|
33
|
-
@apply font-sans font-
|
|
39
|
+
@apply font-sans font-medium text-charcoal-grey;
|
|
34
40
|
@apply text-p1;
|
|
35
41
|
}
|
|
36
42
|
|
|
37
43
|
.ui-text-p2 {
|
|
38
|
-
@apply font-sans font-
|
|
44
|
+
@apply font-sans font-medium text-charcoal-grey;
|
|
39
45
|
@apply text-p2;
|
|
40
46
|
}
|
|
41
47
|
|
|
42
48
|
.ui-text-p3 {
|
|
43
|
-
@apply font-sans font-
|
|
49
|
+
@apply font-sans font-medium text-charcoal-grey;
|
|
44
50
|
@apply text-p3;
|
|
45
51
|
}
|
|
46
52
|
|
|
@@ -51,60 +57,63 @@
|
|
|
51
57
|
}
|
|
52
58
|
|
|
53
59
|
.ui-text-quote {
|
|
54
|
-
@apply font-sans font-
|
|
55
|
-
@apply text-quote;
|
|
56
|
-
@apply tracking-tighten-0.
|
|
60
|
+
@apply font-sans font-normal text-cool-black;
|
|
61
|
+
@apply text-quote leading-normal;
|
|
62
|
+
@apply tracking-tighten-0.0015;
|
|
57
63
|
}
|
|
58
64
|
|
|
59
65
|
.ui-text-sub-header {
|
|
60
|
-
@apply font-sans font-
|
|
61
|
-
@apply text-sub-header-xs xs:text-sub-header;
|
|
62
|
-
@apply tracking-tighten-0.025;
|
|
66
|
+
@apply font-sans font-semibold text-neutral-800;
|
|
67
|
+
@apply text-sub-header-xs xs:text-sub-header leading-normal;
|
|
63
68
|
}
|
|
64
69
|
|
|
65
70
|
.ui-text-overline1 {
|
|
66
|
-
@apply font-
|
|
67
|
-
@apply text-overline1;
|
|
68
|
-
@apply tracking-widen-0.
|
|
71
|
+
@apply font-mono font-medium text-active-orange uppercase;
|
|
72
|
+
@apply text-overline1 leading-normal;
|
|
73
|
+
@apply tracking-widen-0.16;
|
|
69
74
|
}
|
|
70
75
|
|
|
71
76
|
.ui-text-overline2 {
|
|
72
|
-
@apply font-
|
|
73
|
-
@apply text-overline2;
|
|
74
|
-
@apply tracking-widen-0.
|
|
77
|
+
@apply font-mono font-medium text-active-orange uppercase;
|
|
78
|
+
@apply text-overline2 leading-normal;
|
|
79
|
+
@apply tracking-widen-0.16;
|
|
75
80
|
}
|
|
76
81
|
|
|
77
82
|
.ui-text-menu1 {
|
|
78
|
-
@apply font-sans font-
|
|
79
|
-
@apply text-menu1;
|
|
83
|
+
@apply font-sans font-medium text-cool-black;
|
|
84
|
+
@apply text-menu1 leading-snug;
|
|
80
85
|
}
|
|
81
86
|
|
|
82
87
|
.ui-text-menu2 {
|
|
83
|
-
@apply font-sans font-
|
|
84
|
-
@apply text-menu2;
|
|
88
|
+
@apply font-sans font-medium text-cool-black;
|
|
89
|
+
@apply text-menu2 leading-snug;
|
|
85
90
|
}
|
|
86
91
|
|
|
87
92
|
.ui-text-menu3 {
|
|
88
|
-
@apply font-sans font-
|
|
89
|
-
@apply text-menu3;
|
|
93
|
+
@apply font-sans font-medium text-cool-black;
|
|
94
|
+
@apply text-menu3 leading-snug;
|
|
90
95
|
}
|
|
91
96
|
|
|
92
97
|
.ui-text-code {
|
|
93
|
-
@apply font-mono font-
|
|
98
|
+
@apply font-mono font-medium text-code;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
.ui-text-code2 {
|
|
102
|
+
@apply font-mono font-medium text-code2;
|
|
94
103
|
}
|
|
95
104
|
|
|
96
105
|
.ui-text-code-inline {
|
|
97
|
-
@apply font-mono font-
|
|
106
|
+
@apply font-mono font-medium text-code text-charcoal-grey bg-light-grey p-inline-code rounded-sm mx-1;
|
|
98
107
|
}
|
|
99
108
|
|
|
100
109
|
.ui-unordered-list {
|
|
101
|
-
@apply text-p1 font-
|
|
102
|
-
@apply list-disc ml-32
|
|
110
|
+
@apply text-p1 font-medium text-cool-black;
|
|
111
|
+
@apply list-disc ml-32 my-16;
|
|
103
112
|
}
|
|
104
113
|
|
|
105
114
|
.ui-ordered-list {
|
|
106
|
-
@apply text-p1 font-
|
|
107
|
-
@apply ml-32
|
|
115
|
+
@apply text-p1 font-medium text-charcoal-grey;
|
|
116
|
+
@apply ml-32 my-16 list-decimal;
|
|
108
117
|
}
|
|
109
118
|
|
|
110
119
|
.ui-unordered-list li > *:last-of-type:not(ul):not(ol),
|
|
@@ -121,11 +130,21 @@
|
|
|
121
130
|
}
|
|
122
131
|
|
|
123
132
|
.ui-unordered-list ul ul {
|
|
124
|
-
@apply list-square;
|
|
133
|
+
@apply list-square my-8;
|
|
134
|
+
}
|
|
135
|
+
|
|
136
|
+
.ui-unordered-list ul ul {
|
|
137
|
+
@apply my-8;
|
|
138
|
+
}
|
|
139
|
+
|
|
140
|
+
.ui-ordered-list li,
|
|
141
|
+
.ui-unordered-list li {
|
|
142
|
+
@apply font-medium font-sans tracking-widen-0;
|
|
143
|
+
line-height: var(--lh-extra-relaxed);
|
|
125
144
|
}
|
|
126
145
|
|
|
127
146
|
.ui-unordered-list-with-emphasis {
|
|
128
|
-
@apply text-p1 font-
|
|
147
|
+
@apply text-p1 font-medium text-cool-black;
|
|
129
148
|
@apply list-disc ml-32 mt-32 -mb-12;
|
|
130
149
|
}
|
|
131
150
|
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
@layer base {
|
|
2
2
|
@import url("https://fonts.googleapis.com/css2?family=Source+Code+Pro:ital,wght@0,600;0,700;1,600;1,700&display=swap");
|
|
3
|
+
@import url("https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@100;200;300;400;500;600;700;800&display=swap");
|
|
4
|
+
@import url("https://fonts.googleapis.com/css2?family=Manrope:wght@200;300;400;500;600;700;800&display=swap");
|
|
3
5
|
}
|
|
4
6
|
|
|
5
7
|
@layer components {
|
package/tailwind.config.js
CHANGED
|
@@ -24,60 +24,147 @@ module.exports = {
|
|
|
24
24
|
xl: "1440px",
|
|
25
25
|
},
|
|
26
26
|
fontSize: {
|
|
27
|
-
title: ["var(--fs-title)", "var(--lh-
|
|
28
|
-
"title-xl": ["var(--fs-title-xl)", "var(--lh-
|
|
29
|
-
"title-xs": ["var(--fs-title-xs)", "var(--lh-
|
|
27
|
+
title: ["var(--fs-title)", "var(--lh-min-normal)"],
|
|
28
|
+
"title-xl": ["var(--fs-title-xl)", "var(--lh-min-normal)"],
|
|
29
|
+
"title-xs": ["var(--fs-title-xs)", "var(--lh-min-normal)"],
|
|
30
30
|
h1: ["var(--fs-h1)", "var(--lh-tight)"],
|
|
31
|
-
"h1-xl": ["var(--fs-h1-xl)", "var(--lh-
|
|
32
|
-
"h1-xs": ["var(--fs-h1-xs)", "var(--lh-
|
|
33
|
-
h2: ["var(--fs-h2)", "var(--lh-
|
|
34
|
-
"h2-xl": ["var(--fs-h2-xl)", "var(--lh-
|
|
35
|
-
"h2-xs": ["var(--fs-h2-xs)", "var(--lh-
|
|
36
|
-
h3: ["var(--fs-h3)", "var(--lh-
|
|
37
|
-
h4: ["var(--fs-h4)", "var(--lh-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
"
|
|
44
|
-
"sub-header
|
|
45
|
-
|
|
46
|
-
|
|
31
|
+
"h1-xl": ["var(--fs-h1-xl)", "var(--lh-min-normal)"],
|
|
32
|
+
"h1-xs": ["var(--fs-h1-xs)", "var(--lh-min-normal)"],
|
|
33
|
+
h2: ["var(--fs-h2)", "var(--lh-min-normal)"],
|
|
34
|
+
"h2-xl": ["var(--fs-h2-xl)", "var(--lh-min-normal)"],
|
|
35
|
+
"h2-xs": ["var(--fs-h2-xs)", "var(--lh-min-normal)"],
|
|
36
|
+
h3: ["var(--fs-h3)", "var(--lh-min-normal)"],
|
|
37
|
+
h4: ["var(--fs-h4)", "var(--lh-min-normal)"],
|
|
38
|
+
h5: ["var(--fs-h5)", "var(--lh-min-normal)"],
|
|
39
|
+
p1: ["var(--fs-p1)", "var(--lh-extra-relaxed)"],
|
|
40
|
+
p2: ["var(--fs-p2)", "var(--lh-extra-relaxed)"],
|
|
41
|
+
p3: ["var(--fs-p3)", "var(--lh-extra-relaxed)"],
|
|
42
|
+
standfirst: ["var(--fs-standfirst)"],
|
|
43
|
+
"standfirst-xl": ["var(--fs-standfirst-xl)"],
|
|
44
|
+
"sub-header": ["var(--fs-sub-header)"],
|
|
45
|
+
"sub-header-xs": ["var(--fs-sub-header-xs)"],
|
|
46
|
+
overline1: ["var(--fs-overline1)"],
|
|
47
|
+
overline2: ["var(--fs-overline2)"],
|
|
47
48
|
btn1: ["var(--fs-btn1)", "var(--lh-normal)"],
|
|
48
49
|
btn2: ["var(--fs-btn2)", "var(--lh-tight)"],
|
|
49
50
|
btn3: ["var(--fs-btn2)", "var(--lh-tight)"],
|
|
50
51
|
btn4: ["var(--fs-btn3)", "var(--lh-dense)"],
|
|
51
|
-
menu1: ["var(--fs-menu1)"
|
|
52
|
-
menu2: ["var(--fs-menu2)"
|
|
53
|
-
menu3: ["var(--fs-menu3)"
|
|
54
|
-
quote: ["var(--fs-quote)"
|
|
52
|
+
menu1: ["var(--fs-menu1)"],
|
|
53
|
+
menu2: ["var(--fs-menu2)"],
|
|
54
|
+
menu3: ["var(--fs-menu3)"],
|
|
55
|
+
quote: ["var(--fs-quote)"],
|
|
55
56
|
code: ["var(--fs-code)", "var(--lh-dense)"],
|
|
57
|
+
code2: ["var(--fs-code2)", "var(--lh-dense)"],
|
|
56
58
|
},
|
|
57
59
|
colors: {
|
|
58
|
-
|
|
59
|
-
"
|
|
60
|
-
"
|
|
61
|
-
"
|
|
62
|
-
|
|
63
|
-
"
|
|
64
|
-
"
|
|
65
|
-
"
|
|
66
|
-
"
|
|
67
|
-
"
|
|
68
|
-
"
|
|
69
|
-
"
|
|
70
|
-
"
|
|
71
|
-
|
|
72
|
-
"
|
|
73
|
-
"
|
|
74
|
-
"
|
|
75
|
-
"
|
|
76
|
-
"
|
|
77
|
-
"
|
|
60
|
+
"neutral-100": "var(--color-neutral-100)",
|
|
61
|
+
"neutral-200": "var(--color-neutral-200)",
|
|
62
|
+
"neutral-300": "var(--color-neutral-300)",
|
|
63
|
+
"neutral-400": "var(--color-neutral-400)",
|
|
64
|
+
"neutral-500": "var(--color-neutral-500)",
|
|
65
|
+
"neutral-600": "var(--color-neutral-600)",
|
|
66
|
+
"neutral-700": "var(--color-neutral-700)",
|
|
67
|
+
"neutral-800": "var(--color-neutral-800)",
|
|
68
|
+
"neutral-900": "var(--color-neutral-900)",
|
|
69
|
+
"neutral-1000": "var(--color-neutral-1000)",
|
|
70
|
+
"neutral-1100": "var(--color-neutral-1100)",
|
|
71
|
+
"neutral-1200": "var(--color-neutral-1200)",
|
|
72
|
+
"neutral-1300": "var(--color-neutral-1300)",
|
|
73
|
+
|
|
74
|
+
"orange-100": "var(--color-orange-100)",
|
|
75
|
+
"orange-200": "var(--color-orange-200)",
|
|
76
|
+
"orange-300": "var(--color-orange-300)",
|
|
77
|
+
"orange-400": "var(--color-orange-400)",
|
|
78
|
+
"orange-500": "var(--color-orange-500)",
|
|
79
|
+
"orange-600": "var(--color-orange-600)",
|
|
80
|
+
"orange-700": "var(--color-orange-700)",
|
|
81
|
+
"orange-800": "var(--color-orange-800)",
|
|
82
|
+
"orange-900": "var(--color-orange-900)",
|
|
83
|
+
"orange-1000": "var(--color-orange-1000)",
|
|
84
|
+
"orange-1100": "var(--color-orange-1100)",
|
|
85
|
+
|
|
86
|
+
"yellow-100": "var(--color-yellow-100)",
|
|
87
|
+
"yellow-200": "var(--color-yellow-200)",
|
|
88
|
+
"yellow-300": "var(--color-yellow-300)",
|
|
89
|
+
"yellow-400": "var(--color-yellow-400)",
|
|
90
|
+
"yellow-500": "var(--color-yellow-500)",
|
|
91
|
+
"yellow-600": "var(--color-yellow-600)",
|
|
92
|
+
"yellow-700": "var(--color-yellow-700)",
|
|
93
|
+
"yellow-800": "var(--color-yellow-800)",
|
|
94
|
+
"yellow-900": "var(--color-yellow-900)",
|
|
95
|
+
"green-100": "var(--color-green-100)",
|
|
96
|
+
"green-200": "var(--color-green-200)",
|
|
97
|
+
"green-300": "var(--color-green-300)",
|
|
98
|
+
"green-400": "var(--color-green-400)",
|
|
99
|
+
"green-500": "var(--color-green-500)",
|
|
100
|
+
"green-600": "var(--color-green-600)",
|
|
101
|
+
"green-700": "var(--color-green-700)",
|
|
102
|
+
"green-800": "var(--color-green-800)",
|
|
103
|
+
"green-900": "var(--color-green-900)",
|
|
104
|
+
"blue-100": "var(--color-blue-100)",
|
|
105
|
+
"blue-200": "var(--color-blue-200)",
|
|
106
|
+
"blue-300": "var(--color-blue-300)",
|
|
107
|
+
"blue-400": "var(--color-blue-400)",
|
|
108
|
+
"blue-500": "var(--color-blue-500)",
|
|
109
|
+
"blue-600": "var(--color-blue-600)",
|
|
110
|
+
"blue-700": "var(--color-blue-700)",
|
|
111
|
+
"blue-800": "var(--color-blue-800)",
|
|
112
|
+
"blue-900": "var(--color-blue-900)",
|
|
113
|
+
"violet-100": "var(--color-violet-100)",
|
|
114
|
+
"violet-200": "var(--color-violet-200)",
|
|
115
|
+
"violet-300": "var(--color-violet-300)",
|
|
116
|
+
"violet-400": "var(--color-violet-400)",
|
|
117
|
+
"violet-500": "var(--color-violet-500)",
|
|
118
|
+
"violet-600": "var(--color-violet-600)",
|
|
119
|
+
"violet-700": "var(--color-violet-700)",
|
|
120
|
+
"violet-800": "var(--color-violet-800)",
|
|
121
|
+
"violet-900": "var(--color-violet-900)",
|
|
122
|
+
"pink-100": "var(--color-pink-100)",
|
|
123
|
+
"pink-200": "var(--color-pink-200)",
|
|
124
|
+
"pink-300": "var(--color-pink-300)",
|
|
125
|
+
"pink-400": "var(--color-pink-400)",
|
|
126
|
+
"pink-500": "var(--color-pink-500)",
|
|
127
|
+
"pink-600": "var(--color-pink-600)",
|
|
128
|
+
"pink-700": "var(--color-pink-700)",
|
|
129
|
+
"pink-800": "var(--color-pink-800)",
|
|
130
|
+
"pink-900": "var(--color-pink-900)",
|
|
131
|
+
|
|
132
|
+
"gui-blue-default-light": "var(--color-gui-blue-default-light)",
|
|
133
|
+
"gui-blue-hover-light": "var(--color-gui-blue-hover-light)",
|
|
134
|
+
"gui-blue-active-light": "var(--color-gui-blue-active-light)",
|
|
135
|
+
"gui-blue-default-dark": "var(--color-gui-blue-default-dark)",
|
|
136
|
+
"gui-blue-hover-dark": "var(--color-gui-blue-hover-dark)",
|
|
137
|
+
"gui-blue-active-dark": "var(--color-gui-blue-active-dark)",
|
|
138
|
+
"gui-blue-focus": "var(--color-gui-blue-focus)",
|
|
78
139
|
"gui-unavailable": "var(--color-gui-unavailable)",
|
|
79
|
-
"gui-
|
|
80
|
-
"gui-
|
|
140
|
+
"gui-success-green": "var(--color-gui-success-green)",
|
|
141
|
+
"gui-error-red": "var(--color-gui-error-red)",
|
|
142
|
+
"gui-focus": "var(--color-gui-focus)",
|
|
143
|
+
"gui-focus-outline": "var(--color-gui-focus-outline)",
|
|
144
|
+
|
|
145
|
+
transparent: "transparent",
|
|
146
|
+
"cool-black": "var(--color-neutral-1300)",
|
|
147
|
+
"active-orange": "var(--color-orange-600)",
|
|
148
|
+
"red-orange": "var(--color-orange-800)",
|
|
149
|
+
white: "var(--color-neutral-000)",
|
|
150
|
+
"electric-cyan": "var(--color-blue-400)",
|
|
151
|
+
"zingy-green": "var(--color-green-400)",
|
|
152
|
+
"bright-red": "var(--color-orange-700)",
|
|
153
|
+
"jazzy-pink": "var(--color-pink-500)",
|
|
154
|
+
"extra-light-grey": "var(--color-neutral-100)",
|
|
155
|
+
"light-grey": "var(--color-neutral-200)",
|
|
156
|
+
"mid-grey": "var(--color-neutral-500)",
|
|
157
|
+
"dark-grey": "var(--color-neutral-800)",
|
|
158
|
+
"charcoal-grey": "var(--color-neutral-1000)",
|
|
159
|
+
"gui-default": "var(--color-gui-blue-default-light)",
|
|
160
|
+
"gui-hover": "var(--color-gui-blue-hover-light)",
|
|
161
|
+
"gui-active": "var(--color-gui-blue-active-light)",
|
|
162
|
+
"gui-default-dark": "var(--color-gui-blue-default-dark)",
|
|
163
|
+
"gui-hover-dark": "var(--color-gui-blue-hover-dark)",
|
|
164
|
+
"gui-active-dark": "var(--color-gui-blue-active-dark)",
|
|
165
|
+
"gui-alt": "var(--color-neutral-1300)",
|
|
166
|
+
"gui-error": "var(--color-gui-error-red)",
|
|
167
|
+
"gui-success": "var(--color-gui-success-green)",
|
|
81
168
|
"icon-linkedin": "var(--icon-color-linkedin)",
|
|
82
169
|
"icon-twitter": "var(--icon-color-twitter)",
|
|
83
170
|
"icon-glassdoor": "var(--icon-color-glassdoor)",
|
|
@@ -85,8 +172,44 @@ module.exports = {
|
|
|
85
172
|
"icon-discord": "var(--icon-color-discord)",
|
|
86
173
|
},
|
|
87
174
|
fontFamily: {
|
|
88
|
-
|
|
89
|
-
|
|
175
|
+
sans_next: ["NEXT Book", "Arial", "Helvetica", "sans-serif"],
|
|
176
|
+
serif: [
|
|
177
|
+
"ui-serif",
|
|
178
|
+
"Georgia",
|
|
179
|
+
"Cambria",
|
|
180
|
+
"Times New Roman",
|
|
181
|
+
"Times",
|
|
182
|
+
"serif",
|
|
183
|
+
],
|
|
184
|
+
mono_source_code: ["Source Code Pro", "Courier", "monospace"],
|
|
185
|
+
sans: [
|
|
186
|
+
"Manrope",
|
|
187
|
+
"ui-sans-serif",
|
|
188
|
+
"system-ui",
|
|
189
|
+
"-apple-system",
|
|
190
|
+
"BlinkMacSystemFont",
|
|
191
|
+
"Segoe UI",
|
|
192
|
+
"Roboto",
|
|
193
|
+
"Helvetica Neue",
|
|
194
|
+
"Arial",
|
|
195
|
+
"Noto Sans",
|
|
196
|
+
"sans-serif",
|
|
197
|
+
"Apple Color Emoji",
|
|
198
|
+
"Segoe UI Emoji",
|
|
199
|
+
"Segoe UI Symbol",
|
|
200
|
+
"Noto Color Emoji",
|
|
201
|
+
],
|
|
202
|
+
mono: [
|
|
203
|
+
"JetBrains Mono",
|
|
204
|
+
"ui-monospace",
|
|
205
|
+
"SFMono-Regular",
|
|
206
|
+
"Menlo",
|
|
207
|
+
"Monaco",
|
|
208
|
+
"Consolas",
|
|
209
|
+
"Liberation Mono",
|
|
210
|
+
"Courier New",
|
|
211
|
+
"monospace",
|
|
212
|
+
],
|
|
90
213
|
},
|
|
91
214
|
margin: (theme, { negative }) => ({
|
|
92
215
|
auto: "auto",
|
|
@@ -124,6 +247,7 @@ module.exports = {
|
|
|
124
247
|
20: "var(--spacing-20)",
|
|
125
248
|
24: "var(--spacing-24)",
|
|
126
249
|
32: "var(--spacing-32)",
|
|
250
|
+
36: "var(--spacing-36)",
|
|
127
251
|
40: "var(--spacing-40)",
|
|
128
252
|
48: "var(--spacing-48)",
|
|
129
253
|
64: "var(--spacing-64)",
|
|
@@ -143,7 +267,7 @@ module.exports = {
|
|
|
143
267
|
...breakpoints(theme("screens")),
|
|
144
268
|
}),
|
|
145
269
|
boxShadow: {
|
|
146
|
-
subtle: "0px 1px 0px var(--color-
|
|
270
|
+
subtle: "0px 1px 0px var(--color-neutral-500)",
|
|
147
271
|
tooltip: "0px 5px 10px 0px #00000022",
|
|
148
272
|
container: "0px 40px 40px rgba(0, 0, 0, 0.1)",
|
|
149
273
|
"container-subtle": "0px 16px 64px rgba(0, 0, 0, 0.1)",
|
|
@@ -155,11 +279,15 @@ module.exports = {
|
|
|
155
279
|
"tighten-0.025": "var(--ls-tighten-0_025)",
|
|
156
280
|
"tighten-0.02": "var(--ls-tighten-0_02)",
|
|
157
281
|
"tighten-0.015": "var(--ls-tighten-0_015)",
|
|
282
|
+
"tighten-0.0125": "var(--ls-tighten-0_0125)",
|
|
158
283
|
"tighten-0.01": "var(--ls-tighten-0_01)",
|
|
159
284
|
"tighten-0.005": "var(--ls-tighten-0_005)",
|
|
160
285
|
"tighten-0.0025": "var(--ls-tighten-0_0025)",
|
|
286
|
+
"tighten-0.0015": "var(--ls-tighten-0_0015)",
|
|
287
|
+
"widen-0": 0,
|
|
161
288
|
"widen-0.1": "var(--ls-widen-0_1)",
|
|
162
289
|
"widen-0.15": "var(--ls-widen-0_15)",
|
|
290
|
+
"widen-0.16": "var(--ls-widen-0_16)",
|
|
163
291
|
},
|
|
164
292
|
borderRadius: {
|
|
165
293
|
none: "0",
|
|
@@ -185,7 +313,7 @@ module.exports = {
|
|
|
185
313
|
},
|
|
186
314
|
outline: {
|
|
187
315
|
"gui-focus": "1.5px solid var(--color-gui-focus-outline)",
|
|
188
|
-
"gui-focus-neutral": "2px solid var(--color-
|
|
316
|
+
"gui-focus-neutral": "2px solid var(--color-neutral-000)",
|
|
189
317
|
},
|
|
190
318
|
width: {
|
|
191
319
|
"extend-8": "calc(100% + var(--spacing-8))",
|