@bcc-code/component-library-vue 0.0.0-dev.f3b912b → 0.0.0-dev.f3ffbc4
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/dist/component-library.js +4138 -4109
- package/dist/component-library.umd.cjs +172 -172
- package/dist/index.css +1 -1
- package/dist/theme.css +587 -302
- package/dist-types/components/custom/BccGraphic/BccGraphic.vue.d.ts +7 -4
- package/dist-types/components/custom/BccReact/BccReact.vue.d.ts +2 -1
- package/dist-types/components/custom/BccStepIndicator/BccStepIndicator.vue.d.ts +3 -3
- package/dist-types/components/custom/BccTag/BccTag.vue.d.ts +1 -0
- package/dist-types/components/custom/BccTopNavigation/BccTopNavigation.vue.d.ts +14 -4
- package/dist-types/components/wrapped/BccMenu/BccMenu.vue.d.ts +15 -1
- package/dist-types/components/wrapped/BccRadioButton.vue.d.ts +2 -0
- package/dist-types/components/wrapped/BccSelectButton.vue.d.ts +5 -2
- package/package.json +105 -103
package/dist/theme.css
CHANGED
|
@@ -4,96 +4,222 @@
|
|
|
4
4
|
|
|
5
5
|
@import 'tailwindcss';
|
|
6
6
|
@import '@bcc-code/design-tokens/tailwind';
|
|
7
|
-
@import '@bcc-code/design-tokens/primevue/overrides';
|
|
8
7
|
|
|
9
8
|
|
|
10
9
|
/* === ./styles/theme.css === */
|
|
11
10
|
@theme {
|
|
11
|
+
/* spacing variables */
|
|
12
|
+
--spacing-inset-top: env(safe-area-inset-top, var(--safe-area-inset-top, 0px));
|
|
13
|
+
--spacing-inset-top-1: max(0.25rem, env(safe-area-inset-top, var(--safe-area-inset-top, 0px)));
|
|
14
|
+
--spacing-inset-top-2: max(0.5rem, env(safe-area-inset-top, var(--safe-area-inset-top, 0px)));
|
|
15
|
+
--spacing-inset-top-4: max(1rem, env(safe-area-inset-top, var(--safe-area-inset-top, 0px)));
|
|
16
|
+
--spacing-inset-bottom: env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px));
|
|
17
|
+
--spacing-inset-bottom-1: max(0.25rem, env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px)));
|
|
18
|
+
--spacing-inset-bottom-2: max(0.5rem, env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px)));
|
|
19
|
+
--spacing-inset-bottom-4: max(1rem, env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px)));
|
|
20
|
+
--spacing-inset-left: env(safe-area-inset-left, var(--safe-area-inset-left, 0px));
|
|
21
|
+
--spacing-inset-right: env(safe-area-inset-right, var(--safe-area-inset-right, 0px));
|
|
22
|
+
|
|
23
|
+
--spacing-18: 4.5rem;
|
|
24
|
+
}
|
|
25
|
+
|
|
26
|
+
.ctx-default {
|
|
27
|
+
@apply ctx-default;
|
|
28
|
+
}
|
|
29
|
+
.ctx-success {
|
|
30
|
+
@apply ctx-success-subtlest;
|
|
31
|
+
}
|
|
32
|
+
.ctx-danger {
|
|
33
|
+
@apply ctx-danger-subtlest;
|
|
34
|
+
}
|
|
35
|
+
.ctx-warning {
|
|
36
|
+
@apply ctx-warning-subtlest;
|
|
37
|
+
}
|
|
38
|
+
.ctx-info {
|
|
39
|
+
@apply ctx-info-subtlest;
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
.ctx-blue-bolder {
|
|
43
|
+
@apply ctx-blue-bolder;
|
|
44
|
+
}
|
|
45
|
+
.ctx-blue-subtle {
|
|
46
|
+
@apply ctx-blue-subtle;
|
|
47
|
+
}
|
|
48
|
+
.ctx-blue-subtler {
|
|
49
|
+
@apply ctx-blue-subtler;
|
|
50
|
+
}
|
|
51
|
+
.ctx-blue-subtlest {
|
|
52
|
+
@apply ctx-blue-subtlest;
|
|
53
|
+
}
|
|
54
|
+
.ctx-brand-boldest {
|
|
55
|
+
@apply ctx-brand-boldest;
|
|
56
|
+
}
|
|
57
|
+
.ctx-brand-bolder {
|
|
58
|
+
@apply ctx-brand-bolder;
|
|
59
|
+
}
|
|
60
|
+
.ctx-brand-bold {
|
|
61
|
+
@apply ctx-brand-bold;
|
|
62
|
+
}
|
|
63
|
+
.ctx-brand-subtle {
|
|
64
|
+
@apply ctx-brand-subtle;
|
|
65
|
+
}
|
|
66
|
+
.ctx-brand-subtler {
|
|
67
|
+
@apply ctx-brand-subtler;
|
|
68
|
+
}
|
|
69
|
+
.ctx-brand-subtlest {
|
|
70
|
+
@apply ctx-brand-subtlest;
|
|
71
|
+
}
|
|
72
|
+
.ctx-brown-bolder {
|
|
73
|
+
@apply ctx-brown-bolder;
|
|
74
|
+
}
|
|
75
|
+
.ctx-brown-subtle {
|
|
76
|
+
@apply ctx-brown-subtle;
|
|
77
|
+
}
|
|
78
|
+
.ctx-brown-subtler {
|
|
79
|
+
@apply ctx-brown-subtler;
|
|
80
|
+
}
|
|
81
|
+
.ctx-brown-subtlest {
|
|
82
|
+
@apply ctx-brown-subtlest;
|
|
83
|
+
}
|
|
84
|
+
.ctx-danger-subtlest {
|
|
85
|
+
@apply ctx-danger;
|
|
86
|
+
}
|
|
87
|
+
.ctx-danger-bolder {
|
|
88
|
+
@apply ctx-danger-bolder;
|
|
89
|
+
}
|
|
90
|
+
.ctx-gray-bolder {
|
|
91
|
+
@apply ctx-gray-bolder;
|
|
92
|
+
}
|
|
93
|
+
.ctx-gray-subtle {
|
|
94
|
+
@apply ctx-gray-subtle;
|
|
95
|
+
}
|
|
96
|
+
.ctx-gray-subtler {
|
|
97
|
+
@apply ctx-gray-subtler;
|
|
98
|
+
}
|
|
99
|
+
.ctx-gray-subtlest {
|
|
100
|
+
@apply ctx-gray-subtlest;
|
|
101
|
+
}
|
|
102
|
+
.ctx-green-bolder {
|
|
103
|
+
@apply ctx-green-bolder;
|
|
104
|
+
}
|
|
105
|
+
.ctx-green-subtle {
|
|
106
|
+
@apply ctx-green-subtle;
|
|
107
|
+
}
|
|
108
|
+
.ctx-green-subtler {
|
|
109
|
+
@apply ctx-green-subtler;
|
|
110
|
+
}
|
|
111
|
+
.ctx-green-subtlest {
|
|
112
|
+
@apply ctx-green-subtlest;
|
|
113
|
+
}
|
|
114
|
+
.ctx-info-subtlest {
|
|
115
|
+
@apply ctx-info;
|
|
116
|
+
}
|
|
117
|
+
.ctx-info-bolder {
|
|
118
|
+
@apply ctx-info-bolder;
|
|
119
|
+
}
|
|
120
|
+
.ctx-magenta-bolder {
|
|
121
|
+
@apply ctx-magenta-bolder;
|
|
122
|
+
}
|
|
123
|
+
.ctx-magenta-subtle {
|
|
124
|
+
@apply ctx-magenta-subtle;
|
|
125
|
+
}
|
|
126
|
+
.ctx-magenta-subtler {
|
|
127
|
+
@apply ctx-magenta-subtler;
|
|
128
|
+
}
|
|
129
|
+
.ctx-magenta-subtlest {
|
|
130
|
+
@apply ctx-magenta-subtlest;
|
|
131
|
+
}
|
|
132
|
+
.ctx-neutral-boldest {
|
|
133
|
+
@apply ctx-neutral-boldest;
|
|
134
|
+
}
|
|
135
|
+
.ctx-neutral-bolder {
|
|
136
|
+
@apply ctx-neutral-bolder;
|
|
137
|
+
}
|
|
138
|
+
.ctx-neutral-bold {
|
|
139
|
+
@apply ctx-neutral-bold;
|
|
140
|
+
}
|
|
141
|
+
.ctx-neutral-subtle {
|
|
142
|
+
@apply ctx-neutral-subtle;
|
|
143
|
+
}
|
|
144
|
+
.ctx-neutral-subtler {
|
|
145
|
+
@apply ctx-neutral-subtler;
|
|
146
|
+
}
|
|
147
|
+
.ctx-neutral-subtlest {
|
|
148
|
+
@apply ctx-neutral-subtlest;
|
|
149
|
+
}
|
|
150
|
+
.ctx-orange-bolder {
|
|
151
|
+
@apply ctx-orange-bolder;
|
|
152
|
+
}
|
|
153
|
+
.ctx-orange-subtle {
|
|
154
|
+
@apply ctx-orange-subtle;
|
|
155
|
+
}
|
|
156
|
+
.ctx-orange-subtler {
|
|
157
|
+
@apply ctx-orange-subtler;
|
|
158
|
+
}
|
|
159
|
+
.ctx-orange-subtlest {
|
|
160
|
+
@apply ctx-orange-subtlest;
|
|
161
|
+
}
|
|
162
|
+
.ctx-purple-bolder {
|
|
163
|
+
@apply ctx-purple-bolder;
|
|
164
|
+
}
|
|
165
|
+
.ctx-purple-subtle {
|
|
166
|
+
@apply ctx-purple-subtle;
|
|
167
|
+
}
|
|
168
|
+
.ctx-purple-subtler {
|
|
169
|
+
@apply ctx-purple-subtler;
|
|
170
|
+
}
|
|
171
|
+
.ctx-purple-subtlest {
|
|
172
|
+
@apply ctx-purple-subtlest;
|
|
173
|
+
}
|
|
174
|
+
.ctx-red-bolder {
|
|
175
|
+
@apply ctx-red-bolder;
|
|
176
|
+
}
|
|
177
|
+
.ctx-red-subtle {
|
|
178
|
+
@apply ctx-red-subtle;
|
|
179
|
+
}
|
|
180
|
+
.ctx-red-subtler {
|
|
181
|
+
@apply ctx-red-subtler;
|
|
182
|
+
}
|
|
183
|
+
.ctx-red-subtlest {
|
|
184
|
+
@apply ctx-red-subtlest;
|
|
185
|
+
}
|
|
186
|
+
.ctx-success-subtlest {
|
|
187
|
+
@apply ctx-success;
|
|
188
|
+
}
|
|
189
|
+
.ctx-success-bolder {
|
|
190
|
+
@apply ctx-success-bolder;
|
|
191
|
+
}
|
|
192
|
+
.ctx-teal-bolder {
|
|
193
|
+
@apply ctx-teal-bolder;
|
|
194
|
+
}
|
|
195
|
+
.ctx-teal-subtle {
|
|
196
|
+
@apply ctx-teal-subtle;
|
|
197
|
+
}
|
|
198
|
+
.ctx-teal-subtler {
|
|
199
|
+
@apply ctx-teal-subtler;
|
|
200
|
+
}
|
|
201
|
+
.ctx-teal-subtlest {
|
|
202
|
+
@apply ctx-teal-subtlest;
|
|
203
|
+
}
|
|
204
|
+
.ctx-warning-subtlest {
|
|
205
|
+
@apply ctx-warning;
|
|
206
|
+
}
|
|
207
|
+
.ctx-warning-bolder {
|
|
208
|
+
@apply ctx-warning-bolder;
|
|
209
|
+
}
|
|
210
|
+
.ctx-yellow-bolder {
|
|
211
|
+
@apply ctx-yellow-bolder;
|
|
212
|
+
}
|
|
213
|
+
.ctx-yellow-subtle {
|
|
214
|
+
@apply ctx-yellow-subtle;
|
|
215
|
+
}
|
|
216
|
+
.ctx-yellow-subtler {
|
|
217
|
+
@apply ctx-yellow-subtler;
|
|
218
|
+
}
|
|
219
|
+
.ctx-yellow-subtlest {
|
|
220
|
+
@apply ctx-yellow-subtlest;
|
|
221
|
+
}
|
|
12
222
|
|
|
13
|
-
/* spacing variables */
|
|
14
|
-
--spacing-inset-top: env(safe-area-inset-top, var(--safe-area-inset-top, 0px));
|
|
15
|
-
--spacing-inset-top-1: max(0.25rem, env(safe-area-inset-top, var(--safe-area-inset-top, 0px)));
|
|
16
|
-
--spacing-inset-top-2: max(0.5rem, env(safe-area-inset-top, var(--safe-area-inset-top, 0px)));
|
|
17
|
-
--spacing-inset-top-4: max(1rem, env(safe-area-inset-top, var(--safe-area-inset-top, 0px)));
|
|
18
|
-
--spacing-inset-bottom: env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px));
|
|
19
|
-
--spacing-inset-bottom-1: max(0.25rem, env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px)));
|
|
20
|
-
--spacing-inset-bottom-2: max(0.5rem, env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px)));
|
|
21
|
-
--spacing-inset-bottom-4: max(1rem, env(safe-area-inset-bottom, var(--safe-area-inset-bottom, 0px)));
|
|
22
|
-
--spacing-inset-left: env(safe-area-inset-left, var(--safe-area-inset-left, 0px));
|
|
23
|
-
--spacing-inset-right: env(safe-area-inset-right, var(--safe-area-inset-right, 0px));
|
|
24
|
-
|
|
25
|
-
--spacing-18: 4.5rem;
|
|
26
|
-
|
|
27
|
-
/* color variables */
|
|
28
|
-
--color-overlay: rgba(17, 24, 39, 0.85);
|
|
29
|
-
}
|
|
30
|
-
|
|
31
|
-
.ctx-default { @apply ctx-default; }
|
|
32
|
-
.ctx-success { @apply ctx-success-subtlest; }
|
|
33
|
-
.ctx-danger { @apply ctx-danger-subtlest; }
|
|
34
|
-
.ctx-warning { @apply ctx-warning-subtlest; }
|
|
35
|
-
.ctx-info { @apply ctx-info-subtlest; }
|
|
36
|
-
|
|
37
|
-
.ctx-blue-bolder { @apply ctx-blue-bolder; }
|
|
38
|
-
.ctx-blue-subtle { @apply ctx-blue-subtle; }
|
|
39
|
-
.ctx-blue-subtler { @apply ctx-blue-subtler; }
|
|
40
|
-
.ctx-blue-subtlest { @apply ctx-blue-subtlest; }
|
|
41
|
-
.ctx-brand-boldest { @apply ctx-brand-boldest; }
|
|
42
|
-
.ctx-brand-bolder { @apply ctx-brand-bolder; }
|
|
43
|
-
.ctx-brand-bold { @apply ctx-brand-bold; }
|
|
44
|
-
.ctx-brand-subtle { @apply ctx-brand-subtle; }
|
|
45
|
-
.ctx-brand-subtler { @apply ctx-brand-subtler; }
|
|
46
|
-
.ctx-brand-subtlest { @apply ctx-brand-subtlest; }
|
|
47
|
-
.ctx-brown-bolder { @apply ctx-brown-bolder; }
|
|
48
|
-
.ctx-brown-subtle { @apply ctx-brown-subtle; }
|
|
49
|
-
.ctx-brown-subtler { @apply ctx-brown-subtler; }
|
|
50
|
-
.ctx-brown-subtlest { @apply ctx-brown-subtlest; }
|
|
51
|
-
.ctx-danger-subtlest { @apply ctx-danger; }
|
|
52
|
-
.ctx-danger-bolder { @apply ctx-danger-bolder; }
|
|
53
|
-
.ctx-gray-bolder { @apply ctx-gray-bolder; }
|
|
54
|
-
.ctx-gray-subtle { @apply ctx-gray-subtle; }
|
|
55
|
-
.ctx-gray-subtler { @apply ctx-gray-subtler; }
|
|
56
|
-
.ctx-gray-subtlest { @apply ctx-gray-subtlest; }
|
|
57
|
-
.ctx-green-bolder { @apply ctx-green-bolder; }
|
|
58
|
-
.ctx-green-subtle { @apply ctx-green-subtle; }
|
|
59
|
-
.ctx-green-subtler { @apply ctx-green-subtler; }
|
|
60
|
-
.ctx-green-subtlest { @apply ctx-green-subtlest; }
|
|
61
|
-
.ctx-info-subtlest { @apply ctx-info; }
|
|
62
|
-
.ctx-info-bolder { @apply ctx-info-bolder; }
|
|
63
|
-
.ctx-magenta-bolder { @apply ctx-magenta-bolder; }
|
|
64
|
-
.ctx-magenta-subtle { @apply ctx-magenta-subtle; }
|
|
65
|
-
.ctx-magenta-subtler { @apply ctx-magenta-subtler; }
|
|
66
|
-
.ctx-magenta-subtlest { @apply ctx-magenta-subtlest; }
|
|
67
|
-
.ctx-neutral-boldest { @apply ctx-neutral-boldest; }
|
|
68
|
-
.ctx-neutral-bolder { @apply ctx-neutral-bolder; }
|
|
69
|
-
.ctx-neutral-bold { @apply ctx-neutral-bold; }
|
|
70
|
-
.ctx-neutral-subtle { @apply ctx-neutral-subtle; }
|
|
71
|
-
.ctx-neutral-subtler { @apply ctx-neutral-subtler; }
|
|
72
|
-
.ctx-neutral-subtlest { @apply ctx-neutral-subtlest; }
|
|
73
|
-
.ctx-orange-bolder { @apply ctx-orange-bolder; }
|
|
74
|
-
.ctx-orange-subtle { @apply ctx-orange-subtle; }
|
|
75
|
-
.ctx-orange-subtler { @apply ctx-orange-subtler; }
|
|
76
|
-
.ctx-orange-subtlest { @apply ctx-orange-subtlest; }
|
|
77
|
-
.ctx-purple-bolder { @apply ctx-purple-bolder; }
|
|
78
|
-
.ctx-purple-subtle { @apply ctx-purple-subtle; }
|
|
79
|
-
.ctx-purple-subtler { @apply ctx-purple-subtler; }
|
|
80
|
-
.ctx-purple-subtlest { @apply ctx-purple-subtlest; }
|
|
81
|
-
.ctx-red-bolder { @apply ctx-red-bolder; }
|
|
82
|
-
.ctx-red-subtle { @apply ctx-red-subtle; }
|
|
83
|
-
.ctx-red-subtler { @apply ctx-red-subtler; }
|
|
84
|
-
.ctx-red-subtlest { @apply ctx-red-subtlest; }
|
|
85
|
-
.ctx-success-subtlest { @apply ctx-success; }
|
|
86
|
-
.ctx-success-bolder { @apply ctx-success-bolder; }
|
|
87
|
-
.ctx-teal-bolder { @apply ctx-teal-bolder; }
|
|
88
|
-
.ctx-teal-subtle { @apply ctx-teal-subtle; }
|
|
89
|
-
.ctx-teal-subtler { @apply ctx-teal-subtler; }
|
|
90
|
-
.ctx-teal-subtlest { @apply ctx-teal-subtlest; }
|
|
91
|
-
.ctx-warning-subtlest { @apply ctx-warning; }
|
|
92
|
-
.ctx-warning-bolder { @apply ctx-warning-bolder; }
|
|
93
|
-
.ctx-yellow-bolder { @apply ctx-yellow-bolder; }
|
|
94
|
-
.ctx-yellow-subtle { @apply ctx-yellow-subtle; }
|
|
95
|
-
.ctx-yellow-subtler { @apply ctx-yellow-subtler; }
|
|
96
|
-
.ctx-yellow-subtlest { @apply ctx-yellow-subtlest; }
|
|
97
223
|
|
|
98
224
|
|
|
99
225
|
/* === ./styles/semantic.css === */
|
|
@@ -774,18 +900,18 @@
|
|
|
774
900
|
}
|
|
775
901
|
|
|
776
902
|
@utility ctx-brand-bolder {
|
|
777
|
-
--ctx-text: var(--color-default-
|
|
903
|
+
--ctx-text: var(--color-default-neutral-0);
|
|
778
904
|
--ctx-text-bold: var(--color-default-neutral-0);
|
|
779
|
-
--ctx-background: var(--color-default-bcc-
|
|
780
|
-
--ctx-gradient: var(--color-default-bcc-
|
|
905
|
+
--ctx-background: var(--color-default-bcc-800);
|
|
906
|
+
--ctx-gradient: var(--color-default-bcc-900);
|
|
781
907
|
--ctx-border: var(--color-default-bcc-700);
|
|
782
908
|
--ctx-shadow: var(--color-neutral-alpha-500A);
|
|
783
|
-
--ctx-text-hover: var(--color-default-
|
|
784
|
-
--ctx-text-pressed: var(--color-default-
|
|
785
|
-
--ctx-background-hover: var(--color-default-bcc-
|
|
786
|
-
--ctx-background-pressed: var(--color-default-bcc-
|
|
787
|
-
--ctx-gradient-hover: var(--color-default-bcc-
|
|
788
|
-
--ctx-gradient-pressed: var(--color-default-bcc-
|
|
909
|
+
--ctx-text-hover: var(--color-default-neutral-0);
|
|
910
|
+
--ctx-text-pressed: var(--color-default-neutral-0);
|
|
911
|
+
--ctx-background-hover: var(--color-default-bcc-900);
|
|
912
|
+
--ctx-background-pressed: var(--color-default-bcc-1000);
|
|
913
|
+
--ctx-gradient-hover: var(--color-default-bcc-1000);
|
|
914
|
+
--ctx-gradient-pressed: var(--color-default-bcc-1000);
|
|
789
915
|
--ctx-border-hover: var(--color-default-bcc-700);
|
|
790
916
|
--ctx-border-pressed: var(--color-default-bcc-700);
|
|
791
917
|
}
|
|
@@ -980,16 +1106,16 @@
|
|
|
980
1106
|
@utility ctx-gray-bolder {
|
|
981
1107
|
--ctx-text: var(--color-default-neutral-200);
|
|
982
1108
|
--ctx-text-bold: var(--color-default-neutral-100);
|
|
983
|
-
--ctx-background: var(--color-default-neutral-
|
|
984
|
-
--ctx-gradient: var(--color-default-neutral-
|
|
1109
|
+
--ctx-background: var(--color-default-neutral-700);
|
|
1110
|
+
--ctx-gradient: var(--color-default-neutral-800);
|
|
985
1111
|
--ctx-border: var(--color-default-neutral-700);
|
|
986
1112
|
--ctx-shadow: var(--color-neutral-alpha-500A);
|
|
987
1113
|
--ctx-text-hover: var(--color-default-neutral-200);
|
|
988
1114
|
--ctx-text-pressed: var(--color-default-neutral-200);
|
|
989
|
-
--ctx-background-hover: var(--color-default-neutral-
|
|
990
|
-
--ctx-background-pressed: var(--color-default-neutral-
|
|
991
|
-
--ctx-gradient-hover: var(--color-default-neutral-
|
|
992
|
-
--ctx-gradient-pressed: var(--color-default-neutral-
|
|
1115
|
+
--ctx-background-hover: var(--color-default-neutral-800);
|
|
1116
|
+
--ctx-background-pressed: var(--color-default-neutral-900);
|
|
1117
|
+
--ctx-gradient-hover: var(--color-default-neutral-900);
|
|
1118
|
+
--ctx-gradient-pressed: var(--color-default-neutral-900);
|
|
993
1119
|
--ctx-border-hover: var(--color-default-neutral-700);
|
|
994
1120
|
--ctx-border-pressed: var(--color-default-neutral-700);
|
|
995
1121
|
}
|
|
@@ -1947,6 +2073,155 @@
|
|
|
1947
2073
|
font-size: var(--text-md);
|
|
1948
2074
|
}
|
|
1949
2075
|
|
|
2076
|
+
/* primevue-overrides.css - CSS-level component overrides */
|
|
2077
|
+
@layer custom {
|
|
2078
|
+
.p-accordionheader {
|
|
2079
|
+
gap: var(--p-accordion-header-gap);
|
|
2080
|
+
}
|
|
2081
|
+
|
|
2082
|
+
.p-autocomplete-input-multiple {
|
|
2083
|
+
min-height: var(--p-autocomplete-input-multiple-min-height);
|
|
2084
|
+
gap: var(--p-autocomplete-input-multiple-gap);
|
|
2085
|
+
}
|
|
2086
|
+
|
|
2087
|
+
.p-badge-circle {
|
|
2088
|
+
border-radius: var(--p-badge-circle-border-radius);
|
|
2089
|
+
}
|
|
2090
|
+
|
|
2091
|
+
.p-button {
|
|
2092
|
+
min-height: var(--p-button-min-height);
|
|
2093
|
+
}
|
|
2094
|
+
|
|
2095
|
+
.p-button-sm {
|
|
2096
|
+
min-height: var(--p-button-sm-min-height);
|
|
2097
|
+
}
|
|
2098
|
+
|
|
2099
|
+
.p-button-lg {
|
|
2100
|
+
min-height: var(--p-button-lg-min-height);
|
|
2101
|
+
}
|
|
2102
|
+
|
|
2103
|
+
.p-button.p-button-icon-only {
|
|
2104
|
+
min-width: var(--p-button-icon-only-width);
|
|
2105
|
+
}
|
|
2106
|
+
|
|
2107
|
+
.p-button-sm.p-button-icon-only {
|
|
2108
|
+
min-width: var(--p-button-sm-icon-only-width);
|
|
2109
|
+
}
|
|
2110
|
+
|
|
2111
|
+
.p-button-lg.p-button-icon-only {
|
|
2112
|
+
min-width: var(--p-button-lg-icon-only-width);
|
|
2113
|
+
}
|
|
2114
|
+
|
|
2115
|
+
.p-divider {
|
|
2116
|
+
gap: var(--p-divider-content-gap);
|
|
2117
|
+
}
|
|
2118
|
+
|
|
2119
|
+
.p-inputgroupaddon {
|
|
2120
|
+
min-height: var(--p-inputgroup-addon-min-height);
|
|
2121
|
+
}
|
|
2122
|
+
|
|
2123
|
+
.p-inputtext {
|
|
2124
|
+
min-height: var(--p-inputtext-min-height);
|
|
2125
|
+
}
|
|
2126
|
+
|
|
2127
|
+
.p-inputtext-sm {
|
|
2128
|
+
min-height: var(--p-inputtext-sm-min-height);
|
|
2129
|
+
}
|
|
2130
|
+
|
|
2131
|
+
.p-inputtext-lg {
|
|
2132
|
+
min-height: var(--p-inputtext-lg-min-height);
|
|
2133
|
+
}
|
|
2134
|
+
|
|
2135
|
+
.p-message-text {
|
|
2136
|
+
line-height: var(--p-message-text-line-height);
|
|
2137
|
+
}
|
|
2138
|
+
|
|
2139
|
+
.p-multiselect {
|
|
2140
|
+
min-height: var(--p-multiselect-min-height);
|
|
2141
|
+
}
|
|
2142
|
+
|
|
2143
|
+
.p-multiselect-sm {
|
|
2144
|
+
min-height: var(--p-multiselect-sm-min-height);
|
|
2145
|
+
}
|
|
2146
|
+
|
|
2147
|
+
.p-multiselect-lg {
|
|
2148
|
+
min-height: var(--p-multiselect-lg-min-height);
|
|
2149
|
+
}
|
|
2150
|
+
|
|
2151
|
+
.p-multiselect-label-container {
|
|
2152
|
+
display: flex;
|
|
2153
|
+
align-items: center;
|
|
2154
|
+
}
|
|
2155
|
+
|
|
2156
|
+
.p-radiobutton {
|
|
2157
|
+
gap: var(--p-radiobutton-gap);
|
|
2158
|
+
border-radius: var(--p-radiobutton-border-radius);
|
|
2159
|
+
}
|
|
2160
|
+
|
|
2161
|
+
.p-radiobutton-icon {
|
|
2162
|
+
border-radius: var(--p-radiobutton-icon-border-radius);
|
|
2163
|
+
}
|
|
2164
|
+
|
|
2165
|
+
.p-radiobutton-icon-sm {
|
|
2166
|
+
border-radius: var(--p-radiobutton-icon-sm-border-radius);
|
|
2167
|
+
}
|
|
2168
|
+
|
|
2169
|
+
.p-radiobutton-icon-lg {
|
|
2170
|
+
border-radius: var(--p-radiobutton-icon-lg-border-radius);
|
|
2171
|
+
}
|
|
2172
|
+
|
|
2173
|
+
.p-select {
|
|
2174
|
+
min-height: var(--p-select-min-height);
|
|
2175
|
+
}
|
|
2176
|
+
|
|
2177
|
+
.p-select-sm {
|
|
2178
|
+
min-height: var(--p-select-sm-min-height);
|
|
2179
|
+
}
|
|
2180
|
+
|
|
2181
|
+
.p-select-lg {
|
|
2182
|
+
min-height: var(--p-select-lg-min-height);
|
|
2183
|
+
}
|
|
2184
|
+
|
|
2185
|
+
.p-select-label {
|
|
2186
|
+
display: flex;
|
|
2187
|
+
align-items: center;
|
|
2188
|
+
}
|
|
2189
|
+
|
|
2190
|
+
.p-select-option {
|
|
2191
|
+
gap: var(--p-select-option-gap);
|
|
2192
|
+
}
|
|
2193
|
+
|
|
2194
|
+
.p-textarea {
|
|
2195
|
+
min-height: var(--p-textarea-min-height);
|
|
2196
|
+
}
|
|
2197
|
+
|
|
2198
|
+
.p-togglebutton {
|
|
2199
|
+
min-height: var(--p-togglebutton-min-height);
|
|
2200
|
+
}
|
|
2201
|
+
|
|
2202
|
+
.p-togglebutton .p-togglebutton-sm {
|
|
2203
|
+
min-height: var(--p-togglebutton-sm-min-height);
|
|
2204
|
+
border-radius: var(--p-togglebutton-sm-border-radius);
|
|
2205
|
+
}
|
|
2206
|
+
|
|
2207
|
+
.p-togglebutton-lg {
|
|
2208
|
+
min-height: var(--p-togglebutton-lg-min-height);
|
|
2209
|
+
}
|
|
2210
|
+
|
|
2211
|
+
.p-togglebutton .p-togglebutton-content {
|
|
2212
|
+
min-height: var(--p-togglebutton-content-min-height);
|
|
2213
|
+
}
|
|
2214
|
+
|
|
2215
|
+
.p-togglebutton-sm .p-togglebutton-content {
|
|
2216
|
+
min-height: var(--p-togglebutton-content-sm-min-height);
|
|
2217
|
+
border-radius: var(--p-togglebutton-content-sm-border-radius);
|
|
2218
|
+
}
|
|
2219
|
+
|
|
2220
|
+
.p-togglebutton-lg .p-togglebutton-content {
|
|
2221
|
+
min-height: var(--p-togglebutton-content-lg-min-height);
|
|
2222
|
+
}
|
|
2223
|
+
}
|
|
2224
|
+
|
|
1950
2225
|
|
|
1951
2226
|
|
|
1952
2227
|
|
|
@@ -1962,29 +2237,27 @@
|
|
|
1962
2237
|
}
|
|
1963
2238
|
|
|
1964
2239
|
.bcc-app-nav-item {
|
|
1965
|
-
@apply
|
|
2240
|
+
@apply relative flex h-12 flex-1 flex-col items-center justify-center gap-1 transition-colors focus:ring-0 focus:outline-none;
|
|
1966
2241
|
}
|
|
1967
2242
|
|
|
1968
2243
|
.bcc-nav-item-icon {
|
|
1969
|
-
@apply size-6
|
|
2244
|
+
@apply size-6 icon-subtlest;
|
|
1970
2245
|
}
|
|
1971
2246
|
|
|
1972
2247
|
.bcc-nav-item-badge {
|
|
1973
|
-
@apply absolute top-0 right-1
|
|
2248
|
+
@apply absolute top-0 right-1;
|
|
1974
2249
|
}
|
|
1975
2250
|
|
|
1976
2251
|
.bcc-nav-item-title {
|
|
1977
|
-
@apply
|
|
2252
|
+
@apply heading-xs text-center text-subtlest opacity-75;
|
|
1978
2253
|
}
|
|
1979
2254
|
|
|
1980
|
-
.bcc-app-nav-item--active {
|
|
1981
|
-
@apply text-selected;
|
|
2255
|
+
.bcc-app-nav-item--active .bcc-nav-item-title {
|
|
2256
|
+
@apply text-selected opacity-100;
|
|
1982
2257
|
}
|
|
1983
2258
|
|
|
1984
|
-
.bcc-app-nav-item--active .bcc-nav-item-icon
|
|
1985
|
-
|
|
1986
|
-
.bcc-app-nav-item--active .bcc-nav-item-title {
|
|
1987
|
-
@apply opacity-100;
|
|
2259
|
+
.bcc-app-nav-item--active .bcc-nav-item-icon {
|
|
2260
|
+
@apply text-selected;
|
|
1988
2261
|
}
|
|
1989
2262
|
}
|
|
1990
2263
|
|
|
@@ -2001,16 +2274,16 @@
|
|
|
2001
2274
|
@apply ctx-gradient;
|
|
2002
2275
|
}
|
|
2003
2276
|
.bcc-badge.sm {
|
|
2004
|
-
@apply
|
|
2277
|
+
@apply heading-xs h-4 w-4;
|
|
2005
2278
|
}
|
|
2006
2279
|
.bcc-badge.md {
|
|
2007
|
-
@apply
|
|
2280
|
+
@apply heading-sm h-5 w-5;
|
|
2008
2281
|
}
|
|
2009
2282
|
.bcc-badge.lg {
|
|
2010
|
-
@apply
|
|
2283
|
+
@apply heading-md h-6 w-6;
|
|
2011
2284
|
}
|
|
2012
2285
|
.bcc-badge.xl {
|
|
2013
|
-
@apply
|
|
2286
|
+
@apply heading-md h-8 w-8;
|
|
2014
2287
|
}
|
|
2015
2288
|
|
|
2016
2289
|
.bcc-badge .bcc-badge-icon {
|
|
@@ -2058,57 +2331,63 @@
|
|
|
2058
2331
|
|
|
2059
2332
|
/* from ./BccCapacityIndicator/BccCapacityIndicator.css */
|
|
2060
2333
|
@layer components {
|
|
2061
|
-
|
|
2062
|
-
|
|
2063
|
-
|
|
2334
|
+
.bcc-capacity-indicator {
|
|
2335
|
+
@apply text-base;
|
|
2336
|
+
}
|
|
2064
2337
|
|
|
2065
|
-
|
|
2066
|
-
|
|
2067
|
-
|
|
2338
|
+
.bcc-capacity-indicator.xs {
|
|
2339
|
+
@apply text-xs;
|
|
2340
|
+
}
|
|
2068
2341
|
|
|
2069
|
-
|
|
2070
|
-
|
|
2071
|
-
|
|
2342
|
+
.bcc-capacity-indicator.sm {
|
|
2343
|
+
@apply text-sm;
|
|
2344
|
+
}
|
|
2072
2345
|
|
|
2073
|
-
|
|
2074
|
-
|
|
2075
|
-
|
|
2346
|
+
.bcc-capacity-indicator.lg {
|
|
2347
|
+
@apply text-xl;
|
|
2348
|
+
}
|
|
2076
2349
|
|
|
2077
|
-
|
|
2078
|
-
|
|
2079
|
-
|
|
2080
|
-
|
|
2081
|
-
|
|
2082
|
-
|
|
2083
|
-
|
|
2084
|
-
|
|
2350
|
+
.bcc-capacity-indicator {
|
|
2351
|
+
--bcc-capacity-indicator-background: transparent;
|
|
2352
|
+
--bcc-capacity-indicator-text: var(--ctx-text);
|
|
2353
|
+
--bcc-capacity-indicator-circle: var(--ctx-background);
|
|
2354
|
+
--bcc-capacity-indicator-circle-used: var(--color-brand-500);
|
|
2355
|
+
background: var(--bcc-capacity-indicator-background);
|
|
2356
|
+
@apply ctx-gray-subtlest;
|
|
2357
|
+
}
|
|
2085
2358
|
|
|
2086
|
-
|
|
2087
|
-
|
|
2088
|
-
|
|
2089
|
-
|
|
2359
|
+
.bcc-capacity-indicator.colored {
|
|
2360
|
+
--bcc-capacity-indicator-background: var(--ctx-background);
|
|
2361
|
+
--bcc-capacity-indicator-circle: var(--ctx-background-hover);
|
|
2362
|
+
--bcc-capacity-indicator-circle-used: var(--ctx-border);
|
|
2363
|
+
@apply ctx-blue-subtlest;
|
|
2364
|
+
}
|
|
2090
2365
|
|
|
2091
|
-
|
|
2092
|
-
|
|
2093
|
-
|
|
2094
|
-
|
|
2095
|
-
|
|
2096
|
-
|
|
2097
|
-
|
|
2098
|
-
|
|
2099
|
-
|
|
2366
|
+
.bcc-capacity-indicator .text {
|
|
2367
|
+
color: var(--bcc-capacity-indicator-text);
|
|
2368
|
+
}
|
|
2369
|
+
.bcc-capacity-indicator .circle {
|
|
2370
|
+
stroke: var(--bcc-capacity-indicator-circle);
|
|
2371
|
+
}
|
|
2372
|
+
.bcc-capacity-indicator .circle-used {
|
|
2373
|
+
stroke: var(--bcc-capacity-indicator-circle-used);
|
|
2374
|
+
}
|
|
2100
2375
|
|
|
2101
|
-
|
|
2102
|
-
|
|
2103
|
-
|
|
2104
|
-
|
|
2376
|
+
.bcc-capacity-indicator.is-warning {
|
|
2377
|
+
@apply ctx-yellow-subtlest;
|
|
2378
|
+
--bcc-capacity-indicator-circle-used: var(--ctx-border);
|
|
2379
|
+
}
|
|
2105
2380
|
|
|
2106
|
-
|
|
2107
|
-
|
|
2108
|
-
|
|
2381
|
+
.bcc-capacity-indicator.is-full {
|
|
2382
|
+
@apply ctx-red-subtlest;
|
|
2383
|
+
|
|
2384
|
+
--bcc-capacity-indicator-circle: var(--ctx-background);
|
|
2385
|
+
--bcc-capacity-indicator-circle-used: var(--ctx-border);
|
|
2386
|
+
}
|
|
2109
2387
|
}
|
|
2110
2388
|
|
|
2111
2389
|
|
|
2390
|
+
|
|
2112
2391
|
/* from ./BccDialKnob/BccDialKnob.css */
|
|
2113
2392
|
@layer components {
|
|
2114
2393
|
.bcc-knob {
|
|
@@ -2142,40 +2421,43 @@
|
|
|
2142
2421
|
|
|
2143
2422
|
/* from ./BccFrame/BccFrame.css */
|
|
2144
2423
|
@layer components {
|
|
2145
|
-
|
|
2146
|
-
|
|
2147
|
-
|
|
2424
|
+
.bcc-frame {
|
|
2425
|
+
@apply ctx ctx-default w-full border border-transparent;
|
|
2426
|
+
}
|
|
2148
2427
|
|
|
2149
|
-
|
|
2150
|
-
|
|
2151
|
-
|
|
2428
|
+
.bcc-frame.bcc-frame--shadow {
|
|
2429
|
+
@apply shadow-ctx shadow;
|
|
2430
|
+
}
|
|
2152
2431
|
|
|
2153
|
-
|
|
2154
|
-
|
|
2155
|
-
|
|
2156
|
-
|
|
2157
|
-
|
|
2158
|
-
|
|
2159
|
-
|
|
2160
|
-
|
|
2161
|
-
|
|
2432
|
+
.bcc-frame--raised {
|
|
2433
|
+
--ctx-background: var(--color-elevation-surface-raised-default);
|
|
2434
|
+
}
|
|
2435
|
+
.bcc-frame--rounded {
|
|
2436
|
+
@apply rounded-md;
|
|
2437
|
+
}
|
|
2438
|
+
.bcc-frame--raised.bcc-frame--shadow {
|
|
2439
|
+
@apply shadow-raised dark:border-default;
|
|
2440
|
+
}
|
|
2162
2441
|
|
|
2163
|
-
|
|
2164
|
-
|
|
2165
|
-
|
|
2166
|
-
|
|
2167
|
-
|
|
2168
|
-
|
|
2442
|
+
.bcc-frame--overlay {
|
|
2443
|
+
--ctx-background: var(--color-elevation-surface-overlay-default);
|
|
2444
|
+
@apply border;
|
|
2445
|
+
}
|
|
2446
|
+
.bcc-frame--overlay.bcc-frame--shadow {
|
|
2447
|
+
@apply shadow-overlay dark:border-default;
|
|
2448
|
+
}
|
|
2169
2449
|
|
|
2170
|
-
|
|
2171
|
-
|
|
2172
|
-
|
|
2173
|
-
|
|
2174
|
-
|
|
2175
|
-
|
|
2450
|
+
.bcc-frame--sunken {
|
|
2451
|
+
--ctx-background: var(--color-elevation-surface-sunken-default);
|
|
2452
|
+
@apply border;
|
|
2453
|
+
}
|
|
2454
|
+
.bcc-frame--sunken.bcc-frame--shadow {
|
|
2455
|
+
@apply dark:border-default shadow-inner;
|
|
2456
|
+
}
|
|
2176
2457
|
}
|
|
2177
2458
|
|
|
2178
2459
|
|
|
2460
|
+
|
|
2179
2461
|
/* from ./BccGraphic/BccGraphic.css */
|
|
2180
2462
|
@layer components {
|
|
2181
2463
|
.bcc-graphic .corner,
|
|
@@ -2279,177 +2561,180 @@
|
|
|
2279
2561
|
|
|
2280
2562
|
/* from ./BccNpsScore/BccNpsScore.css */
|
|
2281
2563
|
@layer components {
|
|
2282
|
-
|
|
2283
|
-
|
|
2284
|
-
|
|
2564
|
+
.bcc-nps-score {
|
|
2565
|
+
@apply body-sm flex min-w-70 flex-col gap-y-2 p-4 select-none;
|
|
2566
|
+
}
|
|
2285
2567
|
|
|
2286
|
-
|
|
2287
|
-
|
|
2288
|
-
|
|
2568
|
+
.bcc-nps-score--heading {
|
|
2569
|
+
@apply flex items-center justify-between;
|
|
2570
|
+
}
|
|
2289
2571
|
|
|
2290
|
-
|
|
2291
|
-
|
|
2292
|
-
|
|
2572
|
+
.bcc-nps-score--label {
|
|
2573
|
+
@apply flex-1 truncate;
|
|
2574
|
+
}
|
|
2293
2575
|
|
|
2294
|
-
|
|
2295
|
-
|
|
2296
|
-
|
|
2297
|
-
|
|
2576
|
+
.bcc-nps-score--bar {
|
|
2577
|
+
@apply pointer-events-none flex justify-evenly rounded-xl text-white;
|
|
2578
|
+
@apply bg-linear-to-r from-red-600 via-yellow-400 via-75% to-green-400;
|
|
2579
|
+
}
|
|
2298
2580
|
|
|
2299
|
-
|
|
2300
|
-
|
|
2301
|
-
|
|
2581
|
+
.bcc-nps-score--bar.reverse {
|
|
2582
|
+
@apply bg-linear-to-l;
|
|
2583
|
+
}
|
|
2302
2584
|
|
|
2303
|
-
|
|
2304
|
-
|
|
2305
|
-
|
|
2585
|
+
.bcc-nps-score--bar.disabled .bcc-nps-score--number.inactive {
|
|
2586
|
+
@apply bg-ctx ctx-gray-subtlest text-disabled;
|
|
2587
|
+
}
|
|
2306
2588
|
|
|
2307
|
-
|
|
2308
|
-
|
|
2309
|
-
|
|
2310
|
-
|
|
2311
|
-
|
|
2589
|
+
.bcc-nps-score--number {
|
|
2590
|
+
@apply border-inverse;
|
|
2591
|
+
@apply flex h-8 flex-1 items-center justify-center border-r-2 text-sm leading-none font-bold;
|
|
2592
|
+
@apply pointer-events-auto cursor-pointer transition-all duration-200 hover:bg-transparent;
|
|
2593
|
+
}
|
|
2312
2594
|
|
|
2313
|
-
|
|
2314
|
-
|
|
2315
|
-
|
|
2595
|
+
.bcc-nps-score--number:disabled {
|
|
2596
|
+
@apply cursor-not-allowed;
|
|
2597
|
+
}
|
|
2316
2598
|
|
|
2317
|
-
|
|
2318
|
-
|
|
2319
|
-
|
|
2320
|
-
|
|
2599
|
+
.bcc-nps-score--number.active {
|
|
2600
|
+
@apply pointer-events-none;
|
|
2601
|
+
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
|
|
2602
|
+
}
|
|
2321
2603
|
|
|
2322
|
-
|
|
2323
|
-
|
|
2324
|
-
|
|
2604
|
+
.bcc-nps-score--number:has(~ .bcc-nps-score--number.active) {
|
|
2605
|
+
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
|
|
2606
|
+
}
|
|
2325
2607
|
|
|
2326
|
-
|
|
2327
|
-
|
|
2328
|
-
|
|
2608
|
+
.bcc-nps-score--number.inactive {
|
|
2609
|
+
@apply bg-ctx text-ctx ctx-gray-subtler;
|
|
2610
|
+
}
|
|
2329
2611
|
|
|
2330
|
-
|
|
2331
|
-
|
|
2332
|
-
|
|
2333
|
-
|
|
2334
|
-
|
|
2335
|
-
|
|
2612
|
+
.bcc-nps-score--number:first-child {
|
|
2613
|
+
@apply rounded-l-xl pl-0.5;
|
|
2614
|
+
}
|
|
2615
|
+
.bcc-nps-score--number:last-child {
|
|
2616
|
+
@apply rounded-r-xl border-r-0 pr-0.5;
|
|
2617
|
+
}
|
|
2336
2618
|
}
|
|
2337
2619
|
|
|
2338
2620
|
|
|
2339
2621
|
|
|
2340
2622
|
/* from ./BccReact/BccReact.css */
|
|
2341
2623
|
@layer components {
|
|
2342
|
-
|
|
2343
|
-
|
|
2344
|
-
|
|
2345
|
-
|
|
2346
|
-
|
|
2347
|
-
|
|
2348
|
-
|
|
2349
|
-
|
|
2350
|
-
|
|
2351
|
-
|
|
2352
|
-
|
|
2353
|
-
|
|
2624
|
+
.bcc-react {
|
|
2625
|
+
@apply relative flex w-full items-center overflow-visible;
|
|
2626
|
+
}
|
|
2627
|
+
.bcc-react-toggle {
|
|
2628
|
+
@apply mr-1 flex shrink-0 cursor-pointer items-center justify-center rounded-full p-1 transition;
|
|
2629
|
+
}
|
|
2630
|
+
.bcc-react-list {
|
|
2631
|
+
@apply hide-scrollbar flex flex-1 items-center gap-1 overflow-x-auto overflow-y-hidden rounded-full p-1;
|
|
2632
|
+
}
|
|
2633
|
+
.bcc-react-empty {
|
|
2634
|
+
@apply heading-xs flex items-center;
|
|
2635
|
+
}
|
|
2354
2636
|
|
|
2355
|
-
|
|
2356
|
-
|
|
2357
|
-
|
|
2358
|
-
|
|
2637
|
+
.bcc-react-selector-container {
|
|
2638
|
+
@apply absolute z-50 h-9;
|
|
2639
|
+
@apply top-11 origin-top-left;
|
|
2640
|
+
}
|
|
2359
2641
|
|
|
2360
|
-
|
|
2361
|
-
|
|
2362
|
-
|
|
2642
|
+
.bcc-react-selector-container--top {
|
|
2643
|
+
@apply -top-10 origin-bottom-left;
|
|
2644
|
+
}
|
|
2363
2645
|
|
|
2364
|
-
|
|
2365
|
-
|
|
2366
|
-
|
|
2367
|
-
|
|
2646
|
+
.bcc-react-selector {
|
|
2647
|
+
@apply flex h-9 flex-col overflow-hidden bg-neutral-100 px-0 shadow-md;
|
|
2648
|
+
border-radius: 18px;
|
|
2649
|
+
}
|
|
2368
2650
|
|
|
2369
|
-
|
|
2370
|
-
|
|
2371
|
-
|
|
2651
|
+
.bcc-react-selector-emojis-container {
|
|
2652
|
+
@apply flex items-center bg-neutral-100 px-1;
|
|
2653
|
+
}
|
|
2372
2654
|
|
|
2373
|
-
|
|
2374
|
-
|
|
2375
|
-
|
|
2376
|
-
|
|
2377
|
-
|
|
2378
|
-
|
|
2655
|
+
.bcc-react-selector-more {
|
|
2656
|
+
@apply flex w-9 items-center justify-center;
|
|
2657
|
+
}
|
|
2658
|
+
.bcc-react-selector-more-btn {
|
|
2659
|
+
@apply flex h-7 w-7 items-center justify-center rounded-full bg-slate-200;
|
|
2660
|
+
}
|
|
2379
2661
|
|
|
2380
|
-
|
|
2381
|
-
|
|
2382
|
-
|
|
2383
|
-
|
|
2384
|
-
|
|
2385
|
-
|
|
2386
|
-
|
|
2662
|
+
.bcc-react-dropdown-container {
|
|
2663
|
+
@apply top-0 left-0 -z-10 w-full max-w-full;
|
|
2664
|
+
width: 296px;
|
|
2665
|
+
}
|
|
2666
|
+
.bcc-react-dropdown-container--top {
|
|
2667
|
+
@apply top-auto bottom-0 pb-0;
|
|
2668
|
+
}
|
|
2387
2669
|
|
|
2388
|
-
|
|
2389
|
-
|
|
2390
|
-
|
|
2670
|
+
.bcc-react-dropdown {
|
|
2671
|
+
@apply -z-10 flex w-full flex-wrap overflow-hidden px-1;
|
|
2672
|
+
}
|
|
2391
2673
|
|
|
2392
|
-
|
|
2393
|
-
|
|
2394
|
-
|
|
2395
|
-
|
|
2396
|
-
|
|
2397
|
-
|
|
2398
|
-
|
|
2674
|
+
.bcc-react-arrow-down-icon {
|
|
2675
|
+
@apply h-6 w-6 text-slate-600;
|
|
2676
|
+
transition: transform 0.3s ease;
|
|
2677
|
+
}
|
|
2678
|
+
.bcc-react-arrow-down-icon.open {
|
|
2679
|
+
transform: rotate(-180deg);
|
|
2680
|
+
}
|
|
2399
2681
|
|
|
2400
|
-
|
|
2401
|
-
|
|
2402
|
-
|
|
2682
|
+
.bcc-react-selector-item {
|
|
2683
|
+
@apply relative h-9 w-9 p-2 text-xl leading-none transition-transform duration-200 ease-out;
|
|
2684
|
+
}
|
|
2403
2685
|
|
|
2404
|
-
|
|
2405
|
-
|
|
2406
|
-
|
|
2686
|
+
.bcc-react-selector-item--clicked {
|
|
2687
|
+
animation: scaleFadeOut 300ms forwards;
|
|
2688
|
+
}
|
|
2407
2689
|
|
|
2408
|
-
|
|
2409
|
-
|
|
2410
|
-
|
|
2411
|
-
|
|
2412
|
-
|
|
2413
|
-
|
|
2414
|
-
|
|
2415
|
-
|
|
2416
|
-
|
|
2417
|
-
|
|
2690
|
+
@keyframes scaleFadeOut {
|
|
2691
|
+
0% {
|
|
2692
|
+
transform: scale(1);
|
|
2693
|
+
opacity: 1;
|
|
2694
|
+
}
|
|
2695
|
+
100% {
|
|
2696
|
+
transform: scale(1.4);
|
|
2697
|
+
opacity: 0;
|
|
2698
|
+
}
|
|
2699
|
+
}
|
|
2418
2700
|
|
|
2419
|
-
|
|
2420
|
-
|
|
2421
|
-
|
|
2422
|
-
|
|
2423
|
-
|
|
2424
|
-
|
|
2425
|
-
|
|
2426
|
-
|
|
2701
|
+
.bcc-react-emoji-list-item {
|
|
2702
|
+
@apply ctx clickable center h-7 min-w-7 shrink-0 rounded-full p-1 text-lg leading-none drop-shadow transition-all hover:scale-105;
|
|
2703
|
+
/* Default --not-selected */
|
|
2704
|
+
@apply ctx-neutral-subtlest;
|
|
2705
|
+
}
|
|
2706
|
+
.bcc-react-emoji-list-item span {
|
|
2707
|
+
@apply leading-none;
|
|
2708
|
+
}
|
|
2709
|
+
.bcc-react-emoji-list-item.selected {
|
|
2710
|
+
@apply ctx-neutral-subtle;
|
|
2711
|
+
}
|
|
2427
2712
|
}
|
|
2428
2713
|
|
|
2429
2714
|
|
|
2430
2715
|
|
|
2431
2716
|
/* from ./BccTag/BccTag.css */
|
|
2432
|
-
|
|
2433
2717
|
@layer components {
|
|
2434
2718
|
.bcc-tag.bcc-badge {
|
|
2435
2719
|
@apply w-auto;
|
|
2436
2720
|
}
|
|
2437
2721
|
.bcc-tag.bcc-badge.md {
|
|
2438
|
-
@apply
|
|
2722
|
+
@apply body-md h-6;
|
|
2439
2723
|
}
|
|
2440
2724
|
.bcc-tag.bcc-badge.sm {
|
|
2441
|
-
@apply
|
|
2725
|
+
@apply body-sm h-5;
|
|
2442
2726
|
}
|
|
2443
2727
|
.bcc-tag.bcc-badge.lg {
|
|
2444
|
-
@apply
|
|
2728
|
+
@apply body-md h-8;
|
|
2445
2729
|
}
|
|
2446
2730
|
.bcc-tag.bcc-badge.xl {
|
|
2447
|
-
@apply
|
|
2731
|
+
@apply body-lg h-10;
|
|
2448
2732
|
}
|
|
2449
2733
|
}
|
|
2450
2734
|
|
|
2451
2735
|
|
|
2452
2736
|
|
|
2737
|
+
|
|
2453
2738
|
/* === ./components/wrapped/styles.css === */
|
|
2454
2739
|
|
|
2455
2740
|
/* from ./BccAvatar/BccAvatar.css */
|