@bcc-code/component-library-vue 0.2.0 → 0.3.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.
- package/dist/theme.css +76 -76
- package/package.json +1 -1
package/dist/theme.css
CHANGED
|
@@ -8,7 +8,7 @@
|
|
|
8
8
|
|
|
9
9
|
/* === ./styles/theme.css === */
|
|
10
10
|
@theme {
|
|
11
|
-
|
|
11
|
+
|
|
12
12
|
/* spacing variables */
|
|
13
13
|
--spacing-inset-top: env(safe-area-inset-top, var(--safe-area-inset-top, 0px));
|
|
14
14
|
--spacing-inset-top-1: max(0.25rem, env(safe-area-inset-top, var(--safe-area-inset-top, 0px)));
|
|
@@ -27,72 +27,72 @@
|
|
|
27
27
|
--color-overlay: rgba(17, 24, 39, 0.85);
|
|
28
28
|
}
|
|
29
29
|
|
|
30
|
-
.ctx-default { @apply ctx-default }
|
|
31
|
-
.ctx-success { @apply ctx-success-subtlest }
|
|
32
|
-
.ctx-danger { @apply ctx-danger-subtlest }
|
|
33
|
-
.ctx-warning { @apply ctx-warning-subtlest }
|
|
34
|
-
.ctx-info { @apply ctx-info-subtlest }
|
|
35
|
-
|
|
36
|
-
.ctx-blue-bolder { @apply ctx-blue-bolder }
|
|
37
|
-
.ctx-blue-subtle { @apply ctx-blue-subtle }
|
|
38
|
-
.ctx-blue-subtler { @apply ctx-blue-subtler }
|
|
39
|
-
.ctx-blue-subtlest { @apply ctx-blue-subtlest }
|
|
40
|
-
.ctx-brand-boldest { @apply ctx-brand-boldest }
|
|
41
|
-
.ctx-brand-bolder { @apply ctx-brand-bolder }
|
|
42
|
-
.ctx-brand-bold { @apply ctx-brand-bold }
|
|
43
|
-
.ctx-brand-subtle { @apply ctx-brand-subtle }
|
|
44
|
-
.ctx-brand-subtler { @apply ctx-brand-subtler }
|
|
45
|
-
.ctx-brand-subtlest { @apply ctx-brand-subtlest }
|
|
46
|
-
.ctx-brown-bolder { @apply ctx-brown-bolder }
|
|
47
|
-
.ctx-brown-subtle { @apply ctx-brown-subtle }
|
|
48
|
-
.ctx-brown-subtler { @apply ctx-brown-subtler }
|
|
49
|
-
.ctx-brown-subtlest { @apply ctx-brown-subtlest }
|
|
50
|
-
.ctx-danger-subtlest { @apply ctx-danger }
|
|
51
|
-
.ctx-danger-bolder { @apply ctx-danger-bolder }
|
|
52
|
-
.ctx-gray-bolder { @apply ctx-gray-bolder }
|
|
53
|
-
.ctx-gray-subtle { @apply ctx-gray-subtle }
|
|
54
|
-
.ctx-gray-subtler { @apply ctx-gray-subtler }
|
|
55
|
-
.ctx-gray-subtlest { @apply ctx-gray-subtlest }
|
|
56
|
-
.ctx-green-bolder { @apply ctx-green-bolder }
|
|
57
|
-
.ctx-green-subtle { @apply ctx-green-subtle }
|
|
58
|
-
.ctx-green-subtler { @apply ctx-green-subtler }
|
|
59
|
-
.ctx-green-subtlest { @apply ctx-green-subtlest }
|
|
60
|
-
.ctx-info-subtlest { @apply ctx-info }
|
|
61
|
-
.ctx-info-bolder { @apply ctx-info-bolder }
|
|
62
|
-
.ctx-magenta-bolder { @apply ctx-magenta-bolder }
|
|
63
|
-
.ctx-magenta-subtle { @apply ctx-magenta-subtle }
|
|
64
|
-
.ctx-magenta-subtler { @apply ctx-magenta-subtler }
|
|
65
|
-
.ctx-magenta-subtlest { @apply ctx-magenta-subtlest }
|
|
66
|
-
.ctx-neutral-boldest { @apply ctx-neutral-boldest }
|
|
67
|
-
.ctx-neutral-bolder { @apply ctx-neutral-bolder }
|
|
68
|
-
.ctx-neutral-bold { @apply ctx-neutral-bold }
|
|
69
|
-
.ctx-neutral-subtle { @apply ctx-neutral-subtle }
|
|
70
|
-
.ctx-neutral-subtler { @apply ctx-neutral-subtler }
|
|
71
|
-
.ctx-neutral-subtlest { @apply ctx-neutral-subtlest }
|
|
72
|
-
.ctx-orange-bolder { @apply ctx-orange-bolder }
|
|
73
|
-
.ctx-orange-subtle { @apply ctx-orange-subtle }
|
|
74
|
-
.ctx-orange-subtler { @apply ctx-orange-subtler }
|
|
75
|
-
.ctx-orange-subtlest { @apply ctx-orange-subtlest }
|
|
76
|
-
.ctx-purple-bolder { @apply ctx-purple-bolder }
|
|
77
|
-
.ctx-purple-subtle { @apply ctx-purple-subtle }
|
|
78
|
-
.ctx-purple-subtler { @apply ctx-purple-subtler }
|
|
79
|
-
.ctx-purple-subtlest { @apply ctx-purple-subtlest }
|
|
80
|
-
.ctx-red-bolder { @apply ctx-red-bolder }
|
|
81
|
-
.ctx-red-subtle { @apply ctx-red-subtle }
|
|
82
|
-
.ctx-red-subtler { @apply ctx-red-subtler }
|
|
83
|
-
.ctx-red-subtlest { @apply ctx-red-subtlest }
|
|
84
|
-
.ctx-success-subtlest { @apply ctx-success }
|
|
85
|
-
.ctx-success-bolder { @apply ctx-success-bolder }
|
|
86
|
-
.ctx-teal-bolder { @apply ctx-teal-bolder }
|
|
87
|
-
.ctx-teal-subtle { @apply ctx-teal-subtle }
|
|
88
|
-
.ctx-teal-subtler { @apply ctx-teal-subtler }
|
|
89
|
-
.ctx-teal-subtlest { @apply ctx-teal-subtlest }
|
|
90
|
-
.ctx-warning-subtlest { @apply ctx-warning }
|
|
91
|
-
.ctx-warning-bolder { @apply ctx-warning-bolder }
|
|
92
|
-
.ctx-yellow-bolder { @apply ctx-yellow-bolder }
|
|
93
|
-
.ctx-yellow-subtle { @apply ctx-yellow-subtle }
|
|
94
|
-
.ctx-yellow-subtler { @apply ctx-yellow-subtler }
|
|
95
|
-
.ctx-yellow-subtlest { @apply ctx-yellow-subtlest }
|
|
30
|
+
.ctx-default { @apply ctx-default; }
|
|
31
|
+
.ctx-success { @apply ctx-success-subtlest; }
|
|
32
|
+
.ctx-danger { @apply ctx-danger-subtlest; }
|
|
33
|
+
.ctx-warning { @apply ctx-warning-subtlest; }
|
|
34
|
+
.ctx-info { @apply ctx-info-subtlest; }
|
|
35
|
+
|
|
36
|
+
.ctx-blue-bolder { @apply ctx-blue-bolder; }
|
|
37
|
+
.ctx-blue-subtle { @apply ctx-blue-subtle; }
|
|
38
|
+
.ctx-blue-subtler { @apply ctx-blue-subtler; }
|
|
39
|
+
.ctx-blue-subtlest { @apply ctx-blue-subtlest; }
|
|
40
|
+
.ctx-brand-boldest { @apply ctx-brand-boldest; }
|
|
41
|
+
.ctx-brand-bolder { @apply ctx-brand-bolder; }
|
|
42
|
+
.ctx-brand-bold { @apply ctx-brand-bold; }
|
|
43
|
+
.ctx-brand-subtle { @apply ctx-brand-subtle; }
|
|
44
|
+
.ctx-brand-subtler { @apply ctx-brand-subtler; }
|
|
45
|
+
.ctx-brand-subtlest { @apply ctx-brand-subtlest; }
|
|
46
|
+
.ctx-brown-bolder { @apply ctx-brown-bolder; }
|
|
47
|
+
.ctx-brown-subtle { @apply ctx-brown-subtle; }
|
|
48
|
+
.ctx-brown-subtler { @apply ctx-brown-subtler; }
|
|
49
|
+
.ctx-brown-subtlest { @apply ctx-brown-subtlest; }
|
|
50
|
+
.ctx-danger-subtlest { @apply ctx-danger; }
|
|
51
|
+
.ctx-danger-bolder { @apply ctx-danger-bolder; }
|
|
52
|
+
.ctx-gray-bolder { @apply ctx-gray-bolder; }
|
|
53
|
+
.ctx-gray-subtle { @apply ctx-gray-subtle; }
|
|
54
|
+
.ctx-gray-subtler { @apply ctx-gray-subtler; }
|
|
55
|
+
.ctx-gray-subtlest { @apply ctx-gray-subtlest; }
|
|
56
|
+
.ctx-green-bolder { @apply ctx-green-bolder; }
|
|
57
|
+
.ctx-green-subtle { @apply ctx-green-subtle; }
|
|
58
|
+
.ctx-green-subtler { @apply ctx-green-subtler; }
|
|
59
|
+
.ctx-green-subtlest { @apply ctx-green-subtlest; }
|
|
60
|
+
.ctx-info-subtlest { @apply ctx-info; }
|
|
61
|
+
.ctx-info-bolder { @apply ctx-info-bolder; }
|
|
62
|
+
.ctx-magenta-bolder { @apply ctx-magenta-bolder; }
|
|
63
|
+
.ctx-magenta-subtle { @apply ctx-magenta-subtle; }
|
|
64
|
+
.ctx-magenta-subtler { @apply ctx-magenta-subtler; }
|
|
65
|
+
.ctx-magenta-subtlest { @apply ctx-magenta-subtlest; }
|
|
66
|
+
.ctx-neutral-boldest { @apply ctx-neutral-boldest; }
|
|
67
|
+
.ctx-neutral-bolder { @apply ctx-neutral-bolder; }
|
|
68
|
+
.ctx-neutral-bold { @apply ctx-neutral-bold; }
|
|
69
|
+
.ctx-neutral-subtle { @apply ctx-neutral-subtle; }
|
|
70
|
+
.ctx-neutral-subtler { @apply ctx-neutral-subtler; }
|
|
71
|
+
.ctx-neutral-subtlest { @apply ctx-neutral-subtlest; }
|
|
72
|
+
.ctx-orange-bolder { @apply ctx-orange-bolder; }
|
|
73
|
+
.ctx-orange-subtle { @apply ctx-orange-subtle; }
|
|
74
|
+
.ctx-orange-subtler { @apply ctx-orange-subtler; }
|
|
75
|
+
.ctx-orange-subtlest { @apply ctx-orange-subtlest; }
|
|
76
|
+
.ctx-purple-bolder { @apply ctx-purple-bolder; }
|
|
77
|
+
.ctx-purple-subtle { @apply ctx-purple-subtle; }
|
|
78
|
+
.ctx-purple-subtler { @apply ctx-purple-subtler; }
|
|
79
|
+
.ctx-purple-subtlest { @apply ctx-purple-subtlest; }
|
|
80
|
+
.ctx-red-bolder { @apply ctx-red-bolder; }
|
|
81
|
+
.ctx-red-subtle { @apply ctx-red-subtle; }
|
|
82
|
+
.ctx-red-subtler { @apply ctx-red-subtler; }
|
|
83
|
+
.ctx-red-subtlest { @apply ctx-red-subtlest; }
|
|
84
|
+
.ctx-success-subtlest { @apply ctx-success; }
|
|
85
|
+
.ctx-success-bolder { @apply ctx-success-bolder; }
|
|
86
|
+
.ctx-teal-bolder { @apply ctx-teal-bolder; }
|
|
87
|
+
.ctx-teal-subtle { @apply ctx-teal-subtle; }
|
|
88
|
+
.ctx-teal-subtler { @apply ctx-teal-subtler; }
|
|
89
|
+
.ctx-teal-subtlest { @apply ctx-teal-subtlest; }
|
|
90
|
+
.ctx-warning-subtlest { @apply ctx-warning; }
|
|
91
|
+
.ctx-warning-bolder { @apply ctx-warning-bolder; }
|
|
92
|
+
.ctx-yellow-bolder { @apply ctx-yellow-bolder; }
|
|
93
|
+
.ctx-yellow-subtle { @apply ctx-yellow-subtle; }
|
|
94
|
+
.ctx-yellow-subtler { @apply ctx-yellow-subtler; }
|
|
95
|
+
.ctx-yellow-subtlest { @apply ctx-yellow-subtlest; }
|
|
96
96
|
|
|
97
97
|
|
|
98
98
|
/* === ./styles/semantic.css === */
|
|
@@ -1739,10 +1739,10 @@
|
|
|
1739
1739
|
@utility ctx-default {
|
|
1740
1740
|
@apply ctx-neutral-subtlest;
|
|
1741
1741
|
}
|
|
1742
|
-
@utility ctx-success { @apply ctx-success-subtlest }
|
|
1743
|
-
@utility ctx-danger { @apply ctx-danger-subtlest }
|
|
1744
|
-
@utility ctx-warning { @apply ctx-warning-subtlest }
|
|
1745
|
-
@utility ctx-info { @apply ctx-info-subtlest }
|
|
1742
|
+
@utility ctx-success { @apply ctx-success-subtlest; }
|
|
1743
|
+
@utility ctx-danger { @apply ctx-danger-subtlest; }
|
|
1744
|
+
@utility ctx-warning { @apply ctx-warning-subtlest; }
|
|
1745
|
+
@utility ctx-info { @apply ctx-info-subtlest; }
|
|
1746
1746
|
|
|
1747
1747
|
@utility text-ctx {
|
|
1748
1748
|
color: var(--ctx-text);
|
|
@@ -2123,7 +2123,7 @@
|
|
|
2123
2123
|
@apply bottom-4 left-4;
|
|
2124
2124
|
}
|
|
2125
2125
|
.bcc-graphic .center-slot {
|
|
2126
|
-
@apply inset-1/4 h-1/2 w-1/2 flex items-center justify-center
|
|
2126
|
+
@apply inset-1/4 h-1/2 w-1/2 flex items-center justify-center;
|
|
2127
2127
|
}
|
|
2128
2128
|
|
|
2129
2129
|
.bcc-graphic {
|
|
@@ -2131,17 +2131,17 @@
|
|
|
2131
2131
|
}
|
|
2132
2132
|
|
|
2133
2133
|
.bcc-graphic-banner {
|
|
2134
|
-
@apply absolute inset-0 h-full w-full object-cover object-center
|
|
2134
|
+
@apply absolute inset-0 h-full w-full object-cover object-center;
|
|
2135
2135
|
}
|
|
2136
2136
|
.bcc-graphic-banner--loading {
|
|
2137
|
-
@apply animate-pulse bg-linear-to-tr from-background-brand-bolder-default to-background-brand-subtle-default
|
|
2137
|
+
@apply animate-pulse bg-linear-to-tr from-background-brand-bolder-default to-background-brand-subtle-default;
|
|
2138
2138
|
}
|
|
2139
2139
|
|
|
2140
2140
|
.bcc-graphic-logo {
|
|
2141
|
-
@apply absolute inset-1/4 h-1/2 w-1/2 object-contain object-center
|
|
2141
|
+
@apply absolute inset-1/4 h-1/2 w-1/2 object-contain object-center;
|
|
2142
2142
|
}
|
|
2143
2143
|
.bcc-graphic-logo--loading {
|
|
2144
|
-
@apply animate-pulse bg-black opacity-10 blur-sm
|
|
2144
|
+
@apply animate-pulse bg-black opacity-10 blur-sm;
|
|
2145
2145
|
}
|
|
2146
2146
|
}
|
|
2147
2147
|
|
package/package.json
CHANGED