@aivenio/aquarium 4.9.0 → 5.0.0

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 (52) hide show
  1. package/dist/_variables.scss +302 -302
  2. package/dist/atoms.cjs +1948 -1765
  3. package/dist/atoms.mjs +1767 -1588
  4. package/dist/charts.cjs +0 -209
  5. package/dist/charts.mjs +0 -209
  6. package/dist/src/atoms/Alert/Alert.js +63 -26
  7. package/dist/src/atoms/Banner/Banner.js +47 -18
  8. package/dist/src/atoms/Button/Button.d.ts +2 -2
  9. package/dist/src/atoms/Button/Button.js +3 -12
  10. package/dist/src/atoms/Card/Card.js +130 -30
  11. package/dist/src/atoms/Checkbox/Checkbox.js +27 -16
  12. package/dist/src/atoms/Chip/Chip.js +12 -6
  13. package/dist/src/atoms/ChoiceChip/ChoiceChip.d.ts +57 -0
  14. package/dist/src/atoms/ChoiceChip/ChoiceChip.js +51 -0
  15. package/dist/src/atoms/DataList/DataList.js +117 -32
  16. package/dist/src/atoms/DatePicker/RangeCalendar.js +10 -3
  17. package/dist/src/atoms/DropdownMenu/DropdownMenu.d.ts +0 -131
  18. package/dist/src/atoms/DropdownMenu/DropdownMenu.js +4 -4
  19. package/dist/src/atoms/Link/Link.js +4 -5
  20. package/dist/src/atoms/Navigation/Navigation.js +59 -22
  21. package/dist/src/atoms/PageHeader/PageHeader.js +18 -7
  22. package/dist/src/atoms/ProgressBar/ProgressBar.js +22 -11
  23. package/dist/src/atoms/RadioButton/RadioButton.js +12 -6
  24. package/dist/src/atoms/Section/Section.js +29 -11
  25. package/dist/src/atoms/Select/Select.js +92 -36
  26. package/dist/src/atoms/Stepper/Stepper.js +92 -30
  27. package/dist/src/atoms/Switch/Switch.js +24 -10
  28. package/dist/src/atoms/Table/Table.d.ts +294 -2
  29. package/dist/src/atoms/Table/Table.js +120 -35
  30. package/dist/src/atoms/Toast/Toast.d.ts +146 -0
  31. package/dist/src/atoms/Toast/Toast.js +34 -16
  32. package/dist/src/atoms/index.d.ts +1 -0
  33. package/dist/src/atoms/index.js +2 -1
  34. package/dist/src/molecules/Badge/Badge.js +3 -2
  35. package/dist/src/molecules/ChoiceChipGroup/ChoiceChipGroup.d.ts +65 -0
  36. package/dist/src/molecules/ChoiceChipGroup/ChoiceChipGroup.js +57 -0
  37. package/dist/src/molecules/Combobox/Combobox.js +2 -2
  38. package/dist/src/molecules/Drawer/Drawer.js +12 -4
  39. package/dist/src/molecules/Modal/Modal.js +12 -4
  40. package/dist/src/molecules/TagLabel/TagLabel.js +3 -2
  41. package/dist/src/molecules/index.d.ts +2 -1
  42. package/dist/src/molecules/index.js +3 -2
  43. package/dist/src/tokens/tokens.json +0 -209
  44. package/dist/styles.css +373 -368
  45. package/dist/system.cjs +2087 -1870
  46. package/dist/system.mjs +1909 -1693
  47. package/dist/tokens.json +0 -209
  48. package/dist/tsconfig.module.tsbuildinfo +1 -1
  49. package/dist/types/designTokens.d.ts +1 -1
  50. package/package.json +4 -4
  51. package/dist/src/molecules/ChoiceChip/ChoiceChip.d.ts +0 -24
  52. package/dist/src/molecules/ChoiceChip/ChoiceChip.js +0 -34
@@ -1,307 +1,307 @@
1
1
 
2
2
  // This file is autogenerated. Do not edit directly.
3
3
 
4
- $font-size-9xl: 8rem;
5
- $font-size-9xl-line-height: 1;
6
- $font-size-8xl: 6rem;
7
- $font-size-8xl-line-height: 1;
8
- $font-size-7xl: 4.5rem;
9
- $font-size-7xl-line-height: 1;
10
- $font-size-6xl: 3.75rem;
11
- $font-size-6xl-line-height: 1;
12
- $font-size-5xl: 3rem;
13
- $font-size-5xl-line-height: 1;
14
- $font-size-4xl: 2.25rem;
15
- $font-size-4xl-line-height: 2.5rem;
16
- $font-size-3xl: 1.875rem;
17
- $font-size-3xl-line-height: 2.25rem;
18
- $font-size-2xl: 1.5rem;
19
- $font-size-2xl-line-height: 2rem;
20
- $font-size-xl: 1.25rem;
21
- $font-size-xl-line-height: 1.75rem;
22
- $font-size-lg: 1.125rem;
23
- $font-size-lg-line-height: 1.75rem;
24
- $font-size-sm-line-height: 1.25rem;
25
- $font-size-sm: 0.875rem;
26
- $font-size-xs-line-height: 1rem;
27
- $font-size-xs: 0.75rem;
28
- $font-size-base-line-height: 1.5rem;
29
- $font-size-base: 1rem;
30
- $spacing-l7: 160px;
31
- $spacing-l6: 96px;
32
- $spacing-l5: 64px;
33
- $spacing-l4: 48px;
34
- $spacing-l3: 32px;
35
- $spacing-l2: 24px;
36
- $spacing-l1: 16px;
37
- $spacing-1px: 1px;
38
- $spacing-9: 48px;
39
- $spacing-8: 40px;
40
- $spacing-7: 32px;
41
- $spacing-6: 24px;
42
- $spacing-5: 16px;
43
- $spacing-4: 12px;
44
- $spacing-3: 8px;
45
- $spacing-2: 4px;
46
- $spacing-1: 2px;
47
- $spacing-0: 0px;
48
- $screens-xl: 1536px;
49
- $screens-lg: 1312px;
50
- $screens-md: 1056px;
51
- $screens-sm: 672px;
52
- $screens-xs: 320px;
53
- $screens-default: 0px;
54
- $elevations-2dp: 0px 2px 4px rgba(90, 91, 106, 0.24), 0px 1px 2px rgba(58, 58, 68, 0.24);
55
- $elevations-4dp: 0px 4px 8px rgba(90, 91, 106, 0.20), 0px 2px 4px rgba(58, 58, 68, 0.20);
56
- $elevations-8dp: 0px 8px 16px rgba(90, 91, 106, 0.16), 0px 4px 8px rgba(58, 58, 68, 0.16);
57
- $elevations-16dp: 0px 16px 32px rgba(90, 91, 106, 0.12), 0px 8px 16px rgba(58, 58, 68, 0.12);
58
- $elevations-24dp: 0px 24px 48px rgba(90, 91, 106, 0.08), 0px 12px 24px rgba(58, 58, 68, 0.08);
59
- $box-shadow-body-inset: inset 0 0 0 3px var(--aquarium-background-color-body);
60
- $colors-primary-100: rgba(14,22,82,1);
61
- $colors-primary-90: rgba(34,47,149,1);
62
- $colors-primary-80: rgba(53,69,190,1);
63
- $colors-primary-70: rgba(88,101,205,1);
64
- $colors-primary-60: rgba(129,142,236,1);
65
- $colors-primary-50: rgba(157,170,238,1);
66
- $colors-primary-40: rgba(185,197,239,1);
67
- $colors-primary-30: rgba(199,209,244,1);
68
- $colors-primary-20: rgba(213,221,250,1);
69
- $colors-primary-10: rgba(227,233,255,1);
70
- $colors-primary-5: rgba(243,246,255,1);
71
- $colors-primary-0: rgba(255,255,255,1);
72
- $colors-secondary-100: rgba(225,29,22,1);
73
- $colors-secondary-90: rgba(235,70,16,1);
74
- $colors-secondary-80: rgba(243,88,13,1);
75
- $colors-secondary-70: rgba(249,106,2,1);
76
- $colors-secondary-60: rgba(255,119,0,1);
77
- $colors-secondary-50: rgba(252,135,26,1);
78
- $colors-secondary-40: rgba(251,154,62,1);
79
- $colors-secondary-30: rgba(250,178,110,1);
80
- $colors-secondary-20: rgba(248,201,156,1);
81
- $colors-secondary-10: rgba(254,232,208,1);
82
- $colors-secondary-5: rgba(255,243,232,1);
83
- $colors-secondary-0: rgba(255,251,248,1);
84
- $colors-grey-100: rgba(25,25,29,1);
85
- $colors-grey-90: rgba(41,42,49,1);
86
- $colors-grey-80: rgba(58,58,68,1);
87
- $colors-grey-70: rgba(74,75,87,1);
88
- $colors-grey-60: rgba(90,91,106,1);
89
- $colors-grey-50: rgba(120,120,133,1);
90
- $colors-grey-40: rgba(150,150,160,1);
91
- $colors-grey-30: rgba(180,180,187,1);
92
- $colors-grey-20: rgba(210,210,214,1);
93
- $colors-grey-10: rgba(225,225,227,1);
94
- $colors-grey-5: rgba(237,237,240,1);
95
- $colors-grey-0: rgba(247,247,250,1);
96
- $colors-info-100: rgba(2,86,154,1);
97
- $colors-info-90: rgba(1,116,186,1);
98
- $colors-info-80: rgba(7,136,209,1);
99
- $colors-info-70: rgba(3,153,227,1);
100
- $colors-info-60: rgba(2,168,243,1);
101
- $colors-info-50: rgba(40,180,244,1);
102
- $colors-info-40: rgba(76,194,247,1);
103
- $colors-info-30: rgba(127,209,247,1);
104
- $colors-info-20: rgba(180,229,251,1);
105
- $colors-info-10: rgba(224,245,254,1);
106
- $colors-info-5: rgba(239,250,255,1);
107
- $colors-info-0: rgba(249,253,255,1);
108
- $colors-success-100: rgba(0,111,0,1);
109
- $colors-success-90: rgba(0,142,0,1);
110
- $colors-success-80: rgba(0,159,0,1);
111
- $colors-success-70: rgba(0,179,0,1);
112
- $colors-success-60: rgba(0,195,0,1);
113
- $colors-success-50: rgba(64,206,55,1);
114
- $colors-success-40: rgba(96,219,87,1);
115
- $colors-success-30: rgba(137,235,128,1);
116
- $colors-success-20: rgba(175,255,167,1);
117
- $colors-success-10: rgba(203,255,201,1);
118
- $colors-success-5: rgba(236,247,237,1);
119
- $colors-success-0: rgba(245,250,245,1);
120
- $colors-warning-100: rgba(254,109,0,1);
121
- $colors-warning-90: rgba(255,144,3,1);
122
- $colors-warning-80: rgba(253,159,0,1);
123
- $colors-warning-70: rgba(255,179,0,1);
124
- $colors-warning-60: rgba(255,193,7,1);
125
- $colors-warning-50: rgba(253,201,38,1);
126
- $colors-warning-40: rgba(253,212,77,1);
127
- $colors-warning-30: rgba(253,223,129,1);
128
- $colors-warning-20: rgba(254,235,178,1);
129
- $colors-warning-10: rgba(255,242,205,1);
130
- $colors-warning-5: rgba(255,248,234,1);
131
- $colors-warning-0: rgba(255,253,249,1);
132
- $colors-error-100: rgba(170,0,0,1);
133
- $colors-error-90: rgba(185,0,0,1);
134
- $colors-error-80: rgba(197,0,1,1);
135
- $colors-error-70: rgba(216,0,5,1);
136
- $colors-error-60: rgba(231,0,0,1);
137
- $colors-error-50: rgba(230,39,40,1);
138
- $colors-error-40: rgba(224,80,79,1);
139
- $colors-error-30: rgba(237,121,117,1);
140
- $colors-error-20: rgba(255,173,179,1);
141
- $colors-error-10: rgba(255,203,210,1);
142
- $colors-error-5: rgba(254,232,231,1);
143
- $colors-error-0: rgba(254,242,241,1);
144
- $colors-current: currentColor;
145
- $colors-transparent: transparent;
146
- $colors-black: black;
147
- $colors-white: white;
148
- $chart-colors-secondary-categorical-41: rgba(255, 173, 179, 1);
149
- $chart-colors-secondary-categorical-40: rgba(180, 229, 251, 1);
150
- $chart-colors-secondary-categorical-39: rgba(250, 178, 110, 1);
151
- $chart-colors-secondary-categorical-38: rgba(137, 235, 128, 1);
152
- $chart-colors-secondary-categorical-37: rgba(255, 169, 201, 1);
153
- $chart-colors-secondary-categorical-36: rgba(253, 212, 77, 1);
154
- $chart-colors-secondary-categorical-35: rgba(185, 197, 239, 1);
155
- $chart-colors-secondary-categorical-34: rgba(224, 80, 79, 1);
156
- $chart-colors-secondary-categorical-33: rgba(127, 209, 247, 1);
157
- $chart-colors-secondary-categorical-32: rgba(252, 135, 26, 1);
158
- $chart-colors-secondary-categorical-31: rgba(96, 219, 87, 1);
159
- $chart-colors-secondary-categorical-30: rgba(255, 111, 148, 1);
160
- $chart-colors-secondary-categorical-29: rgba(255, 193, 7, 1);
161
- $chart-colors-secondary-categorical-28: rgba(129, 142, 236, 1);
162
- $chart-colors-secondary-categorical-27: rgba(230, 39, 40, 1);
163
- $chart-colors-secondary-categorical-26: rgba(40, 180, 244, 1);
164
- $chart-colors-secondary-categorical-25: rgba(249, 106, 2, 1);
165
- $chart-colors-secondary-categorical-24: rgba(0, 195, 0, 1);
166
- $chart-colors-secondary-categorical-23: rgba(255, 82, 117, 1);
167
- $chart-colors-secondary-categorical-22: rgba(255, 179, 0, 1);
168
- $chart-colors-secondary-categorical-21: rgba(88, 101, 205, 1);
169
- $chart-colors-secondary-categorical-20: rgba(14, 22, 82, 1);
170
- $chart-colors-secondary-categorical-19: rgba(254, 109, 0, 1);
171
- $chart-colors-secondary-categorical-18: rgba(0, 111, 0, 1);
172
- $chart-colors-secondary-categorical-17: rgba(167, 0, 69, 1);
173
- $chart-colors-secondary-categorical-16: rgba(2, 86, 154, 1);
174
- $chart-colors-secondary-categorical-15: rgba(170, 0, 0, 1);
175
- $chart-colors-secondary-categorical-14: rgba(225, 29, 22, 1);
176
- $chart-colors-secondary-categorical-13: rgba(197, 0, 1, 1);
177
- $chart-colors-secondary-categorical-12: rgba(1, 116, 186, 1);
178
- $chart-colors-secondary-categorical-11: rgba(235, 70, 16, 1);
179
- $chart-colors-secondary-categorical-10: rgba(0, 159, 0, 1);
180
- $chart-colors-secondary-categorical-9: rgba(228, 26, 74, 1);
181
- $chart-colors-secondary-categorical-8: rgba(255, 144, 3, 1);
182
- $chart-colors-secondary-categorical-7: rgba(34, 47, 149, 1);
183
- $chart-colors-secondary-categorical-6: rgba(231, 0, 0, 1);
184
- $chart-colors-secondary-categorical-5: rgba(3, 153, 227, 1);
185
- $chart-colors-secondary-categorical-4: rgba(243, 88, 13, 1);
186
- $chart-colors-secondary-categorical-3: rgba(0, 179, 0, 1);
187
- $chart-colors-secondary-categorical-2: rgba(255, 53, 84, 1);
188
- $chart-colors-secondary-categorical-1: rgba(253, 159, 0, 1);
189
- $chart-colors-secondary-categorical-0: rgba(53, 69, 190, 1);
190
- $chart-colors-primary-categorical-5: rgba(255, 193, 7, 1);
191
- $chart-colors-primary-categorical-4: rgba(0, 179, 0, 1);
192
- $chart-colors-primary-categorical-3: rgba(249, 106, 2, 1);
193
- $chart-colors-primary-categorical-2: rgba(40, 180, 244, 1);
194
- $chart-colors-primary-categorical-1: rgba(255, 53, 84, 1);
195
- $chart-colors-primary-categorical-0: rgba(88, 101, 205, 1);
196
- $chart-colors-default: rgba(180, 180, 187, 1);
197
- $background-color-icon-button-hover: rgba(25,25,29,.05);
198
- $border-width-default: 1px;
199
- $border-width-8: 8px;
200
- $border-width-4: 4px;
201
- $border-width-2: 2px;
202
- $border-width-1: 1px;
203
- $border-width-0: 0px;
204
- $border-radius-none: 0px;
205
- $border-radius-sm: 0.125rem;
206
- $border-radius-md: 0.375rem;
207
- $border-radius-lg: 0.5rem;
208
- $border-radius-xl: 0.75rem;
209
- $border-radius-2xl: 1rem;
210
- $border-radius-3xl: 1.5rem;
211
- $border-radius-full: 9999px;
212
4
  $border-radius-default: 4px;
213
- $margin-l7: $spacing-l7;
214
- $margin-l6: $spacing-l6;
215
- $margin-l5: $spacing-l5;
216
- $margin-l4: $spacing-l4;
217
- $margin-l3: $spacing-l3;
218
- $margin-l2: $spacing-l2;
219
- $margin-l1: $spacing-l1;
220
- $margin-1px: $spacing-1px;
221
- $margin-9: $spacing-9;
222
- $margin-8: $spacing-8;
223
- $margin-7: $spacing-7;
224
- $margin-6: $spacing-6;
225
- $margin-5: $spacing-5;
226
- $margin-4: $spacing-4;
227
- $margin-3: $spacing-3;
228
- $margin-2: $spacing-2;
229
- $margin-1: $spacing-1;
230
- $margin-0: $spacing-0;
231
- $box-shadow-2dp: $elevations-2dp;
232
- $box-shadow-4dp: $elevations-4dp;
233
- $box-shadow-8dp: $elevations-8dp;
234
- $box-shadow-16dp: $elevations-16dp;
235
- $box-shadow-24dp: $elevations-24dp;
236
- $text-color-danger-intense: $colors-error-80;
237
- $text-color-danger-default: $colors-error-50;
238
- $text-color-danger-muted: $colors-error-20;
239
- $text-color-danger-inactive: $colors-error-10;
240
- $text-color-warning-intense: $colors-warning-100;
241
- $text-color-warning-default: $colors-warning-80;
242
- $text-color-warning-muted: $colors-warning-40;
243
- $text-color-warning-inactive: $colors-warning-20;
244
- $text-color-success-intense: $colors-success-90;
245
- $text-color-success-default: $colors-success-70;
246
- $text-color-success-muted: $colors-success-30;
247
- $text-color-success-inactive: $colors-success-10;
248
- $text-color-info-intense: $colors-info-90;
249
- $text-color-info-default: $colors-info-70;
250
- $text-color-info-muted: $colors-info-40;
251
- $text-color-info-inactive: $colors-info-20;
252
- $text-color-primary-intense: $colors-primary-80;
253
- $text-color-primary-default: $colors-primary-70;
254
- $text-color-primary-muted: $colors-primary-60;
255
- $text-color-primary-active: $colors-primary-90;
256
- $text-color-primary-inactive: $colors-primary-40;
257
- $text-color-opposite-default: $colors-white;
258
- $text-color-intense: $colors-grey-90;
259
- $text-color-default: $colors-grey-70;
260
- $text-color-muted: $colors-grey-50;
261
- $text-color-inactive: $colors-grey-40;
262
- $border-color-danger-intense: $colors-error-80;
263
- $border-color-danger-default: $colors-error-50;
264
- $border-color-danger-muted: $colors-error-10;
265
- $border-color-warning-intense: $colors-warning-90;
266
- $border-color-warning-default: $colors-warning-70;
267
- $border-color-warning-muted: $colors-warning-20;
268
- $border-color-success-intense: $colors-success-70;
269
- $border-color-success-default: $colors-success-40;
270
- $border-color-success-muted: $colors-success-10;
271
- $border-color-info-intense: $colors-info-90;
272
- $border-color-info-default: $colors-info-70;
273
- $border-color-info-muted: $colors-info-50;
274
- $border-color-primary-intense: $colors-primary-100;
275
- $border-color-primary-default: $colors-primary-80;
276
- $border-color-primary-muted: $colors-primary-60;
277
- $border-color-intense: $colors-grey-50;
278
- $border-color-default: $colors-grey-20;
279
- $border-color-muted: $colors-grey-5;
280
- $background-color-status-success: $colors-success-5;
281
- $background-color-status-danger: $colors-error-5;
282
- $background-color-status-warning: $colors-warning-5;
283
- $background-color-status-info: $colors-info-10;
284
- $background-color-status-announcement: $colors-primary-5;
285
- $background-color-danger-intense: $colors-error-50;
286
- $background-color-danger-default: $colors-error-20;
287
- $background-color-danger-muted: $colors-error-10;
288
- $background-color-warning-intense: $colors-warning-90;
289
- $background-color-warning-default: $colors-warning-70;
290
- $background-color-warning-muted: $colors-warning-5;
291
- $background-color-success-intense: $colors-success-90;
292
- $background-color-success-default: $colors-success-70;
293
- $background-color-success-muted: $colors-success-5;
294
- $background-color-info-intense: $colors-info-90;
295
- $background-color-info-default: $colors-info-70;
296
- $background-color-info-muted: $colors-info-10;
297
- $background-color-primary-hover: $colors-primary-5;
298
- $background-color-primary-active: $colors-primary-5;
299
- $background-color-primary-intense: $colors-primary-90;
300
- $background-color-primary-default: $colors-primary-80;
301
- $background-color-primary-muted: $colors-primary-40;
302
- $background-color-intense: $colors-grey-20;
303
- $background-color-default: $colors-grey-5;
304
- $background-color-muted: $colors-grey-0;
305
- $background-color-popover-content: $colors-white;
306
- $background-color-body-intense: $colors-grey-80;
5
+ $border-radius-full: 9999px;
6
+ $border-radius-3xl: 1.5rem;
7
+ $border-radius-2xl: 1rem;
8
+ $border-radius-xl: 0.75rem;
9
+ $border-radius-lg: 0.5rem;
10
+ $border-radius-md: 0.375rem;
11
+ $border-radius-sm: 0.125rem;
12
+ $border-radius-none: 0px;
13
+ $border-width-0: 0px;
14
+ $border-width-1: 1px;
15
+ $border-width-2: 2px;
16
+ $border-width-4: 4px;
17
+ $border-width-8: 8px;
18
+ $border-width-default: 1px;
19
+ $background-color-icon-button-hover: rgba(25,25,29,.05);
20
+ $chart-colors-default: rgba(180, 180, 187, 1);
21
+ $chart-colors-primary-categorical-0: rgba(88, 101, 205, 1);
22
+ $chart-colors-primary-categorical-1: rgba(255, 53, 84, 1);
23
+ $chart-colors-primary-categorical-2: rgba(40, 180, 244, 1);
24
+ $chart-colors-primary-categorical-3: rgba(249, 106, 2, 1);
25
+ $chart-colors-primary-categorical-4: rgba(0, 179, 0, 1);
26
+ $chart-colors-primary-categorical-5: rgba(255, 193, 7, 1);
27
+ $chart-colors-secondary-categorical-0: rgba(53, 69, 190, 1);
28
+ $chart-colors-secondary-categorical-1: rgba(253, 159, 0, 1);
29
+ $chart-colors-secondary-categorical-2: rgba(255, 53, 84, 1);
30
+ $chart-colors-secondary-categorical-3: rgba(0, 179, 0, 1);
31
+ $chart-colors-secondary-categorical-4: rgba(243, 88, 13, 1);
32
+ $chart-colors-secondary-categorical-5: rgba(3, 153, 227, 1);
33
+ $chart-colors-secondary-categorical-6: rgba(231, 0, 0, 1);
34
+ $chart-colors-secondary-categorical-7: rgba(34, 47, 149, 1);
35
+ $chart-colors-secondary-categorical-8: rgba(255, 144, 3, 1);
36
+ $chart-colors-secondary-categorical-9: rgba(228, 26, 74, 1);
37
+ $chart-colors-secondary-categorical-10: rgba(0, 159, 0, 1);
38
+ $chart-colors-secondary-categorical-11: rgba(235, 70, 16, 1);
39
+ $chart-colors-secondary-categorical-12: rgba(1, 116, 186, 1);
40
+ $chart-colors-secondary-categorical-13: rgba(197, 0, 1, 1);
41
+ $chart-colors-secondary-categorical-14: rgba(225, 29, 22, 1);
42
+ $chart-colors-secondary-categorical-15: rgba(170, 0, 0, 1);
43
+ $chart-colors-secondary-categorical-16: rgba(2, 86, 154, 1);
44
+ $chart-colors-secondary-categorical-17: rgba(167, 0, 69, 1);
45
+ $chart-colors-secondary-categorical-18: rgba(0, 111, 0, 1);
46
+ $chart-colors-secondary-categorical-19: rgba(254, 109, 0, 1);
47
+ $chart-colors-secondary-categorical-20: rgba(14, 22, 82, 1);
48
+ $chart-colors-secondary-categorical-21: rgba(88, 101, 205, 1);
49
+ $chart-colors-secondary-categorical-22: rgba(255, 179, 0, 1);
50
+ $chart-colors-secondary-categorical-23: rgba(255, 82, 117, 1);
51
+ $chart-colors-secondary-categorical-24: rgba(0, 195, 0, 1);
52
+ $chart-colors-secondary-categorical-25: rgba(249, 106, 2, 1);
53
+ $chart-colors-secondary-categorical-26: rgba(40, 180, 244, 1);
54
+ $chart-colors-secondary-categorical-27: rgba(230, 39, 40, 1);
55
+ $chart-colors-secondary-categorical-28: rgba(129, 142, 236, 1);
56
+ $chart-colors-secondary-categorical-29: rgba(255, 193, 7, 1);
57
+ $chart-colors-secondary-categorical-30: rgba(255, 111, 148, 1);
58
+ $chart-colors-secondary-categorical-31: rgba(96, 219, 87, 1);
59
+ $chart-colors-secondary-categorical-32: rgba(252, 135, 26, 1);
60
+ $chart-colors-secondary-categorical-33: rgba(127, 209, 247, 1);
61
+ $chart-colors-secondary-categorical-34: rgba(224, 80, 79, 1);
62
+ $chart-colors-secondary-categorical-35: rgba(185, 197, 239, 1);
63
+ $chart-colors-secondary-categorical-36: rgba(253, 212, 77, 1);
64
+ $chart-colors-secondary-categorical-37: rgba(255, 169, 201, 1);
65
+ $chart-colors-secondary-categorical-38: rgba(137, 235, 128, 1);
66
+ $chart-colors-secondary-categorical-39: rgba(250, 178, 110, 1);
67
+ $chart-colors-secondary-categorical-40: rgba(180, 229, 251, 1);
68
+ $chart-colors-secondary-categorical-41: rgba(255, 173, 179, 1);
69
+ $colors-white: white;
70
+ $colors-black: black;
71
+ $colors-transparent: transparent;
72
+ $colors-current: currentColor;
73
+ $colors-error-0: rgba(254,242,241,1);
74
+ $colors-error-5: rgba(254,232,231,1);
75
+ $colors-error-10: rgba(255,203,210,1);
76
+ $colors-error-20: rgba(255,173,179,1);
77
+ $colors-error-30: rgba(237,121,117,1);
78
+ $colors-error-40: rgba(224,80,79,1);
79
+ $colors-error-50: rgba(230,39,40,1);
80
+ $colors-error-60: rgba(231,0,0,1);
81
+ $colors-error-70: rgba(216,0,5,1);
82
+ $colors-error-80: rgba(197,0,1,1);
83
+ $colors-error-90: rgba(185,0,0,1);
84
+ $colors-error-100: rgba(170,0,0,1);
85
+ $colors-warning-0: rgba(255,253,249,1);
86
+ $colors-warning-5: rgba(255,248,234,1);
87
+ $colors-warning-10: rgba(255,242,205,1);
88
+ $colors-warning-20: rgba(254,235,178,1);
89
+ $colors-warning-30: rgba(253,223,129,1);
90
+ $colors-warning-40: rgba(253,212,77,1);
91
+ $colors-warning-50: rgba(253,201,38,1);
92
+ $colors-warning-60: rgba(255,193,7,1);
93
+ $colors-warning-70: rgba(255,179,0,1);
94
+ $colors-warning-80: rgba(253,159,0,1);
95
+ $colors-warning-90: rgba(255,144,3,1);
96
+ $colors-warning-100: rgba(254,109,0,1);
97
+ $colors-success-0: rgba(245,250,245,1);
98
+ $colors-success-5: rgba(236,247,237,1);
99
+ $colors-success-10: rgba(203,255,201,1);
100
+ $colors-success-20: rgba(175,255,167,1);
101
+ $colors-success-30: rgba(137,235,128,1);
102
+ $colors-success-40: rgba(96,219,87,1);
103
+ $colors-success-50: rgba(64,206,55,1);
104
+ $colors-success-60: rgba(0,195,0,1);
105
+ $colors-success-70: rgba(0,179,0,1);
106
+ $colors-success-80: rgba(0,159,0,1);
107
+ $colors-success-90: rgba(0,142,0,1);
108
+ $colors-success-100: rgba(0,111,0,1);
109
+ $colors-info-0: rgba(249,253,255,1);
110
+ $colors-info-5: rgba(239,250,255,1);
111
+ $colors-info-10: rgba(224,245,254,1);
112
+ $colors-info-20: rgba(180,229,251,1);
113
+ $colors-info-30: rgba(127,209,247,1);
114
+ $colors-info-40: rgba(76,194,247,1);
115
+ $colors-info-50: rgba(40,180,244,1);
116
+ $colors-info-60: rgba(2,168,243,1);
117
+ $colors-info-70: rgba(3,153,227,1);
118
+ $colors-info-80: rgba(7,136,209,1);
119
+ $colors-info-90: rgba(1,116,186,1);
120
+ $colors-info-100: rgba(2,86,154,1);
121
+ $colors-grey-0: rgba(247,247,250,1);
122
+ $colors-grey-5: rgba(237,237,240,1);
123
+ $colors-grey-10: rgba(225,225,227,1);
124
+ $colors-grey-20: rgba(210,210,214,1);
125
+ $colors-grey-30: rgba(180,180,187,1);
126
+ $colors-grey-40: rgba(150,150,160,1);
127
+ $colors-grey-50: rgba(120,120,133,1);
128
+ $colors-grey-60: rgba(90,91,106,1);
129
+ $colors-grey-70: rgba(74,75,87,1);
130
+ $colors-grey-80: rgba(58,58,68,1);
131
+ $colors-grey-90: rgba(41,42,49,1);
132
+ $colors-grey-100: rgba(25,25,29,1);
133
+ $colors-secondary-0: rgba(255,251,248,1);
134
+ $colors-secondary-5: rgba(255,243,232,1);
135
+ $colors-secondary-10: rgba(254,232,208,1);
136
+ $colors-secondary-20: rgba(248,201,156,1);
137
+ $colors-secondary-30: rgba(250,178,110,1);
138
+ $colors-secondary-40: rgba(251,154,62,1);
139
+ $colors-secondary-50: rgba(252,135,26,1);
140
+ $colors-secondary-60: rgba(255,119,0,1);
141
+ $colors-secondary-70: rgba(249,106,2,1);
142
+ $colors-secondary-80: rgba(243,88,13,1);
143
+ $colors-secondary-90: rgba(235,70,16,1);
144
+ $colors-secondary-100: rgba(225,29,22,1);
145
+ $colors-primary-0: rgba(255,255,255,1);
146
+ $colors-primary-5: rgba(243,246,255,1);
147
+ $colors-primary-10: rgba(227,233,255,1);
148
+ $colors-primary-20: rgba(213,221,250,1);
149
+ $colors-primary-30: rgba(199,209,244,1);
150
+ $colors-primary-40: rgba(185,197,239,1);
151
+ $colors-primary-50: rgba(157,170,238,1);
152
+ $colors-primary-60: rgba(129,142,236,1);
153
+ $colors-primary-70: rgba(88,101,205,1);
154
+ $colors-primary-80: rgba(53,69,190,1);
155
+ $colors-primary-90: rgba(34,47,149,1);
156
+ $colors-primary-100: rgba(14,22,82,1);
157
+ $box-shadow-body-inset: inset 0 0 0 3px var(--aquarium-background-color-body);
158
+ $elevations-24dp: 0px 24px 48px rgba(90, 91, 106, 0.08), 0px 12px 24px rgba(58, 58, 68, 0.08);
159
+ $elevations-16dp: 0px 16px 32px rgba(90, 91, 106, 0.12), 0px 8px 16px rgba(58, 58, 68, 0.12);
160
+ $elevations-8dp: 0px 8px 16px rgba(90, 91, 106, 0.16), 0px 4px 8px rgba(58, 58, 68, 0.16);
161
+ $elevations-4dp: 0px 4px 8px rgba(90, 91, 106, 0.20), 0px 2px 4px rgba(58, 58, 68, 0.20);
162
+ $elevations-2dp: 0px 2px 4px rgba(90, 91, 106, 0.24), 0px 1px 2px rgba(58, 58, 68, 0.24);
163
+ $screens-default: 0px;
164
+ $screens-xs: 320px;
165
+ $screens-sm: 672px;
166
+ $screens-md: 1056px;
167
+ $screens-lg: 1312px;
168
+ $screens-xl: 1536px;
169
+ $spacing-0: 0px;
170
+ $spacing-1: 2px;
171
+ $spacing-2: 4px;
172
+ $spacing-3: 8px;
173
+ $spacing-4: 12px;
174
+ $spacing-5: 16px;
175
+ $spacing-6: 24px;
176
+ $spacing-7: 32px;
177
+ $spacing-8: 40px;
178
+ $spacing-9: 48px;
179
+ $spacing-1px: 1px;
180
+ $spacing-l1: 16px;
181
+ $spacing-l2: 24px;
182
+ $spacing-l3: 32px;
183
+ $spacing-l4: 48px;
184
+ $spacing-l5: 64px;
185
+ $spacing-l6: 96px;
186
+ $spacing-l7: 160px;
187
+ $font-size-base: 1rem;
188
+ $font-size-base-line-height: 1.5rem;
189
+ $font-size-xs: 0.75rem;
190
+ $font-size-xs-line-height: 1rem;
191
+ $font-size-sm: 0.875rem;
192
+ $font-size-sm-line-height: 1.25rem;
193
+ $font-size-lg-line-height: 1.75rem;
194
+ $font-size-lg: 1.125rem;
195
+ $font-size-xl-line-height: 1.75rem;
196
+ $font-size-xl: 1.25rem;
197
+ $font-size-2xl-line-height: 2rem;
198
+ $font-size-2xl: 1.5rem;
199
+ $font-size-3xl-line-height: 2.25rem;
200
+ $font-size-3xl: 1.875rem;
201
+ $font-size-4xl-line-height: 2.5rem;
202
+ $font-size-4xl: 2.25rem;
203
+ $font-size-5xl-line-height: 1;
204
+ $font-size-5xl: 3rem;
205
+ $font-size-6xl-line-height: 1;
206
+ $font-size-6xl: 3.75rem;
207
+ $font-size-7xl-line-height: 1;
208
+ $font-size-7xl: 4.5rem;
209
+ $font-size-8xl-line-height: 1;
210
+ $font-size-8xl: 6rem;
211
+ $font-size-9xl-line-height: 1;
212
+ $font-size-9xl: 8rem;
307
213
  $background-color-body: $colors-white;
214
+ $background-color-body-intense: $colors-grey-80;
215
+ $background-color-popover-content: $colors-white;
216
+ $background-color-muted: $colors-grey-0;
217
+ $background-color-default: $colors-grey-5;
218
+ $background-color-intense: $colors-grey-20;
219
+ $background-color-primary-muted: $colors-primary-40;
220
+ $background-color-primary-default: $colors-primary-80;
221
+ $background-color-primary-intense: $colors-primary-90;
222
+ $background-color-primary-active: $colors-primary-5;
223
+ $background-color-primary-hover: $colors-primary-5;
224
+ $background-color-info-muted: $colors-info-10;
225
+ $background-color-info-default: $colors-info-70;
226
+ $background-color-info-intense: $colors-info-90;
227
+ $background-color-success-muted: $colors-success-5;
228
+ $background-color-success-default: $colors-success-70;
229
+ $background-color-success-intense: $colors-success-90;
230
+ $background-color-warning-muted: $colors-warning-5;
231
+ $background-color-warning-default: $colors-warning-70;
232
+ $background-color-warning-intense: $colors-warning-90;
233
+ $background-color-danger-muted: $colors-error-10;
234
+ $background-color-danger-default: $colors-error-20;
235
+ $background-color-danger-intense: $colors-error-50;
236
+ $background-color-status-announcement: $colors-primary-5;
237
+ $background-color-status-info: $colors-info-10;
238
+ $background-color-status-warning: $colors-warning-5;
239
+ $background-color-status-danger: $colors-error-5;
240
+ $background-color-status-success: $colors-success-5;
241
+ $border-color-muted: $colors-grey-5;
242
+ $border-color-default: $colors-grey-20;
243
+ $border-color-intense: $colors-grey-50;
244
+ $border-color-primary-muted: $colors-primary-60;
245
+ $border-color-primary-default: $colors-primary-80;
246
+ $border-color-primary-intense: $colors-primary-100;
247
+ $border-color-info-muted: $colors-info-50;
248
+ $border-color-info-default: $colors-info-70;
249
+ $border-color-info-intense: $colors-info-90;
250
+ $border-color-success-muted: $colors-success-10;
251
+ $border-color-success-default: $colors-success-40;
252
+ $border-color-success-intense: $colors-success-70;
253
+ $border-color-warning-muted: $colors-warning-20;
254
+ $border-color-warning-default: $colors-warning-70;
255
+ $border-color-warning-intense: $colors-warning-90;
256
+ $border-color-danger-muted: $colors-error-10;
257
+ $border-color-danger-default: $colors-error-50;
258
+ $border-color-danger-intense: $colors-error-80;
259
+ $text-color-inactive: $colors-grey-40;
260
+ $text-color-muted: $colors-grey-50;
261
+ $text-color-default: $colors-grey-70;
262
+ $text-color-intense: $colors-grey-90;
263
+ $text-color-opposite-default: $colors-white;
264
+ $text-color-primary-inactive: $colors-primary-40;
265
+ $text-color-primary-active: $colors-primary-90;
266
+ $text-color-primary-muted: $colors-primary-60;
267
+ $text-color-primary-default: $colors-primary-70;
268
+ $text-color-primary-intense: $colors-primary-80;
269
+ $text-color-info-inactive: $colors-info-20;
270
+ $text-color-info-muted: $colors-info-40;
271
+ $text-color-info-default: $colors-info-70;
272
+ $text-color-info-intense: $colors-info-90;
273
+ $text-color-success-inactive: $colors-success-10;
274
+ $text-color-success-muted: $colors-success-30;
275
+ $text-color-success-default: $colors-success-70;
276
+ $text-color-success-intense: $colors-success-90;
277
+ $text-color-warning-inactive: $colors-warning-20;
278
+ $text-color-warning-muted: $colors-warning-40;
279
+ $text-color-warning-default: $colors-warning-80;
280
+ $text-color-warning-intense: $colors-warning-100;
281
+ $text-color-danger-inactive: $colors-error-10;
282
+ $text-color-danger-muted: $colors-error-20;
283
+ $text-color-danger-default: $colors-error-50;
284
+ $text-color-danger-intense: $colors-error-80;
285
+ $box-shadow-24dp: $elevations-24dp;
286
+ $box-shadow-16dp: $elevations-16dp;
287
+ $box-shadow-8dp: $elevations-8dp;
288
+ $box-shadow-4dp: $elevations-4dp;
289
+ $box-shadow-2dp: $elevations-2dp;
290
+ $margin-0: $spacing-0;
291
+ $margin-1: $spacing-1;
292
+ $margin-2: $spacing-2;
293
+ $margin-3: $spacing-3;
294
+ $margin-4: $spacing-4;
295
+ $margin-5: $spacing-5;
296
+ $margin-6: $spacing-6;
297
+ $margin-7: $spacing-7;
298
+ $margin-8: $spacing-8;
299
+ $margin-9: $spacing-9;
300
+ $margin-1px: $spacing-1px;
301
+ $margin-l1: $spacing-l1;
302
+ $margin-l2: $spacing-l2;
303
+ $margin-l3: $spacing-l3;
304
+ $margin-l4: $spacing-l4;
305
+ $margin-l5: $spacing-l5;
306
+ $margin-l6: $spacing-l6;
307
+ $margin-l7: $spacing-l7;