@redgate/brand-web-toolkit 0.0.7 → 0.0.8
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/components/notification/Notification.d.ts +7 -0
- package/components/notification/Notification.js +39 -0
- package/components/notification/Notification.js.map +1 -0
- package/components/notification/index.d.ts +2 -0
- package/components/notification/index.js +2 -0
- package/components/notification/index.js.map +1 -0
- package/package.json +1 -1
- package/tailwindcss/pass.css +75 -0
- package/tailwindcss/redgate.css +75 -0
- package/tailwindcss/sql-server-central.css +75 -0
- package/tailwindcss/src/pass/input.css +4 -0
- package/tailwindcss/src/redgate/input.css +4 -0
- package/tailwindcss/src/sql-server-central/input.css +4 -0
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { IIcon } from '../icons/Icon';
|
|
2
|
+
export type INotification = {
|
|
3
|
+
type: 'info' | 'fail' | 'success' | 'warning';
|
|
4
|
+
icon?: boolean | IIcon['icon'];
|
|
5
|
+
children: React.ReactElement;
|
|
6
|
+
};
|
|
7
|
+
export default function Notification({ type, icon, children }: INotification): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
2
|
+
import Icon from '../icons/Icon.js';
|
|
3
|
+
|
|
4
|
+
function NotificationIcon({ type, icon, }) {
|
|
5
|
+
if (icon === false || icon === undefined) {
|
|
6
|
+
return null;
|
|
7
|
+
}
|
|
8
|
+
const defaultIcon = {
|
|
9
|
+
info: 'PlusCircle',
|
|
10
|
+
fail: 'CloseCircle',
|
|
11
|
+
success: 'TickCircle',
|
|
12
|
+
warning: 'MinusCircle',
|
|
13
|
+
};
|
|
14
|
+
return jsx(Icon, { icon: icon === true ? defaultIcon[type] : icon, size: 24 });
|
|
15
|
+
}
|
|
16
|
+
function Notification({ type, icon, children }) {
|
|
17
|
+
const notificationColours = {
|
|
18
|
+
info: {
|
|
19
|
+
border: 'border-fg-info-secondary',
|
|
20
|
+
text: 'text-fg-info-secondary',
|
|
21
|
+
},
|
|
22
|
+
fail: {
|
|
23
|
+
border: 'border-fg-error-secondary',
|
|
24
|
+
text: 'text-fg-error-secondary',
|
|
25
|
+
},
|
|
26
|
+
success: {
|
|
27
|
+
border: 'border-fg-success-secondary',
|
|
28
|
+
text: 'text-fg-success-secondary',
|
|
29
|
+
},
|
|
30
|
+
warning: {
|
|
31
|
+
border: 'border-fg-warning-secondary',
|
|
32
|
+
text: 'text-fg-warning-secondary',
|
|
33
|
+
},
|
|
34
|
+
};
|
|
35
|
+
return (jsx("div", { className: `flex bg-bg-secondary p-5 border-l-10 ${notificationColours[type].border}`, children: jsxs("div", { className: `flex grow items-start gap-5`, children: [icon && (jsx("span", { className: notificationColours[type].text, children: jsx(NotificationIcon, { type: type, icon: icon }) })), jsx("div", { className: "flex flex-col grow", children: children })] }) }));
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
export { Notification as default };
|
|
39
|
+
//# sourceMappingURL=Notification.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"Notification.js","sources":["../../../../components/notification/Notification.tsx"],"sourcesContent":["import Icon, { IIcon } from '../icons/Icon';\n\nexport type INotification = {\n type: 'info' | 'fail' | 'success' | 'warning';\n icon?: boolean | IIcon['icon'];\n children: React.ReactElement;\n};\n\nfunction NotificationIcon({\n type,\n icon,\n}: {\n type: INotification['type'];\n icon: INotification['icon'];\n}) {\n if (icon === false || icon === undefined) {\n return null;\n }\n\n const defaultIcon: Record<INotification['type'], IIcon['icon']> = {\n info: 'PlusCircle',\n fail: 'CloseCircle',\n success: 'TickCircle',\n warning: 'MinusCircle',\n };\n\n return <Icon icon={icon === true ? defaultIcon[type] : icon} size={24} />;\n}\n\nexport default function Notification({ type, icon, children }: INotification) {\n const notificationColours: Record<\n INotification['type'],\n { border: string; text: string }\n > = {\n info: {\n border: 'border-fg-info-secondary',\n text: 'text-fg-info-secondary',\n },\n fail: {\n border: 'border-fg-error-secondary',\n text: 'text-fg-error-secondary',\n },\n success: {\n border: 'border-fg-success-secondary',\n text: 'text-fg-success-secondary',\n },\n warning: {\n border: 'border-fg-warning-secondary',\n text: 'text-fg-warning-secondary',\n },\n };\n\n return (\n <div\n className={`flex bg-bg-secondary p-5 border-l-10 ${notificationColours[type].border}`}\n >\n <div className={`flex grow items-start gap-5`}>\n {icon && (\n <span className={notificationColours[type].text}>\n <NotificationIcon type={type} icon={icon} />\n </span>\n )}\n <div className=\"flex flex-col grow\">{children}</div>\n </div>\n </div>\n );\n}\n"],"names":["_jsx","_jsxs"],"mappings":";;;AAQA,SAAS,gBAAgB,CAAC,EACtB,IAAI,EACJ,IAAI,GAIP,EAAA;IACG,IAAI,IAAI,KAAK,KAAK,IAAI,IAAI,KAAK,SAAS,EAAE;AACtC,QAAA,OAAO,IAAI;IACf;AAEA,IAAA,MAAM,WAAW,GAAiD;AAC9D,QAAA,IAAI,EAAE,YAAY;AAClB,QAAA,IAAI,EAAE,aAAa;AACnB,QAAA,OAAO,EAAE,YAAY;AACrB,QAAA,OAAO,EAAE,aAAa;KACzB;IAED,OAAOA,GAAA,CAAC,IAAI,EAAA,EAAC,IAAI,EAAE,IAAI,KAAK,IAAI,GAAG,WAAW,CAAC,IAAI,CAAC,GAAG,IAAI,EAAE,IAAI,EAAE,EAAE,EAAA,CAAI;AAC7E;AAEc,SAAU,YAAY,CAAC,EAAE,IAAI,EAAE,IAAI,EAAE,QAAQ,EAAiB,EAAA;AACxE,IAAA,MAAM,mBAAmB,GAGrB;AACA,QAAA,IAAI,EAAE;AACF,YAAA,MAAM,EAAE,0BAA0B;AAClC,YAAA,IAAI,EAAE,wBAAwB;AACjC,SAAA;AACD,QAAA,IAAI,EAAE;AACF,YAAA,MAAM,EAAE,2BAA2B;AACnC,YAAA,IAAI,EAAE,yBAAyB;AAClC,SAAA;AACD,QAAA,OAAO,EAAE;AACL,YAAA,MAAM,EAAE,6BAA6B;AACrC,YAAA,IAAI,EAAE,2BAA2B;AACpC,SAAA;AACD,QAAA,OAAO,EAAE;AACL,YAAA,MAAM,EAAE,6BAA6B;AACrC,YAAA,IAAI,EAAE,2BAA2B;AACpC,SAAA;KACJ;IAED,QACIA,GAAA,CAAA,KAAA,EAAA,EACI,SAAS,EAAE,CAAA,qCAAA,EAAwC,mBAAmB,CAAC,IAAI,CAAC,CAAC,MAAM,CAAA,CAAE,YAErFC,IAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAE,CAAA,2BAAA,CAA6B,EAAA,QAAA,EAAA,CACxC,IAAI,KACDD,GAAA,CAAA,MAAA,EAAA,EAAM,SAAS,EAAE,mBAAmB,CAAC,IAAI,CAAC,CAAC,IAAI,EAAA,QAAA,EAC3CA,GAAA,CAAC,gBAAgB,EAAA,EAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE,IAAI,EAAA,CAAI,GACzC,CACV,EACDA,GAAA,CAAA,KAAA,EAAA,EAAK,SAAS,EAAC,oBAAoB,EAAA,QAAA,EAAE,QAAQ,EAAA,CAAO,CAAA,EAAA,CAClD,EAAA,CACJ;AAEd;;;;"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
|
package/package.json
CHANGED
package/tailwindcss/pass.css
CHANGED
|
@@ -8,6 +8,7 @@
|
|
|
8
8
|
"Courier New", monospace;
|
|
9
9
|
--text-xl: 20px;
|
|
10
10
|
--text-xl--line-height: var(--line-height-10);
|
|
11
|
+
--font-weight-bold: 700;
|
|
11
12
|
--default-font-family: var(--font-family-body);
|
|
12
13
|
--default-mono-font-family: var(--font-mono);
|
|
13
14
|
--color-white: #FFFFFF;
|
|
@@ -152,6 +153,10 @@
|
|
|
152
153
|
--color-text-secondary: var(--color-indigo-400);
|
|
153
154
|
--color-fg-accent-primary: var(--color-indigo-600);
|
|
154
155
|
--color-fg-accent-secondary: var(--color-indigo-500);
|
|
156
|
+
--color-fg-error-secondary: var(--color-red-500);
|
|
157
|
+
--color-fg-warning-secondary: var(--color-yellow-500);
|
|
158
|
+
--color-fg-success-secondary: var(--color-green-500);
|
|
159
|
+
--color-fg-info-secondary: var(--color-blue-500);
|
|
155
160
|
--color-bg-primary: var(--color-white);
|
|
156
161
|
--color-bg-secondary: var(--color-gray-50);
|
|
157
162
|
--color-bg-tertiary: var(--color-gray-100);
|
|
@@ -334,6 +339,9 @@
|
|
|
334
339
|
.contents {
|
|
335
340
|
display: contents;
|
|
336
341
|
}
|
|
342
|
+
.flex {
|
|
343
|
+
display: flex;
|
|
344
|
+
}
|
|
337
345
|
.grid {
|
|
338
346
|
display: grid;
|
|
339
347
|
}
|
|
@@ -343,9 +351,63 @@
|
|
|
343
351
|
.inline {
|
|
344
352
|
display: inline;
|
|
345
353
|
}
|
|
354
|
+
.grow {
|
|
355
|
+
flex-grow: 1;
|
|
356
|
+
}
|
|
346
357
|
.transform {
|
|
347
358
|
transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
|
|
348
359
|
}
|
|
360
|
+
.flex-col {
|
|
361
|
+
flex-direction: column;
|
|
362
|
+
}
|
|
363
|
+
.items-start {
|
|
364
|
+
align-items: flex-start;
|
|
365
|
+
}
|
|
366
|
+
.gap-5 {
|
|
367
|
+
gap: var(--spacing-5);
|
|
368
|
+
}
|
|
369
|
+
.border {
|
|
370
|
+
border-style: var(--tw-border-style);
|
|
371
|
+
border-width: 1px;
|
|
372
|
+
}
|
|
373
|
+
.border-l-10 {
|
|
374
|
+
border-left-style: var(--tw-border-style);
|
|
375
|
+
border-left-width: 10px;
|
|
376
|
+
}
|
|
377
|
+
.border-fg-error-secondary {
|
|
378
|
+
border-color: var(--color-fg-error-secondary);
|
|
379
|
+
}
|
|
380
|
+
.border-fg-info-secondary {
|
|
381
|
+
border-color: var(--color-fg-info-secondary);
|
|
382
|
+
}
|
|
383
|
+
.border-fg-success-secondary {
|
|
384
|
+
border-color: var(--color-fg-success-secondary);
|
|
385
|
+
}
|
|
386
|
+
.border-fg-warning-secondary {
|
|
387
|
+
border-color: var(--color-fg-warning-secondary);
|
|
388
|
+
}
|
|
389
|
+
.bg-bg-secondary {
|
|
390
|
+
background-color: var(--color-bg-secondary);
|
|
391
|
+
}
|
|
392
|
+
.p-5 {
|
|
393
|
+
padding: var(--spacing-5);
|
|
394
|
+
}
|
|
395
|
+
.font-bold {
|
|
396
|
+
--tw-font-weight: var(--font-weight-bold);
|
|
397
|
+
font-weight: var(--font-weight-bold);
|
|
398
|
+
}
|
|
399
|
+
.text-fg-error-secondary {
|
|
400
|
+
color: var(--color-fg-error-secondary);
|
|
401
|
+
}
|
|
402
|
+
.text-fg-info-secondary {
|
|
403
|
+
color: var(--color-fg-info-secondary);
|
|
404
|
+
}
|
|
405
|
+
.text-fg-success-secondary {
|
|
406
|
+
color: var(--color-fg-success-secondary);
|
|
407
|
+
}
|
|
408
|
+
.text-fg-warning-secondary {
|
|
409
|
+
color: var(--color-fg-warning-secondary);
|
|
410
|
+
}
|
|
349
411
|
.lowercase {
|
|
350
412
|
text-transform: lowercase;
|
|
351
413
|
}
|
|
@@ -472,6 +534,8 @@
|
|
|
472
534
|
--color-fg-warning-secondary: var(--color-yellow-400);
|
|
473
535
|
--color-fg-success-primary: var(--color-green-500);
|
|
474
536
|
--color-fg-success-secondary: var(--color-green-400);
|
|
537
|
+
--color-fg-info-primary: var(--color-blue-500);
|
|
538
|
+
--color-fg-info-secondary: var(--color-blue-400);
|
|
475
539
|
--color-bg-quaternary: var(--color-indigo-700);
|
|
476
540
|
--color-bg-quaternary-hover: var(--color-indigo-700);
|
|
477
541
|
--color-bg-overlay: var(--color-indigo-800);
|
|
@@ -553,6 +617,15 @@
|
|
|
553
617
|
syntax: "*";
|
|
554
618
|
inherits: false;
|
|
555
619
|
}
|
|
620
|
+
@property --tw-border-style {
|
|
621
|
+
syntax: "*";
|
|
622
|
+
inherits: false;
|
|
623
|
+
initial-value: solid;
|
|
624
|
+
}
|
|
625
|
+
@property --tw-font-weight {
|
|
626
|
+
syntax: "*";
|
|
627
|
+
inherits: false;
|
|
628
|
+
}
|
|
556
629
|
@layer properties {
|
|
557
630
|
@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
|
|
558
631
|
*, ::before, ::after, ::backdrop {
|
|
@@ -561,6 +634,8 @@
|
|
|
561
634
|
--tw-rotate-z: initial;
|
|
562
635
|
--tw-skew-x: initial;
|
|
563
636
|
--tw-skew-y: initial;
|
|
637
|
+
--tw-border-style: solid;
|
|
638
|
+
--tw-font-weight: initial;
|
|
564
639
|
}
|
|
565
640
|
}
|
|
566
641
|
}
|
package/tailwindcss/redgate.css
CHANGED
|
@@ -8,6 +8,7 @@
|
|
|
8
8
|
"Courier New", monospace;
|
|
9
9
|
--text-xl: 20px;
|
|
10
10
|
--text-xl--line-height: var(--line-height-10);
|
|
11
|
+
--font-weight-bold: 700;
|
|
11
12
|
--default-font-family: var(--font-family-body);
|
|
12
13
|
--default-mono-font-family: var(--font-mono);
|
|
13
14
|
--color-white: #FFFFFF;
|
|
@@ -152,6 +153,10 @@
|
|
|
152
153
|
--color-text-secondary: var(--color-gray-700);
|
|
153
154
|
--color-fg-accent-primary: var(--color-red-600);
|
|
154
155
|
--color-fg-accent-secondary: var(--color-red-500);
|
|
156
|
+
--color-fg-error-secondary: var(--color-red-500);
|
|
157
|
+
--color-fg-warning-secondary: var(--color-yellow-500);
|
|
158
|
+
--color-fg-success-secondary: var(--color-green-500);
|
|
159
|
+
--color-fg-info-secondary: var(--color-blue-500);
|
|
155
160
|
--color-bg-primary: var(--color-white);
|
|
156
161
|
--color-bg-secondary: var(--color-gray-50);
|
|
157
162
|
--color-bg-tertiary: var(--color-gray-100);
|
|
@@ -334,6 +339,9 @@
|
|
|
334
339
|
.contents {
|
|
335
340
|
display: contents;
|
|
336
341
|
}
|
|
342
|
+
.flex {
|
|
343
|
+
display: flex;
|
|
344
|
+
}
|
|
337
345
|
.grid {
|
|
338
346
|
display: grid;
|
|
339
347
|
}
|
|
@@ -343,9 +351,63 @@
|
|
|
343
351
|
.inline {
|
|
344
352
|
display: inline;
|
|
345
353
|
}
|
|
354
|
+
.grow {
|
|
355
|
+
flex-grow: 1;
|
|
356
|
+
}
|
|
346
357
|
.transform {
|
|
347
358
|
transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
|
|
348
359
|
}
|
|
360
|
+
.flex-col {
|
|
361
|
+
flex-direction: column;
|
|
362
|
+
}
|
|
363
|
+
.items-start {
|
|
364
|
+
align-items: flex-start;
|
|
365
|
+
}
|
|
366
|
+
.gap-5 {
|
|
367
|
+
gap: var(--spacing-5);
|
|
368
|
+
}
|
|
369
|
+
.border {
|
|
370
|
+
border-style: var(--tw-border-style);
|
|
371
|
+
border-width: 1px;
|
|
372
|
+
}
|
|
373
|
+
.border-l-10 {
|
|
374
|
+
border-left-style: var(--tw-border-style);
|
|
375
|
+
border-left-width: 10px;
|
|
376
|
+
}
|
|
377
|
+
.border-fg-error-secondary {
|
|
378
|
+
border-color: var(--color-fg-error-secondary);
|
|
379
|
+
}
|
|
380
|
+
.border-fg-info-secondary {
|
|
381
|
+
border-color: var(--color-fg-info-secondary);
|
|
382
|
+
}
|
|
383
|
+
.border-fg-success-secondary {
|
|
384
|
+
border-color: var(--color-fg-success-secondary);
|
|
385
|
+
}
|
|
386
|
+
.border-fg-warning-secondary {
|
|
387
|
+
border-color: var(--color-fg-warning-secondary);
|
|
388
|
+
}
|
|
389
|
+
.bg-bg-secondary {
|
|
390
|
+
background-color: var(--color-bg-secondary);
|
|
391
|
+
}
|
|
392
|
+
.p-5 {
|
|
393
|
+
padding: var(--spacing-5);
|
|
394
|
+
}
|
|
395
|
+
.font-bold {
|
|
396
|
+
--tw-font-weight: var(--font-weight-bold);
|
|
397
|
+
font-weight: var(--font-weight-bold);
|
|
398
|
+
}
|
|
399
|
+
.text-fg-error-secondary {
|
|
400
|
+
color: var(--color-fg-error-secondary);
|
|
401
|
+
}
|
|
402
|
+
.text-fg-info-secondary {
|
|
403
|
+
color: var(--color-fg-info-secondary);
|
|
404
|
+
}
|
|
405
|
+
.text-fg-success-secondary {
|
|
406
|
+
color: var(--color-fg-success-secondary);
|
|
407
|
+
}
|
|
408
|
+
.text-fg-warning-secondary {
|
|
409
|
+
color: var(--color-fg-warning-secondary);
|
|
410
|
+
}
|
|
349
411
|
.lowercase {
|
|
350
412
|
text-transform: lowercase;
|
|
351
413
|
}
|
|
@@ -475,6 +537,8 @@
|
|
|
475
537
|
--color-fg-warning-secondary: var(--color-yellow-400);
|
|
476
538
|
--color-fg-success-primary: var(--color-green-500);
|
|
477
539
|
--color-fg-success-secondary: var(--color-green-400);
|
|
540
|
+
--color-fg-info-primary: var(--color-blue-500);
|
|
541
|
+
--color-fg-info-secondary: var(--color-blue-400);
|
|
478
542
|
--color-bg-quaternary: var(--color-gray-700);
|
|
479
543
|
--color-bg-quaternary-hover: var(--color-gray-700);
|
|
480
544
|
--color-bg-overlay: var(--color-gray-800);
|
|
@@ -556,6 +620,15 @@
|
|
|
556
620
|
syntax: "*";
|
|
557
621
|
inherits: false;
|
|
558
622
|
}
|
|
623
|
+
@property --tw-border-style {
|
|
624
|
+
syntax: "*";
|
|
625
|
+
inherits: false;
|
|
626
|
+
initial-value: solid;
|
|
627
|
+
}
|
|
628
|
+
@property --tw-font-weight {
|
|
629
|
+
syntax: "*";
|
|
630
|
+
inherits: false;
|
|
631
|
+
}
|
|
559
632
|
@layer properties {
|
|
560
633
|
@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
|
|
561
634
|
*, ::before, ::after, ::backdrop {
|
|
@@ -564,6 +637,8 @@
|
|
|
564
637
|
--tw-rotate-z: initial;
|
|
565
638
|
--tw-skew-x: initial;
|
|
566
639
|
--tw-skew-y: initial;
|
|
640
|
+
--tw-border-style: solid;
|
|
641
|
+
--tw-font-weight: initial;
|
|
567
642
|
}
|
|
568
643
|
}
|
|
569
644
|
}
|
|
@@ -8,6 +8,7 @@
|
|
|
8
8
|
"Courier New", monospace;
|
|
9
9
|
--text-xl: 20px;
|
|
10
10
|
--text-xl--line-height: var(--line-height-10);
|
|
11
|
+
--font-weight-bold: 700;
|
|
11
12
|
--default-font-family: var(--font-family-body);
|
|
12
13
|
--default-mono-font-family: var(--font-mono);
|
|
13
14
|
--color-white: #FFFFFF;
|
|
@@ -152,6 +153,10 @@
|
|
|
152
153
|
--color-text-secondary: var(--color-gray-700);
|
|
153
154
|
--color-fg-accent-primary: var(--color-blue-600);
|
|
154
155
|
--color-fg-accent-secondary: var(--color-blue-500);
|
|
156
|
+
--color-fg-error-secondary: var(--color-red-500);
|
|
157
|
+
--color-fg-warning-secondary: var(--color-yellow-500);
|
|
158
|
+
--color-fg-success-secondary: var(--color-green-500);
|
|
159
|
+
--color-fg-info-secondary: var(--color-blue-500);
|
|
155
160
|
--color-bg-primary: var(--color-white);
|
|
156
161
|
--color-bg-secondary: var(--color-gray-50);
|
|
157
162
|
--color-bg-tertiary: var(--color-gray-100);
|
|
@@ -334,6 +339,9 @@
|
|
|
334
339
|
.contents {
|
|
335
340
|
display: contents;
|
|
336
341
|
}
|
|
342
|
+
.flex {
|
|
343
|
+
display: flex;
|
|
344
|
+
}
|
|
337
345
|
.grid {
|
|
338
346
|
display: grid;
|
|
339
347
|
}
|
|
@@ -343,9 +351,63 @@
|
|
|
343
351
|
.inline {
|
|
344
352
|
display: inline;
|
|
345
353
|
}
|
|
354
|
+
.grow {
|
|
355
|
+
flex-grow: 1;
|
|
356
|
+
}
|
|
346
357
|
.transform {
|
|
347
358
|
transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
|
|
348
359
|
}
|
|
360
|
+
.flex-col {
|
|
361
|
+
flex-direction: column;
|
|
362
|
+
}
|
|
363
|
+
.items-start {
|
|
364
|
+
align-items: flex-start;
|
|
365
|
+
}
|
|
366
|
+
.gap-5 {
|
|
367
|
+
gap: var(--spacing-5);
|
|
368
|
+
}
|
|
369
|
+
.border {
|
|
370
|
+
border-style: var(--tw-border-style);
|
|
371
|
+
border-width: 1px;
|
|
372
|
+
}
|
|
373
|
+
.border-l-10 {
|
|
374
|
+
border-left-style: var(--tw-border-style);
|
|
375
|
+
border-left-width: 10px;
|
|
376
|
+
}
|
|
377
|
+
.border-fg-error-secondary {
|
|
378
|
+
border-color: var(--color-fg-error-secondary);
|
|
379
|
+
}
|
|
380
|
+
.border-fg-info-secondary {
|
|
381
|
+
border-color: var(--color-fg-info-secondary);
|
|
382
|
+
}
|
|
383
|
+
.border-fg-success-secondary {
|
|
384
|
+
border-color: var(--color-fg-success-secondary);
|
|
385
|
+
}
|
|
386
|
+
.border-fg-warning-secondary {
|
|
387
|
+
border-color: var(--color-fg-warning-secondary);
|
|
388
|
+
}
|
|
389
|
+
.bg-bg-secondary {
|
|
390
|
+
background-color: var(--color-bg-secondary);
|
|
391
|
+
}
|
|
392
|
+
.p-5 {
|
|
393
|
+
padding: var(--spacing-5);
|
|
394
|
+
}
|
|
395
|
+
.font-bold {
|
|
396
|
+
--tw-font-weight: var(--font-weight-bold);
|
|
397
|
+
font-weight: var(--font-weight-bold);
|
|
398
|
+
}
|
|
399
|
+
.text-fg-error-secondary {
|
|
400
|
+
color: var(--color-fg-error-secondary);
|
|
401
|
+
}
|
|
402
|
+
.text-fg-info-secondary {
|
|
403
|
+
color: var(--color-fg-info-secondary);
|
|
404
|
+
}
|
|
405
|
+
.text-fg-success-secondary {
|
|
406
|
+
color: var(--color-fg-success-secondary);
|
|
407
|
+
}
|
|
408
|
+
.text-fg-warning-secondary {
|
|
409
|
+
color: var(--color-fg-warning-secondary);
|
|
410
|
+
}
|
|
349
411
|
.lowercase {
|
|
350
412
|
text-transform: lowercase;
|
|
351
413
|
}
|
|
@@ -470,6 +532,8 @@
|
|
|
470
532
|
--color-fg-warning-secondary: var(--color-yellow-400);
|
|
471
533
|
--color-fg-success-primary: var(--color-green-500);
|
|
472
534
|
--color-fg-success-secondary: var(--color-green-400);
|
|
535
|
+
--color-fg-info-primary: var(--color-blue-500);
|
|
536
|
+
--color-fg-info-secondary: var(--color-blue-400);
|
|
473
537
|
--color-bg-quaternary: var(--color-gray-700);
|
|
474
538
|
--color-bg-quaternary-hover: var(--color-gray-700);
|
|
475
539
|
--color-bg-overlay: var(--color-gray-800);
|
|
@@ -551,6 +615,15 @@
|
|
|
551
615
|
syntax: "*";
|
|
552
616
|
inherits: false;
|
|
553
617
|
}
|
|
618
|
+
@property --tw-border-style {
|
|
619
|
+
syntax: "*";
|
|
620
|
+
inherits: false;
|
|
621
|
+
initial-value: solid;
|
|
622
|
+
}
|
|
623
|
+
@property --tw-font-weight {
|
|
624
|
+
syntax: "*";
|
|
625
|
+
inherits: false;
|
|
626
|
+
}
|
|
554
627
|
@layer properties {
|
|
555
628
|
@supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {
|
|
556
629
|
*, ::before, ::after, ::backdrop {
|
|
@@ -559,6 +632,8 @@
|
|
|
559
632
|
--tw-rotate-z: initial;
|
|
560
633
|
--tw-skew-x: initial;
|
|
561
634
|
--tw-skew-y: initial;
|
|
635
|
+
--tw-border-style: solid;
|
|
636
|
+
--tw-font-weight: initial;
|
|
562
637
|
}
|
|
563
638
|
}
|
|
564
639
|
}
|
|
@@ -110,6 +110,8 @@
|
|
|
110
110
|
--color-fg-warning-secondary: var(--color-yellow-500);
|
|
111
111
|
--color-fg-success-primary: var(--color-green-600);
|
|
112
112
|
--color-fg-success-secondary: var(--color-green-500);
|
|
113
|
+
--color-fg-info-primary: var(--color-blue-600);
|
|
114
|
+
--color-fg-info-secondary: var(--color-blue-500);
|
|
113
115
|
|
|
114
116
|
--color-bg-quaternary: var(--color-gray-200);
|
|
115
117
|
--color-bg-quaternary-hover: var(--color-gray-200);
|
|
@@ -308,6 +310,8 @@
|
|
|
308
310
|
--color-fg-warning-secondary: var(--color-yellow-400);
|
|
309
311
|
--color-fg-success-primary: var(--color-green-500);
|
|
310
312
|
--color-fg-success-secondary: var(--color-green-400);
|
|
313
|
+
--color-fg-info-primary: var(--color-blue-500);
|
|
314
|
+
--color-fg-info-secondary: var(--color-blue-400);
|
|
311
315
|
|
|
312
316
|
--color-bg-quaternary: var(--color-indigo-700);
|
|
313
317
|
--color-bg-quaternary-hover: var(--color-indigo-700);
|
|
@@ -103,6 +103,8 @@
|
|
|
103
103
|
--color-fg-warning-secondary: var(--color-yellow-500);
|
|
104
104
|
--color-fg-success-primary: var(--color-green-600);
|
|
105
105
|
--color-fg-success-secondary: var(--color-green-500);
|
|
106
|
+
--color-fg-info-primary: var(--color-blue-600);
|
|
107
|
+
--color-fg-info-secondary: var(--color-blue-500);
|
|
106
108
|
--color-bg-quaternary: var(--color-gray-200);
|
|
107
109
|
--color-bg-quaternary-hover: var(--color-gray-200);
|
|
108
110
|
--color-bg-overlay: var(--color-gray-950);
|
|
@@ -267,6 +269,8 @@
|
|
|
267
269
|
--color-fg-warning-secondary: var(--color-yellow-400);
|
|
268
270
|
--color-fg-success-primary: var(--color-green-500);
|
|
269
271
|
--color-fg-success-secondary: var(--color-green-400);
|
|
272
|
+
--color-fg-info-primary: var(--color-blue-500);
|
|
273
|
+
--color-fg-info-secondary: var(--color-blue-400);
|
|
270
274
|
--color-bg-quaternary: var(--color-gray-700);
|
|
271
275
|
--color-bg-quaternary-hover: var(--color-gray-700);
|
|
272
276
|
--color-bg-overlay: var(--color-gray-800);
|
|
@@ -106,6 +106,8 @@
|
|
|
106
106
|
--color-fg-warning-secondary: var(--color-yellow-500);
|
|
107
107
|
--color-fg-success-primary: var(--color-green-600);
|
|
108
108
|
--color-fg-success-secondary: var(--color-green-500);
|
|
109
|
+
--color-fg-info-primary: var(--color-blue-600);
|
|
110
|
+
--color-fg-info-secondary: var(--color-blue-500);
|
|
109
111
|
|
|
110
112
|
--color-bg-quaternary: var(--color-gray-200);
|
|
111
113
|
--color-bg-quaternary-hover: var(--color-gray-200);
|
|
@@ -285,6 +287,8 @@
|
|
|
285
287
|
--color-fg-warning-secondary: var(--color-yellow-400);
|
|
286
288
|
--color-fg-success-primary: var(--color-green-500);
|
|
287
289
|
--color-fg-success-secondary: var(--color-green-400);
|
|
290
|
+
--color-fg-info-primary: var(--color-blue-500);
|
|
291
|
+
--color-fg-info-secondary: var(--color-blue-400);
|
|
288
292
|
--color-bg-quaternary: var(--color-gray-700);
|
|
289
293
|
--color-bg-quaternary-hover: var(--color-gray-700);
|
|
290
294
|
--color-bg-overlay: var(--color-gray-800);
|