@asd20/ui 3.2.732 → 3.2.734

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.
Files changed (8) hide show
  1. package/package.json +1 -1
  2. package/src/components/atoms/Asd20Breadcrumb/index.vue +81 -53
  3. package/src/components/molecules/Asd20DepartmentContactCard/index.vue +1 -0
  4. package/src/components/molecules/Asd20Picker/index.vue +1 -1
  5. package/src/components/organisms/Asd20PageFooter/index.vue +51 -24
  6. package/src/components/organisms/Asd20PageHeader/index.vue +5 -4
  7. package/src/data/departments.json +1 -1
  8. package/src/data/page-queries/sublanding-page-query-result.json +2 -1
package/package.json CHANGED
@@ -5,7 +5,7 @@
5
5
  "*.scss",
6
6
  "*.vue"
7
7
  ],
8
- "version": "3.2.732",
8
+ "version": "3.2.734",
9
9
  "private": false,
10
10
  "license": "MIT",
11
11
  "repository": {
package/src/components/atoms/Asd20Breadcrumb/index.vue 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
- a {
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
- padding-right: space(0.25);
44
- opacity: 0.875;
45
-
46
- .asd20-breadcrumb__label {
47
- // box-shadow: 0 2px 0 0 var(--website-page__link-color);
48
- border-bottom: 2px solid var(--webstie-page__link-color);
49
- white-space: nowrap;
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
- &:hover {
53
- opacity: 1;
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
- &::before {
57
- content: '';
58
- display: block;
59
- width: space(0.25);
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
- &:first-child::before {
71
- content: '';
72
- display: none;
73
- fill: white;
74
- color: white;
75
- background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgaGVpZ2h0PSIzMiIgaWQ9ImhvbWUiIHZpZXdCb3g9IjAgMCAzMiAzMiIgd2lkdGg9IjMyIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxwYXRoIGZpbGw9IiNmZmYiIGQ9Ik0xNiAwIEwzMiAxNiBMMjggMTYgTDI4IDMwIEwyMCAzMCBMMjAgMjAgTDEyIDIwIEwxMiAzMCBMNCAzMCBMNCAxNiBMMCAxNiBaIi8+PC9zdmc+)
76
- no-repeat;
77
- background-size: 100% 100%;
78
- width: space(0.625);
79
- height: space(0.625);
80
- margin-top: space(-0.2);
81
- margin-right: space(0.25);
82
- transform: inherit;
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
- &:last-child::after {
87
- content: '';
88
- display: block;
89
- width: space(0.25);
90
- height: space(0.25);
91
- border: 1px solid transparent;
92
- border-right-color: currentColor;
93
- border-bottom-color: currentColor;
94
- margin-top: space(0);
95
- margin-left: space(0.25);
96
- transform: rotate(-45deg);
97
- opacity: 0.75;
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>
package/src/components/molecules/Asd20DepartmentContactCard/index.vue CHANGED
@@ -78,6 +78,7 @@ export default {
78
78
  if (this.group.contactPhone) {
79
79
  items.push({
80
80
  ...baseItemProps,
81
+ actionable: true,
81
82
  icon: 'phone-alt',
82
83
  label: 'Phone',
83
84
  description: `<a href='tel:${this.group.contactPhone}'>${this.group.contactPhone}</a>`,
package/src/components/molecules/Asd20Picker/index.vue CHANGED
@@ -257,7 +257,7 @@ export default {
257
257
  .asd20-button {
258
258
  position: relative;
259
259
  margin-left: space(0.5);
260
- padding: space(0.5) space(0.25);
260
+ padding: space(0.5) space(0.5);
261
261
  &::before {
262
262
  content: '';
263
263
  position: absolute;
package/src/components/organisms/Asd20PageFooter/index.vue CHANGED
@@ -109,14 +109,18 @@
109
109
  </div>
110
110
 
111
111
  <asd20-social-menu :socialLinks="socialLinks" />
112
-
113
112
  <div class="disclosure-links">
114
- <a
113
+ <asd20-button
115
114
  v-for="(item, index) in disclosureLinks"
116
115
  :key="index"
117
116
  :href="item.url"
118
- >{{ item.title }}</a
117
+ horizontal
118
+ transparent
119
+ expanded
120
+ reversed
119
121
  >
122
+ {{ item.title }}
123
+ </asd20-button>
120
124
  </div>
121
125
 
122
126
  <div class="copyright">
@@ -292,18 +296,23 @@ export default {
292
296
  .disclosure-links {
293
297
  display: flex;
294
298
  flex-wrap: wrap;
295
- // justify-content: space-evenly;
299
+ // justify-content: flex-start;
296
300
  margin: 0 0 space(1) 0;
297
301
  font-size: 0.75rem;
298
302
  line-height: 1.25;
299
303
  flex-direction: column;
300
- a {
301
- // display: block;
302
- // padding: space(0.25) space(0.25);
303
- color: var(--website-footer__title-color);
304
+ // a {
305
+ // // display: block;
306
+ // // padding: space(0.25) space(0.25);
307
+ // color: var(--website-footer__title-color);
308
+ // flex-grow: 0;
309
+ // padding: 0;
310
+ // // margin: 0 space(0.5) space(0.5) 0;
311
+ // min-height: 45px;
312
+ // }
313
+ .asd20-button {
314
+ font-size: 0.85rem;
304
315
  flex-grow: 0;
305
- padding: 0;
306
- margin: 0 space(0.5) space(0.5) 0;
307
316
  }
308
317
  }
309
318
  .copyright {
@@ -311,17 +320,19 @@ export default {
311
320
  line-height: 1.5;
312
321
  max-width: 75vw;
313
322
  color: var(--website-footer__title-color);
323
+ margin-left: space(0.5);
324
+ // text-align: left;
314
325
  }
315
326
  }
316
327
 
317
- @media (min-width: 1024px) {
328
+ @media (min-width: 768px) {
318
329
  #page-footer {
319
330
  grid-column: 1 / -1;
320
331
  margin: space(0) space(0) space(0) space(0);
321
332
  padding: 0;
322
333
  display: grid;
323
334
  grid-template-columns: space(3) 1fr 1fr space(3) 2fr space(3);
324
- grid-template-rows: space(3) repeat(3, min-content) space(3);
335
+ grid-template-rows: space(3) repeat(3, min-content) space(4) space(1) space(1);
325
336
  &::v-deep .asd20-logo {
326
337
  position: relative;
327
338
  grid-column: 2 / 4;
@@ -380,31 +391,47 @@ export default {
380
391
  }
381
392
  }
382
393
  .disclosure-links {
383
- grid-column: -4 / -2;
384
- grid-row: -2 / -3;
394
+ grid-column: 2 / 6;
395
+ grid-row: 5 / 6;
385
396
  display: flex;
386
397
  flex-direction: row;
387
398
  flex-wrap: nowrap;
388
399
  flex: inherit;
389
400
  align-self: end;
390
- margin: space(-0.25) space(-0.5) space(-0.25) space(-0.5);
401
+ margin: 0;
391
402
  font-size: 0.75rem;
392
- line-height: 1.25;
393
- justify-content: flex-end;
394
- a {
395
- padding: space(0.25) space(0.5);
396
- margin: 0;
397
- }
403
+ line-height: 1.5;
404
+ justify-content: flex-start;
405
+ text-align: center;
406
+ // a {
407
+ // padding: space(0.5);
408
+ // margin: 0;
409
+ // min-height: inherit;
410
+ // }
398
411
  }
399
412
  .copyright {
400
- grid-column: 2 / 4;
401
- grid-row: -2 / -3;
413
+ grid-column: 2 / 6;
414
+ grid-row: 6 / 7;
402
415
  align-self: end;
403
416
  font-size: 0.75rem;
404
417
  line-height: 1.5;
405
418
  max-width: 75vw;
406
419
  margin-top: space(3);
407
- padding-left: space(0.5);
420
+ margin-left: space(0.5);
421
+ text-align: left;
422
+ // padding-left: space(0.5);
423
+ }
424
+ }
425
+ }
426
+
427
+ @media (min-width: 1024px) {
428
+ #page-footer {
429
+ .disclosure-links {
430
+ justify-content: flex-end;
431
+ }
432
+ .copyright {
433
+ text-align: right;
434
+ grid-column: -2 / -3;
408
435
  }
409
436
  }
410
437
  }
package/src/components/organisms/Asd20PageHeader/index.vue CHANGED
@@ -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: 14px !important;
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
  }
package/src/data/departments.json CHANGED
@@ -831,7 +831,7 @@
831
831
  "eventFeedUrl": "",
832
832
  "alertFeedUrl": "",
833
833
  "officeContactDetails": {
834
- "phone": "",
834
+ "phone": "719-234-1783",
835
835
  "email": "",
836
836
  "website": "",
837
837
  "hours": "",
package/src/data/page-queries/sublanding-page-query-result.json CHANGED
@@ -1429,7 +1429,8 @@
1429
1429
  "title": "Communication",
1430
1430
  "id": "fa744764-9468-828f-c9ef-4a194f5058ee",
1431
1431
  "contactEmail": "socialmedia@asd20.org",
1432
- "description": "Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec ullamcorper nulla non metus auctor fringilla."
1432
+ "description": "Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec ullamcorper nulla non metus auctor fringilla.",
1433
+ "contactPhone": "719-234-1200"
1433
1434
  }
1434
1435
  }],
1435
1436
  "organizationOptions": [{