@redgate/brand-web-toolkit 0.0.3 → 0.0.5
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/testing/Test.d.ts +1 -0
- package/package.json +1 -1
- package/tailwindcss/pass.css +562 -0
- package/tailwindcss/{output.css → redgate.css} +137 -46
- package/tailwindcss/sql-server-central.css +562 -0
- package/tailwindcss/src/global/base.css +41 -0
- package/tailwindcss/src/global/colours.css +112 -0
- package/tailwindcss/src/global/containers.css +6 -0
- package/tailwindcss/src/global/radius.css +15 -0
- package/tailwindcss/src/global/spacing.css +54 -0
- package/tailwindcss/src/global/theme.css +1 -0
- package/tailwindcss/src/global/typography.css +146 -0
- package/tailwindcss/src/global/widths.css +15 -0
- package/tailwindcss/src/pass/input.css +381 -0
- package/tailwindcss/{input.css → src/redgate/input.css} +11 -226
- package/tailwindcss/src/sql-server-central/input.css +347 -0
|
@@ -6,9 +6,8 @@
|
|
|
6
6
|
:root, :host {
|
|
7
7
|
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
|
|
8
8
|
"Courier New", monospace;
|
|
9
|
-
--spacing: 4px;
|
|
10
9
|
--text-xl: 20px;
|
|
11
|
-
--text-xl--line-height:
|
|
10
|
+
--text-xl--line-height: var(--line-height-10);
|
|
12
11
|
--default-font-family: var(--font-family-body);
|
|
13
12
|
--default-mono-font-family: var(--font-mono);
|
|
14
13
|
--color-white: #FFFFFF;
|
|
@@ -38,10 +37,33 @@
|
|
|
38
37
|
--color-red-800: #7A0000;
|
|
39
38
|
--color-red-900: #4F0101;
|
|
40
39
|
--color-red-950: #2C0101;
|
|
40
|
+
--color-blue-25: #EBF3FC;
|
|
41
|
+
--color-blue-50: #D8E7F9;
|
|
42
|
+
--color-blue-100: #ADC5E7;
|
|
43
|
+
--color-blue-200: #85A7DA;
|
|
41
44
|
--color-blue-400: #3C85DF;
|
|
45
|
+
--color-blue-500: #336DC2;
|
|
42
46
|
--color-blue-600: #29579B;
|
|
47
|
+
--color-blue-700: #1F4174;
|
|
48
|
+
--color-blue-800: #183559;
|
|
49
|
+
--color-blue-900: #0A1627;
|
|
50
|
+
--color-blue-950: #050B13;
|
|
51
|
+
--color-indigo-25: #F3F2F6;
|
|
52
|
+
--color-indigo-50: #E7E6ED;
|
|
53
|
+
--color-indigo-100: #D0CDDB;
|
|
54
|
+
--color-indigo-200: #A09BB7;
|
|
55
|
+
--color-indigo-300: #716892;
|
|
56
|
+
--color-indigo-400: #41366E;
|
|
57
|
+
--color-indigo-500: #12044A;
|
|
58
|
+
--color-indigo-600: #100443;
|
|
59
|
+
--color-indigo-700: #0E033B;
|
|
60
|
+
--color-indigo-800: #0B022C;
|
|
61
|
+
--color-indigo-900: #07021E;
|
|
62
|
+
--color-indigo-950: #04010F;
|
|
43
63
|
--color-yellow-50: #FFF9D7;
|
|
44
64
|
--color-yellow-100: #FFF4AE;
|
|
65
|
+
--color-yellow-200: #FFEE86;
|
|
66
|
+
--color-yellow-300: #FFE95D;
|
|
45
67
|
--color-yellow-400: #FFE335;
|
|
46
68
|
--color-yellow-500: #CCB62A;
|
|
47
69
|
--color-yellow-600: #998820;
|
|
@@ -52,23 +74,91 @@
|
|
|
52
74
|
--color-green-500: #158A18;
|
|
53
75
|
--color-green-600: #106712;
|
|
54
76
|
--color-green-950: #031103;
|
|
55
|
-
--color-
|
|
56
|
-
--color-
|
|
57
|
-
--color-
|
|
58
|
-
--
|
|
59
|
-
--
|
|
77
|
+
--color-pass-pink: #9933FF;
|
|
78
|
+
--color-pass-yellow: #FFFF00;
|
|
79
|
+
--color-pass-green: #33FF99;
|
|
80
|
+
--spacing-0: 0px;
|
|
81
|
+
--spacing-0-5: 2px;
|
|
82
|
+
--spacing-1: 4px;
|
|
83
|
+
--spacing-1-5: 6px;
|
|
84
|
+
--spacing-2: 8px;
|
|
85
|
+
--spacing-3: 12px;
|
|
86
|
+
--spacing-4: 16px;
|
|
87
|
+
--spacing-5: 20px;
|
|
88
|
+
--spacing-6: 24px;
|
|
89
|
+
--spacing-8: 32px;
|
|
90
|
+
--spacing-10: 40px;
|
|
91
|
+
--spacing-12: 48px;
|
|
92
|
+
--spacing-16: 64px;
|
|
93
|
+
--spacing-20: 80px;
|
|
94
|
+
--spacing-24: 96px;
|
|
95
|
+
--spacing-32: 128px;
|
|
96
|
+
--spacing-40: 160px;
|
|
97
|
+
--spacing-80: 320px;
|
|
98
|
+
--spacing-96: 384px;
|
|
99
|
+
--spacing-120: 480px;
|
|
100
|
+
--spacing-140: 560px;
|
|
101
|
+
--spacing-160: 640px;
|
|
102
|
+
--spacing-180: 720px;
|
|
103
|
+
--spacing-192: 768px;
|
|
104
|
+
--spacing-256: 1024px;
|
|
105
|
+
--spacing-320: 1280px;
|
|
106
|
+
--spacing-360: 1440px;
|
|
107
|
+
--spacing-400: 1600px;
|
|
108
|
+
--spacing-480: 1920px;
|
|
109
|
+
--radius-xxs: 2px;
|
|
60
110
|
--radius-xs: 4px;
|
|
61
111
|
--radius-sm: 6px;
|
|
112
|
+
--radius-md: 8px;
|
|
62
113
|
--radius-lg: 10px;
|
|
63
114
|
--radius-2xl: 16px;
|
|
64
|
-
--
|
|
65
|
-
--
|
|
115
|
+
--radius-3xl: 20px;
|
|
116
|
+
--radius-4xl: 24px;
|
|
117
|
+
--radius-full: 9999px;
|
|
66
118
|
--text-md: 16px;
|
|
67
119
|
--text-display-xs: 24px;
|
|
68
120
|
--text-display-md: 36px;
|
|
69
|
-
--
|
|
70
|
-
--
|
|
71
|
-
--
|
|
121
|
+
--line-height-5: 18px;
|
|
122
|
+
--line-height-6: 20px;
|
|
123
|
+
--line-height-8: 24px;
|
|
124
|
+
--line-height-9: 28px;
|
|
125
|
+
--line-height-10: 30px;
|
|
126
|
+
--line-height-11: 32px;
|
|
127
|
+
--line-height-12: 38px;
|
|
128
|
+
--line-height-13: 44px;
|
|
129
|
+
--line-height-14: 48px;
|
|
130
|
+
--line-height-15: 60px;
|
|
131
|
+
--line-height-16: 72px;
|
|
132
|
+
--line-height-18: 90px;
|
|
133
|
+
--text-md--line-height: var(--line-height-8);
|
|
134
|
+
--text-display-xs--line-height: var(--line-height-11);
|
|
135
|
+
--text-display-md--line-height: var(--line-height-13);
|
|
136
|
+
--fluid-text-viewport-min: 640;
|
|
137
|
+
--fluid-text-viewport-max: 1536;
|
|
138
|
+
--fluid-line-height-min-10: 28;
|
|
139
|
+
--fluid-line-height-max-10: 30;
|
|
140
|
+
--fluid-line-height-min-11: 30;
|
|
141
|
+
--fluid-line-height-max-11: 32;
|
|
142
|
+
--fluid-line-height-min-12: 32;
|
|
143
|
+
--fluid-line-height-max-12: 38;
|
|
144
|
+
--fluid-line-height-min-13: 38;
|
|
145
|
+
--fluid-line-height-max-13: 44;
|
|
146
|
+
--fluid-line-height-min-15: 38;
|
|
147
|
+
--fluid-line-height-max-15: 60;
|
|
148
|
+
--fluid-line-height-min-16: 44;
|
|
149
|
+
--fluid-line-height-max-16: 72;
|
|
150
|
+
--fluid-line-height-min-17: 48;
|
|
151
|
+
--fluid-line-height-max-17: 80;
|
|
152
|
+
--color-text-secondary: var(--color-gray-700);
|
|
153
|
+
--color-fg-accent-primary: var(--color-red-600);
|
|
154
|
+
--color-fg-accent-secondary: var(--color-red-500);
|
|
155
|
+
--color-bg-primary: var(--color-white);
|
|
156
|
+
--color-bg-secondary: var(--color-gray-50);
|
|
157
|
+
--color-bg-tertiary: var(--color-gray-100);
|
|
158
|
+
--default-font-color: var(--color-text-secondary);
|
|
159
|
+
--default-background-color: var(--color-bg-primary);
|
|
160
|
+
--font-family-display: "Gatebase", sans-serif;
|
|
161
|
+
--font-family-body: "Roboto", sans-serif;
|
|
72
162
|
}
|
|
73
163
|
}
|
|
74
164
|
@layer base {
|
|
@@ -253,9 +343,6 @@
|
|
|
253
343
|
.inline {
|
|
254
344
|
display: inline;
|
|
255
345
|
}
|
|
256
|
-
.table {
|
|
257
|
-
display: table;
|
|
258
|
-
}
|
|
259
346
|
.transform {
|
|
260
347
|
transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);
|
|
261
348
|
}
|
|
@@ -270,8 +357,42 @@
|
|
|
270
357
|
font-display: swap;
|
|
271
358
|
src: url('https://cdn.red-gate.com/assets/fonts/redgate-type/redgate-type-medium.woff') format('woff');
|
|
272
359
|
}
|
|
360
|
+
@layer base {
|
|
361
|
+
html, :host {
|
|
362
|
+
font-size: var(--text-md);
|
|
363
|
+
line-height: var(--text-md--line-height);
|
|
364
|
+
color: var(--default-font-color);
|
|
365
|
+
background-color: var(--default-background-color);
|
|
366
|
+
-webkit-font-smoothing: antialiased;
|
|
367
|
+
scroll-behavior: smooth;
|
|
368
|
+
}
|
|
369
|
+
h1, h2, h3, h4 {
|
|
370
|
+
font-family: var(--font-family-display);
|
|
371
|
+
}
|
|
372
|
+
h1 {
|
|
373
|
+
font-size: var(--text-display-md);
|
|
374
|
+
line-height: var(--text-display-md--line-height);
|
|
375
|
+
}
|
|
376
|
+
h2 {
|
|
377
|
+
font-size: var(--text-display-xs);
|
|
378
|
+
line-height: var(--text-display-xs--line-height);
|
|
379
|
+
}
|
|
380
|
+
h3 {
|
|
381
|
+
font-size: var(--text-xl);
|
|
382
|
+
line-height: var(--text-xl--line-height);
|
|
383
|
+
}
|
|
384
|
+
ul, ol {
|
|
385
|
+
list-style-position: inside;
|
|
386
|
+
}
|
|
387
|
+
ul {
|
|
388
|
+
list-style-type: disc;
|
|
389
|
+
}
|
|
390
|
+
ol {
|
|
391
|
+
list-style-type: decimal;
|
|
392
|
+
}
|
|
393
|
+
}
|
|
273
394
|
:root {
|
|
274
|
-
|
|
395
|
+
&:where([data-theme=dark], [data-theme=dark] *) {
|
|
275
396
|
--color-text-primary: var(--color-gray-25);
|
|
276
397
|
--color-text-primary_hover: var(--color-gray-50);
|
|
277
398
|
--color-text-primary_on-accent-subtle: var(--color-red-25);
|
|
@@ -415,36 +536,6 @@
|
|
|
415
536
|
--color-shadow-skeumorphic-inner-border: rgba(0, 0, 0, 0.18);
|
|
416
537
|
}
|
|
417
538
|
}
|
|
418
|
-
@layer base {
|
|
419
|
-
html, :host {
|
|
420
|
-
font-size: var(--text-md);
|
|
421
|
-
line-height: var(--text-md--line-height);
|
|
422
|
-
}
|
|
423
|
-
h1, h2, h3, h4 {
|
|
424
|
-
font-family: var(--font-family-display);
|
|
425
|
-
}
|
|
426
|
-
h1 {
|
|
427
|
-
font-size: var(--text-display-md);
|
|
428
|
-
line-height: var(--text-display-md--line-height);
|
|
429
|
-
}
|
|
430
|
-
h2 {
|
|
431
|
-
font-size: var(--text-display-xs);
|
|
432
|
-
line-height: var(--text-display-xs--line-height);
|
|
433
|
-
}
|
|
434
|
-
h3 {
|
|
435
|
-
font-size: var(--text-xl);
|
|
436
|
-
line-height: var(--text-xl--line-height);
|
|
437
|
-
}
|
|
438
|
-
ul, ol {
|
|
439
|
-
list-style-position: inside;
|
|
440
|
-
}
|
|
441
|
-
ul {
|
|
442
|
-
list-style-type: disc;
|
|
443
|
-
}
|
|
444
|
-
ol {
|
|
445
|
-
list-style-type: decimal;
|
|
446
|
-
}
|
|
447
|
-
}
|
|
448
539
|
@property --tw-rotate-x {
|
|
449
540
|
syntax: "*";
|
|
450
541
|
inherits: false;
|