@asd20/ui 3.2.733 → 3.2.735
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 +1 -1
- package/src/components/atoms/Asd20Breadcrumb/index.vue +81 -53
- package/src/components/molecules/Asd20DepartmentContactCard/index.vue +1 -0
- package/src/components/organisms/Asd20PageFooter/index.vue +50 -23
- package/src/components/organisms/Asd20PageHeader/index.vue +5 -4
- package/src/components/organisms/Asd20SecondaryHeader/index.vue +1 -0
package/package.json
CHANGED
|
@@ -1,14 +1,34 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div :class="classes">
|
|
3
|
-
<a v-for="(link, index) in links" :href="link.url" :key="index">
|
|
3
|
+
<!-- <a v-for="(link, index) in links" :href="link.url" :key="index">
|
|
4
4
|
<span class="asd20-breadcrumb__label">{{ link.label }}</span>
|
|
5
|
-
</a>
|
|
5
|
+
</a> -->
|
|
6
|
+
<asd20-button
|
|
7
|
+
v-for="(link, index) in links"
|
|
8
|
+
:key="index"
|
|
9
|
+
class="back"
|
|
10
|
+
:link="link.url"
|
|
11
|
+
target="_self"
|
|
12
|
+
:label="link.label"
|
|
13
|
+
icon="chevron"
|
|
14
|
+
:iconAngle="-90"
|
|
15
|
+
size="md"
|
|
16
|
+
horizontal
|
|
17
|
+
transparent
|
|
18
|
+
centered
|
|
19
|
+
reversed
|
|
20
|
+
/>
|
|
6
21
|
</div>
|
|
7
22
|
</template>
|
|
8
23
|
|
|
9
24
|
<script>
|
|
25
|
+
import Asd20Button from '../../atoms/Asd20Button'
|
|
26
|
+
|
|
10
27
|
export default {
|
|
11
28
|
name: 'Asd20Breadcrumb',
|
|
29
|
+
components: {
|
|
30
|
+
Asd20Button,
|
|
31
|
+
},
|
|
12
32
|
props: {
|
|
13
33
|
links: { type: Array, default: () => [] },
|
|
14
34
|
},
|
|
@@ -33,69 +53,77 @@ export default {
|
|
|
33
53
|
justify-content: flex-start;
|
|
34
54
|
color: currentColor;
|
|
35
55
|
|
|
36
|
-
|
|
56
|
+
.asd20-button {
|
|
37
57
|
display: flex;
|
|
38
58
|
flex-direction: row;
|
|
39
59
|
align-items: center;
|
|
40
60
|
justify-content: flex-start;
|
|
41
61
|
text-decoration: none;
|
|
42
62
|
color: currentColor;
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
}
|
|
63
|
+
white-space: nowrap;
|
|
64
|
+
min-height: 45px;
|
|
65
|
+
padding: 0 space(0.25) 0 0;
|
|
66
|
+
font-size: 0.85rem !important;
|
|
67
|
+
// padding-right: space(0.5);
|
|
68
|
+
// opacity: 0.875;
|
|
69
|
+
// min-height: 45px;
|
|
51
70
|
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
71
|
+
// .asd20-breadcrumb__label {
|
|
72
|
+
// // box-shadow: 0 2px 0 0 var(--website-page__link-color);
|
|
73
|
+
// border-bottom: 2px solid var(--webstie-page__link-color);
|
|
74
|
+
// white-space: nowrap;
|
|
75
|
+
// }
|
|
55
76
|
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
height: space(0.25);
|
|
61
|
-
border: 1px solid transparent;
|
|
62
|
-
border-right-color: currentColor;
|
|
63
|
-
border-bottom-color: currentColor;
|
|
64
|
-
margin-top: space(0);
|
|
77
|
+
// &:hover {
|
|
78
|
+
// opacity: 1;
|
|
79
|
+
// }
|
|
80
|
+
&:last-child {
|
|
65
81
|
margin-right: space(0.5);
|
|
66
|
-
transform: rotate(-45deg);
|
|
67
|
-
opacity: 0.75;
|
|
68
82
|
}
|
|
69
83
|
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
border: none;
|
|
84
|
-
}
|
|
84
|
+
// ::before {
|
|
85
|
+
// content: '';
|
|
86
|
+
// display: inline-block;
|
|
87
|
+
// width: space(0.25);
|
|
88
|
+
// height: space(0.25);
|
|
89
|
+
// border: 1px solid transparent;
|
|
90
|
+
// border-right-color: currentColor;
|
|
91
|
+
// border-bottom-color: currentColor;
|
|
92
|
+
// margin-top: space(0);
|
|
93
|
+
// margin-right: space(0.25);
|
|
94
|
+
// transform: rotate(135deg);
|
|
95
|
+
// opacity: 0.75;
|
|
96
|
+
// }
|
|
85
97
|
|
|
86
|
-
&:
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
98
|
+
// &:first-child::before {
|
|
99
|
+
// content: '';
|
|
100
|
+
// display: none;
|
|
101
|
+
// fill: white;
|
|
102
|
+
// color: white;
|
|
103
|
+
// background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgaGVpZ2h0PSIzMiIgaWQ9ImhvbWUiIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGZpbGw9IiNmZmYiIGQ9Ik0xNiAwIEwzMiAxNiBMMjggMTYgTDI4IDMwIEwyMCAzMCBMMjAgMjAgTDEyIDIwIEwxMiAzMCBMNCAzMCBMNCAxNiBMMCAxNiBaIi8+PC9zdmc+)
|
|
104
|
+
// no-repeat;
|
|
105
|
+
// background-size: 100% 100%;
|
|
106
|
+
// width: space(0.625);
|
|
107
|
+
// height: space(0.625);
|
|
108
|
+
// margin-top: space(-0.2);
|
|
109
|
+
// margin-right: space(0.25);
|
|
110
|
+
// transform: inherit;
|
|
111
|
+
// border: none;
|
|
112
|
+
// }
|
|
113
|
+
|
|
114
|
+
// &:last-child::after {
|
|
115
|
+
// content: '';
|
|
116
|
+
// display: block;
|
|
117
|
+
// width: space(0.25);
|
|
118
|
+
// height: space(0.25);
|
|
119
|
+
// border: 1px solid transparent;
|
|
120
|
+
// border-right-color: currentColor;
|
|
121
|
+
// border-bottom-color: currentColor;
|
|
122
|
+
// margin-top: space(0);
|
|
123
|
+
// margin-left: space(0.25);
|
|
124
|
+
// transform: rotate(-45deg);
|
|
125
|
+
// opacity: 0.75;
|
|
126
|
+
// }
|
|
99
127
|
}
|
|
100
128
|
}
|
|
101
129
|
</style>
|
|
@@ -111,12 +111,17 @@
|
|
|
111
111
|
<asd20-social-menu :socialLinks="socialLinks" />
|
|
112
112
|
|
|
113
113
|
<div class="disclosure-links">
|
|
114
|
-
<
|
|
114
|
+
<asd20-button
|
|
115
115
|
v-for="(item, index) in disclosureLinks"
|
|
116
|
+
:link="item.url"
|
|
116
117
|
:key="index"
|
|
117
|
-
|
|
118
|
-
|
|
118
|
+
horizontal
|
|
119
|
+
transparent
|
|
120
|
+
expanded
|
|
121
|
+
reversed
|
|
119
122
|
>
|
|
123
|
+
{{ item.title }}
|
|
124
|
+
</asd20-button>
|
|
120
125
|
</div>
|
|
121
126
|
|
|
122
127
|
<div class="copyright">
|
|
@@ -292,18 +297,23 @@ export default {
|
|
|
292
297
|
.disclosure-links {
|
|
293
298
|
display: flex;
|
|
294
299
|
flex-wrap: wrap;
|
|
295
|
-
// justify-content:
|
|
300
|
+
// justify-content: flex-start;
|
|
296
301
|
margin: 0 0 space(1) 0;
|
|
297
302
|
font-size: 0.75rem;
|
|
298
303
|
line-height: 1.25;
|
|
299
304
|
flex-direction: column;
|
|
300
|
-
a {
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
305
|
+
// a {
|
|
306
|
+
// // display: block;
|
|
307
|
+
// // padding: space(0.25) space(0.25);
|
|
308
|
+
// color: var(--website-footer__title-color);
|
|
309
|
+
// flex-grow: 0;
|
|
310
|
+
// padding: 0;
|
|
311
|
+
// // margin: 0 space(0.5) space(0.5) 0;
|
|
312
|
+
// min-height: 45px;
|
|
313
|
+
// }
|
|
314
|
+
.asd20-button {
|
|
315
|
+
font-size: 0.85rem;
|
|
304
316
|
flex-grow: 0;
|
|
305
|
-
padding: 0;
|
|
306
|
-
margin: 0 space(0.5) space(0.5) 0;
|
|
307
317
|
}
|
|
308
318
|
}
|
|
309
319
|
.copyright {
|
|
@@ -311,17 +321,19 @@ export default {
|
|
|
311
321
|
line-height: 1.5;
|
|
312
322
|
max-width: 75vw;
|
|
313
323
|
color: var(--website-footer__title-color);
|
|
324
|
+
margin-left: space(0.5);
|
|
325
|
+
// text-align: left;
|
|
314
326
|
}
|
|
315
327
|
}
|
|
316
328
|
|
|
317
|
-
@media (min-width:
|
|
329
|
+
@media (min-width: 768px) {
|
|
318
330
|
#page-footer {
|
|
319
331
|
grid-column: 1 / -1;
|
|
320
332
|
margin: space(0) space(0) space(0) space(0);
|
|
321
333
|
padding: 0;
|
|
322
334
|
display: grid;
|
|
323
335
|
grid-template-columns: space(3) 1fr 1fr space(3) 2fr space(3);
|
|
324
|
-
grid-template-rows: space(3) repeat(3, min-content) space(
|
|
336
|
+
grid-template-rows: space(3) repeat(3, min-content) space(4) space(1) space(1);
|
|
325
337
|
&::v-deep .asd20-logo {
|
|
326
338
|
position: relative;
|
|
327
339
|
grid-column: 2 / 4;
|
|
@@ -380,32 +392,47 @@ export default {
|
|
|
380
392
|
}
|
|
381
393
|
}
|
|
382
394
|
.disclosure-links {
|
|
383
|
-
grid-column:
|
|
384
|
-
grid-row:
|
|
395
|
+
grid-column: 2 / 6;
|
|
396
|
+
grid-row: 5 / 6;
|
|
385
397
|
display: flex;
|
|
386
398
|
flex-direction: row;
|
|
387
399
|
flex-wrap: nowrap;
|
|
388
400
|
flex: inherit;
|
|
389
401
|
align-self: end;
|
|
390
|
-
margin:
|
|
402
|
+
margin: 0;
|
|
391
403
|
font-size: 0.75rem;
|
|
392
404
|
line-height: 1.5;
|
|
393
|
-
justify-content: flex-
|
|
405
|
+
justify-content: flex-start;
|
|
394
406
|
text-align: center;
|
|
395
|
-
a {
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
407
|
+
// a {
|
|
408
|
+
// padding: space(0.5);
|
|
409
|
+
// margin: 0;
|
|
410
|
+
// min-height: inherit;
|
|
411
|
+
// }
|
|
399
412
|
}
|
|
400
413
|
.copyright {
|
|
401
|
-
grid-column: 2 /
|
|
402
|
-
grid-row:
|
|
414
|
+
grid-column: 2 / 6;
|
|
415
|
+
grid-row: 6 / 7;
|
|
403
416
|
align-self: end;
|
|
404
417
|
font-size: 0.75rem;
|
|
405
418
|
line-height: 1.5;
|
|
406
419
|
max-width: 75vw;
|
|
407
420
|
margin-top: space(3);
|
|
408
|
-
|
|
421
|
+
margin-left: space(0.5);
|
|
422
|
+
text-align: left;
|
|
423
|
+
// padding-left: space(0.5);
|
|
424
|
+
}
|
|
425
|
+
}
|
|
426
|
+
}
|
|
427
|
+
|
|
428
|
+
@media (min-width: 1024px) {
|
|
429
|
+
#page-footer {
|
|
430
|
+
.disclosure-links {
|
|
431
|
+
justify-content: flex-end;
|
|
432
|
+
}
|
|
433
|
+
.copyright {
|
|
434
|
+
text-align: right;
|
|
435
|
+
grid-column: -2 / -3;
|
|
409
436
|
}
|
|
410
437
|
}
|
|
411
438
|
}
|
|
@@ -281,10 +281,11 @@ export default {
|
|
|
281
281
|
.back {
|
|
282
282
|
padding: 0;
|
|
283
283
|
margin-top: space(1);
|
|
284
|
-
font-family: var(--website-typography__font-family-body);
|
|
285
|
-
line-height: 1.2;
|
|
286
|
-
font-size:
|
|
287
|
-
font-weight: normal;
|
|
284
|
+
// font-family: var(--website-typography__font-family-body);
|
|
285
|
+
// line-height: 1.2;
|
|
286
|
+
font-size: 0.85rem;
|
|
287
|
+
// font-weight: normal;
|
|
288
|
+
min-height: 45px;
|
|
288
289
|
&::v-deep span {
|
|
289
290
|
padding-right: space(0.5);
|
|
290
291
|
}
|