@db-ux/core-components 4.3.1 → 4.3.2
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/CHANGELOG.md +6 -0
- package/build/components/accordion-item/accordion-item.css +0 -64
- package/build/components/custom-select-dropdown/custom-select-dropdown.css +0 -64
- package/build/components/drawer/drawer.css +18 -90
- package/build/components/drawer/drawer.scss +24 -37
- package/build/components/link/link.css +0 -64
- package/build/components/navigation-item/navigation-item.css +12 -72
- package/build/components/navigation-item/navigation-item.scss +13 -6
- package/build/components/notification/notification.css +0 -64
- package/build/components/popover/popover.css +0 -64
- package/build/components/tab-list/tab-list.css +0 -64
- package/build/components/tag/tag.css +0 -64
- package/build/components/textarea/textarea.css +0 -64
- package/build/components/tooltip/tooltip.css +0 -64
- package/build/styles/absolute.css +3 -3
- package/build/styles/component-animations.css +1 -1
- package/build/styles/index.css +2 -2
- package/build/styles/relative.css +3 -3
- package/build/styles/rollup.css +3 -3
- package/build/styles/webpack.css +3 -3
- package/package.json +3 -3
|
@@ -965,70 +965,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
965
965
|
transition: outline var(--db-transition-duration-extra-fast), color var(--db-transition-straight-emotional);
|
|
966
966
|
}
|
|
967
967
|
|
|
968
|
-
@keyframes show-right-to-left {
|
|
969
|
-
from {
|
|
970
|
-
transform: translateX(110%);
|
|
971
|
-
}
|
|
972
|
-
to {
|
|
973
|
-
transform: translateX(0%);
|
|
974
|
-
}
|
|
975
|
-
}
|
|
976
|
-
@keyframes hide-right-to-left {
|
|
977
|
-
from {
|
|
978
|
-
transform: translateX(0%);
|
|
979
|
-
}
|
|
980
|
-
to {
|
|
981
|
-
transform: translateX(110%);
|
|
982
|
-
}
|
|
983
|
-
}
|
|
984
|
-
@keyframes show-left-to-right {
|
|
985
|
-
from {
|
|
986
|
-
transform: translateX(-110%);
|
|
987
|
-
}
|
|
988
|
-
to {
|
|
989
|
-
transform: translateX(0%);
|
|
990
|
-
}
|
|
991
|
-
}
|
|
992
|
-
@keyframes hide-left-to-right {
|
|
993
|
-
from {
|
|
994
|
-
transform: translateX(0%);
|
|
995
|
-
}
|
|
996
|
-
to {
|
|
997
|
-
transform: translateX(-110%);
|
|
998
|
-
}
|
|
999
|
-
}
|
|
1000
|
-
@keyframes show-bottom-to-top {
|
|
1001
|
-
from {
|
|
1002
|
-
transform: translateY(110%);
|
|
1003
|
-
}
|
|
1004
|
-
to {
|
|
1005
|
-
transform: translateY(0%);
|
|
1006
|
-
}
|
|
1007
|
-
}
|
|
1008
|
-
@keyframes hide-bottom-to-top {
|
|
1009
|
-
from {
|
|
1010
|
-
transform: translateY(0%);
|
|
1011
|
-
}
|
|
1012
|
-
to {
|
|
1013
|
-
transform: translateY(110%);
|
|
1014
|
-
}
|
|
1015
|
-
}
|
|
1016
|
-
@keyframes show-top-to-bottom {
|
|
1017
|
-
from {
|
|
1018
|
-
transform: translateY(-110%);
|
|
1019
|
-
}
|
|
1020
|
-
to {
|
|
1021
|
-
transform: translateY(0%);
|
|
1022
|
-
}
|
|
1023
|
-
}
|
|
1024
|
-
@keyframes hide-top-to-bottom {
|
|
1025
|
-
from {
|
|
1026
|
-
transform: translateY(0%);
|
|
1027
|
-
}
|
|
1028
|
-
to {
|
|
1029
|
-
transform: translateY(-110%);
|
|
1030
|
-
}
|
|
1031
|
-
}
|
|
1032
968
|
@keyframes popover-animation {
|
|
1033
969
|
0% {
|
|
1034
970
|
opacity: 0;
|
|
@@ -43,70 +43,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
43
43
|
|
|
44
44
|
@layer variables {}
|
|
45
45
|
|
|
46
|
-
@keyframes show-right-to-left {
|
|
47
|
-
from {
|
|
48
|
-
transform: translateX(110%);
|
|
49
|
-
}
|
|
50
|
-
to {
|
|
51
|
-
transform: translateX(0%);
|
|
52
|
-
}
|
|
53
|
-
}
|
|
54
|
-
@keyframes hide-right-to-left {
|
|
55
|
-
from {
|
|
56
|
-
transform: translateX(0%);
|
|
57
|
-
}
|
|
58
|
-
to {
|
|
59
|
-
transform: translateX(110%);
|
|
60
|
-
}
|
|
61
|
-
}
|
|
62
|
-
@keyframes show-left-to-right {
|
|
63
|
-
from {
|
|
64
|
-
transform: translateX(-110%);
|
|
65
|
-
}
|
|
66
|
-
to {
|
|
67
|
-
transform: translateX(0%);
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
@keyframes hide-left-to-right {
|
|
71
|
-
from {
|
|
72
|
-
transform: translateX(0%);
|
|
73
|
-
}
|
|
74
|
-
to {
|
|
75
|
-
transform: translateX(-110%);
|
|
76
|
-
}
|
|
77
|
-
}
|
|
78
|
-
@keyframes show-bottom-to-top {
|
|
79
|
-
from {
|
|
80
|
-
transform: translateY(110%);
|
|
81
|
-
}
|
|
82
|
-
to {
|
|
83
|
-
transform: translateY(0%);
|
|
84
|
-
}
|
|
85
|
-
}
|
|
86
|
-
@keyframes hide-bottom-to-top {
|
|
87
|
-
from {
|
|
88
|
-
transform: translateY(0%);
|
|
89
|
-
}
|
|
90
|
-
to {
|
|
91
|
-
transform: translateY(110%);
|
|
92
|
-
}
|
|
93
|
-
}
|
|
94
|
-
@keyframes show-top-to-bottom {
|
|
95
|
-
from {
|
|
96
|
-
transform: translateY(-110%);
|
|
97
|
-
}
|
|
98
|
-
to {
|
|
99
|
-
transform: translateY(0%);
|
|
100
|
-
}
|
|
101
|
-
}
|
|
102
|
-
@keyframes hide-top-to-bottom {
|
|
103
|
-
from {
|
|
104
|
-
transform: translateY(0%);
|
|
105
|
-
}
|
|
106
|
-
to {
|
|
107
|
-
transform: translateY(-110%);
|
|
108
|
-
}
|
|
109
|
-
}
|
|
110
46
|
@keyframes popover-animation {
|
|
111
47
|
0% {
|
|
112
48
|
opacity: 0;
|
|
@@ -66,70 +66,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
66
66
|
transition: outline var(--db-transition-duration-extra-fast), border-color var(--db-transition-straight-emotional), background-color var(--db-transition-straight-emotional);
|
|
67
67
|
}
|
|
68
68
|
|
|
69
|
-
@keyframes show-right-to-left {
|
|
70
|
-
from {
|
|
71
|
-
transform: translateX(110%);
|
|
72
|
-
}
|
|
73
|
-
to {
|
|
74
|
-
transform: translateX(0%);
|
|
75
|
-
}
|
|
76
|
-
}
|
|
77
|
-
@keyframes hide-right-to-left {
|
|
78
|
-
from {
|
|
79
|
-
transform: translateX(0%);
|
|
80
|
-
}
|
|
81
|
-
to {
|
|
82
|
-
transform: translateX(110%);
|
|
83
|
-
}
|
|
84
|
-
}
|
|
85
|
-
@keyframes show-left-to-right {
|
|
86
|
-
from {
|
|
87
|
-
transform: translateX(-110%);
|
|
88
|
-
}
|
|
89
|
-
to {
|
|
90
|
-
transform: translateX(0%);
|
|
91
|
-
}
|
|
92
|
-
}
|
|
93
|
-
@keyframes hide-left-to-right {
|
|
94
|
-
from {
|
|
95
|
-
transform: translateX(0%);
|
|
96
|
-
}
|
|
97
|
-
to {
|
|
98
|
-
transform: translateX(-110%);
|
|
99
|
-
}
|
|
100
|
-
}
|
|
101
|
-
@keyframes show-bottom-to-top {
|
|
102
|
-
from {
|
|
103
|
-
transform: translateY(110%);
|
|
104
|
-
}
|
|
105
|
-
to {
|
|
106
|
-
transform: translateY(0%);
|
|
107
|
-
}
|
|
108
|
-
}
|
|
109
|
-
@keyframes hide-bottom-to-top {
|
|
110
|
-
from {
|
|
111
|
-
transform: translateY(0%);
|
|
112
|
-
}
|
|
113
|
-
to {
|
|
114
|
-
transform: translateY(110%);
|
|
115
|
-
}
|
|
116
|
-
}
|
|
117
|
-
@keyframes show-top-to-bottom {
|
|
118
|
-
from {
|
|
119
|
-
transform: translateY(-110%);
|
|
120
|
-
}
|
|
121
|
-
to {
|
|
122
|
-
transform: translateY(0%);
|
|
123
|
-
}
|
|
124
|
-
}
|
|
125
|
-
@keyframes hide-top-to-bottom {
|
|
126
|
-
from {
|
|
127
|
-
transform: translateY(0%);
|
|
128
|
-
}
|
|
129
|
-
to {
|
|
130
|
-
transform: translateY(-110%);
|
|
131
|
-
}
|
|
132
|
-
}
|
|
133
69
|
@keyframes popover-animation {
|
|
134
70
|
0% {
|
|
135
71
|
opacity: 0;
|
|
@@ -12,70 +12,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
12
12
|
transition: outline var(--db-transition-duration-extra-fast), border-color var(--db-transition-straight-emotional), background-color var(--db-transition-straight-emotional);
|
|
13
13
|
}
|
|
14
14
|
|
|
15
|
-
@keyframes show-right-to-left {
|
|
16
|
-
from {
|
|
17
|
-
transform: translateX(110%);
|
|
18
|
-
}
|
|
19
|
-
to {
|
|
20
|
-
transform: translateX(0%);
|
|
21
|
-
}
|
|
22
|
-
}
|
|
23
|
-
@keyframes hide-right-to-left {
|
|
24
|
-
from {
|
|
25
|
-
transform: translateX(0%);
|
|
26
|
-
}
|
|
27
|
-
to {
|
|
28
|
-
transform: translateX(110%);
|
|
29
|
-
}
|
|
30
|
-
}
|
|
31
|
-
@keyframes show-left-to-right {
|
|
32
|
-
from {
|
|
33
|
-
transform: translateX(-110%);
|
|
34
|
-
}
|
|
35
|
-
to {
|
|
36
|
-
transform: translateX(0%);
|
|
37
|
-
}
|
|
38
|
-
}
|
|
39
|
-
@keyframes hide-left-to-right {
|
|
40
|
-
from {
|
|
41
|
-
transform: translateX(0%);
|
|
42
|
-
}
|
|
43
|
-
to {
|
|
44
|
-
transform: translateX(-110%);
|
|
45
|
-
}
|
|
46
|
-
}
|
|
47
|
-
@keyframes show-bottom-to-top {
|
|
48
|
-
from {
|
|
49
|
-
transform: translateY(110%);
|
|
50
|
-
}
|
|
51
|
-
to {
|
|
52
|
-
transform: translateY(0%);
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
|
-
@keyframes hide-bottom-to-top {
|
|
56
|
-
from {
|
|
57
|
-
transform: translateY(0%);
|
|
58
|
-
}
|
|
59
|
-
to {
|
|
60
|
-
transform: translateY(110%);
|
|
61
|
-
}
|
|
62
|
-
}
|
|
63
|
-
@keyframes show-top-to-bottom {
|
|
64
|
-
from {
|
|
65
|
-
transform: translateY(-110%);
|
|
66
|
-
}
|
|
67
|
-
to {
|
|
68
|
-
transform: translateY(0%);
|
|
69
|
-
}
|
|
70
|
-
}
|
|
71
|
-
@keyframes hide-top-to-bottom {
|
|
72
|
-
from {
|
|
73
|
-
transform: translateY(0%);
|
|
74
|
-
}
|
|
75
|
-
to {
|
|
76
|
-
transform: translateY(-110%);
|
|
77
|
-
}
|
|
78
|
-
}
|
|
79
15
|
@keyframes popover-animation {
|
|
80
16
|
0% {
|
|
81
17
|
opacity: 0;
|
|
@@ -201,70 +201,6 @@ input[type=radio]:checked) > label {
|
|
|
201
201
|
transition: outline var(--db-transition-duration-extra-fast), border-color var(--db-transition-straight-emotional), background-color var(--db-transition-straight-emotional);
|
|
202
202
|
}
|
|
203
203
|
|
|
204
|
-
@keyframes show-right-to-left {
|
|
205
|
-
from {
|
|
206
|
-
transform: translateX(110%);
|
|
207
|
-
}
|
|
208
|
-
to {
|
|
209
|
-
transform: translateX(0%);
|
|
210
|
-
}
|
|
211
|
-
}
|
|
212
|
-
@keyframes hide-right-to-left {
|
|
213
|
-
from {
|
|
214
|
-
transform: translateX(0%);
|
|
215
|
-
}
|
|
216
|
-
to {
|
|
217
|
-
transform: translateX(110%);
|
|
218
|
-
}
|
|
219
|
-
}
|
|
220
|
-
@keyframes show-left-to-right {
|
|
221
|
-
from {
|
|
222
|
-
transform: translateX(-110%);
|
|
223
|
-
}
|
|
224
|
-
to {
|
|
225
|
-
transform: translateX(0%);
|
|
226
|
-
}
|
|
227
|
-
}
|
|
228
|
-
@keyframes hide-left-to-right {
|
|
229
|
-
from {
|
|
230
|
-
transform: translateX(0%);
|
|
231
|
-
}
|
|
232
|
-
to {
|
|
233
|
-
transform: translateX(-110%);
|
|
234
|
-
}
|
|
235
|
-
}
|
|
236
|
-
@keyframes show-bottom-to-top {
|
|
237
|
-
from {
|
|
238
|
-
transform: translateY(110%);
|
|
239
|
-
}
|
|
240
|
-
to {
|
|
241
|
-
transform: translateY(0%);
|
|
242
|
-
}
|
|
243
|
-
}
|
|
244
|
-
@keyframes hide-bottom-to-top {
|
|
245
|
-
from {
|
|
246
|
-
transform: translateY(0%);
|
|
247
|
-
}
|
|
248
|
-
to {
|
|
249
|
-
transform: translateY(110%);
|
|
250
|
-
}
|
|
251
|
-
}
|
|
252
|
-
@keyframes show-top-to-bottom {
|
|
253
|
-
from {
|
|
254
|
-
transform: translateY(-110%);
|
|
255
|
-
}
|
|
256
|
-
to {
|
|
257
|
-
transform: translateY(0%);
|
|
258
|
-
}
|
|
259
|
-
}
|
|
260
|
-
@keyframes hide-top-to-bottom {
|
|
261
|
-
from {
|
|
262
|
-
transform: translateY(0%);
|
|
263
|
-
}
|
|
264
|
-
to {
|
|
265
|
-
transform: translateY(-110%);
|
|
266
|
-
}
|
|
267
|
-
}
|
|
268
204
|
@keyframes popover-animation {
|
|
269
205
|
0% {
|
|
270
206
|
opacity: 0;
|
|
@@ -115,70 +115,6 @@ paddings/gaps in an application e.g. the <main> should have a responsive padding
|
|
|
115
115
|
|
|
116
116
|
/* Use for body tags like <p> */
|
|
117
117
|
/* Use for headline tags like <h1> */
|
|
118
|
-
@keyframes show-right-to-left {
|
|
119
|
-
from {
|
|
120
|
-
transform: translateX(110%);
|
|
121
|
-
}
|
|
122
|
-
to {
|
|
123
|
-
transform: translateX(0%);
|
|
124
|
-
}
|
|
125
|
-
}
|
|
126
|
-
@keyframes hide-right-to-left {
|
|
127
|
-
from {
|
|
128
|
-
transform: translateX(0%);
|
|
129
|
-
}
|
|
130
|
-
to {
|
|
131
|
-
transform: translateX(110%);
|
|
132
|
-
}
|
|
133
|
-
}
|
|
134
|
-
@keyframes show-left-to-right {
|
|
135
|
-
from {
|
|
136
|
-
transform: translateX(-110%);
|
|
137
|
-
}
|
|
138
|
-
to {
|
|
139
|
-
transform: translateX(0%);
|
|
140
|
-
}
|
|
141
|
-
}
|
|
142
|
-
@keyframes hide-left-to-right {
|
|
143
|
-
from {
|
|
144
|
-
transform: translateX(0%);
|
|
145
|
-
}
|
|
146
|
-
to {
|
|
147
|
-
transform: translateX(-110%);
|
|
148
|
-
}
|
|
149
|
-
}
|
|
150
|
-
@keyframes show-bottom-to-top {
|
|
151
|
-
from {
|
|
152
|
-
transform: translateY(110%);
|
|
153
|
-
}
|
|
154
|
-
to {
|
|
155
|
-
transform: translateY(0%);
|
|
156
|
-
}
|
|
157
|
-
}
|
|
158
|
-
@keyframes hide-bottom-to-top {
|
|
159
|
-
from {
|
|
160
|
-
transform: translateY(0%);
|
|
161
|
-
}
|
|
162
|
-
to {
|
|
163
|
-
transform: translateY(110%);
|
|
164
|
-
}
|
|
165
|
-
}
|
|
166
|
-
@keyframes show-top-to-bottom {
|
|
167
|
-
from {
|
|
168
|
-
transform: translateY(-110%);
|
|
169
|
-
}
|
|
170
|
-
to {
|
|
171
|
-
transform: translateY(0%);
|
|
172
|
-
}
|
|
173
|
-
}
|
|
174
|
-
@keyframes hide-top-to-bottom {
|
|
175
|
-
from {
|
|
176
|
-
transform: translateY(0%);
|
|
177
|
-
}
|
|
178
|
-
to {
|
|
179
|
-
transform: translateY(-110%);
|
|
180
|
-
}
|
|
181
|
-
}
|
|
182
118
|
@keyframes popover-animation {
|
|
183
119
|
0% {
|
|
184
120
|
opacity: 0;
|