@asd20/ui 3.2.721 → 3.2.722
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/package.json
CHANGED
|
@@ -15,10 +15,10 @@
|
|
|
15
15
|
<span v-if="description" v-html="description"> </span>
|
|
16
16
|
<a
|
|
17
17
|
v-if="detailLinkUrl"
|
|
18
|
-
:tabindex="focusDisabled ? '-1' : undefined"
|
|
18
|
+
:tabindex="focusDisabled ? '-1' : undefined"
|
|
19
19
|
:href="detailLinkUrl"
|
|
20
20
|
>
|
|
21
|
-
|
|
21
|
+
{{ detailLinkLabel || detailLinkUrl }}
|
|
22
22
|
</a>
|
|
23
23
|
</div>
|
|
24
24
|
|
|
@@ -78,10 +78,14 @@ export default {
|
|
|
78
78
|
classes() {
|
|
79
79
|
let classes = {
|
|
80
80
|
'asd20-notification': true,
|
|
81
|
-
'asd20-notification--banner':
|
|
82
|
-
|
|
83
|
-
'asd20-notification--
|
|
84
|
-
|
|
81
|
+
'asd20-notification--banner':
|
|
82
|
+
this.notificationStyle.toLowerCase() === 'banner',
|
|
83
|
+
'asd20-notification--floating':
|
|
84
|
+
this.notificationStyle.toLowerCase() === 'floating',
|
|
85
|
+
'asd20-notification--inline':
|
|
86
|
+
this.notificationStyle.toLowerCase() === 'inline',
|
|
87
|
+
'asd20-notification--status':
|
|
88
|
+
this.notificationStyle.toLowerCase() === 'status',
|
|
85
89
|
'asd20-notification--dismissible': this.dismissible,
|
|
86
90
|
}
|
|
87
91
|
|
|
@@ -173,7 +177,6 @@ export default {
|
|
|
173
177
|
.asd20-notification__cta {
|
|
174
178
|
color: #da2e0b;
|
|
175
179
|
border-color: #da2e0b;
|
|
176
|
-
|
|
177
180
|
}
|
|
178
181
|
.asd20-icon {
|
|
179
182
|
--line-color: #da2e0b;
|
|
@@ -222,6 +225,10 @@ export default {
|
|
|
222
225
|
|
|
223
226
|
&.asd20-notification--floating {
|
|
224
227
|
box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.125);
|
|
228
|
+
.asd20-icon {
|
|
229
|
+
--line-color: #23464e;
|
|
230
|
+
--fill-color: #70b4c2;
|
|
231
|
+
}
|
|
225
232
|
.asd20-notification__content {
|
|
226
233
|
padding: 0;
|
|
227
234
|
}
|
|
@@ -259,10 +266,9 @@ export default {
|
|
|
259
266
|
.asd20-icon {
|
|
260
267
|
height: 24px;
|
|
261
268
|
width: 24px;
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
opacity: 0.25;
|
|
269
|
+
.asd20-icon {
|
|
270
|
+
--line-color: #23464e;
|
|
271
|
+
--fill-color: #70b4c2;
|
|
266
272
|
}
|
|
267
273
|
}
|
|
268
274
|
.asd20-notification__title {
|
|
@@ -291,6 +297,10 @@ export default {
|
|
|
291
297
|
|
|
292
298
|
&.asd20-notification--inline {
|
|
293
299
|
box-shadow: 0 0 0 5px #70b4c2;
|
|
300
|
+
.asd20-icon {
|
|
301
|
+
--line-color: #23464e;
|
|
302
|
+
--fill-color: #70b4c2;
|
|
303
|
+
}
|
|
294
304
|
}
|
|
295
305
|
|
|
296
306
|
&.asd20-notification--banner {
|
|
@@ -406,7 +416,6 @@ export default {
|
|
|
406
416
|
}
|
|
407
417
|
}
|
|
408
418
|
|
|
409
|
-
|
|
410
419
|
@media (min-width: 1024px) {
|
|
411
420
|
.asd20-notification {
|
|
412
421
|
&__title {
|