@asd20/ui 3.2.464 → 3.2.465

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 (4) hide show
  1. package/package.json +1 -1
  2. package/src/components/templates/Asd20WayfindingAlternateTemplate/index.vue +47 -35
  3. package/src/components/templates/Asd20WayfindingImageTemplate/index.vue +46 -52
  4. package/src/components/templates/Asd20WayfindingTemplate/index.vue +36 -22
package/package.json CHANGED
@@ -5,7 +5,7 @@
5
5
  "*.scss",
6
6
  "*.vue"
7
7
  ],
8
- "version": "3.2.464",
8
+ "version": "3.2.465",
9
9
  "private": false,
10
10
  "license": "MIT",
11
11
  "repository": {
package/src/components/templates/Asd20WayfindingAlternateTemplate/index.vue CHANGED
@@ -53,41 +53,41 @@
53
53
  <!-- <asd20-breadcrumb slot="top" :links="breadcrumbLinks"></asd20-breadcrumb> -->
54
54
  </asd20-page-header>
55
55
 
56
+ <!-- Inline-Notifications -->
57
+ <template>
58
+ <client-only>
59
+ <asd20-notification-group
60
+ class="asd20-notification-group--inline"
61
+ :notifications="activeNotificationsByType.inline"
62
+ group-type="inline"
63
+ @dismiss="$emit('dismiss-notification', $event)"
64
+ @toggle-all="$emit('toggle-all')"
65
+ ></asd20-notification-group>
66
+ </client-only>
67
+ </template>
68
+
69
+ <!-- Feed Section -->
70
+ <template>
71
+ <asd20-feeds-section
72
+ :announcements="announcements"
73
+ :announcements-feed-props="announcementsFeedProps"
74
+ @announcements-in-view="$emit('announcements-in-view')"
75
+ :stories="stories"
76
+ :stories-feed-props="storiesFeedProps"
77
+ @stories-in-view="$emit('stories-in-view')"
78
+ :events="events"
79
+ :events-feed-props="eventsFeedProps"
80
+ @events-in-view="$emit('events-in-view')"
81
+ ></asd20-feeds-section>
82
+ </template>
83
+
56
84
  <!-- Page Content -->
57
85
  <asd20-page-content
58
86
  class="intro-message"
59
87
  :primary-messages="primaryMessage"
60
88
  omit-detail-links
61
89
  omit-calls-to-action
62
- >
63
- <!-- Inline-Notifications -->
64
- <template slot="before">
65
- <client-only>
66
- <asd20-notification-group
67
- :notifications="activeNotificationsByType.inline"
68
- group-type="inline"
69
- @dismiss="$emit('dismiss-notification', $event)"
70
- @toggle-all="$emit('toggle-all')"
71
- ></asd20-notification-group>
72
- </client-only>
73
- </template>
74
- <!-- Feeds -->
75
- <template slot="before">
76
- <asd20-feeds-section
77
- :announcements="announcements"
78
- :announcements-feed-props="announcementsFeedProps"
79
- @announcements-in-view="$emit('announcements-in-view')"
80
- :stories="stories"
81
- :stories-feed-props="storiesFeedProps"
82
- @stories-in-view="$emit('stories-in-view')"
83
- :events="events"
84
- :events-feed-props="eventsFeedProps"
85
- @events-in-view="$emit('events-in-view')"
86
- ></asd20-feeds-section>
87
- </template>
88
-
89
- <slot></slot>
90
- </asd20-page-content>
90
+ />
91
91
  <asd20-page-content
92
92
  :primary-messages="wayFindingPrimaryMessages"
93
93
  :secondary-messages="secondaryMessages"
@@ -179,7 +179,12 @@ export default {
179
179
  },
180
180
  primaryMessage() {
181
181
  const introMessage = this.primaryMessages.slice(0, 1)
182
- if ((introMessage[0].bodyHtml === '' || null) || (introMessage[0].detailLink !== '' || null)) return
182
+ if (
183
+ introMessage[0].bodyHtml === '' ||
184
+ null ||
185
+ introMessage[0].detailLink !== '' || null
186
+ )
187
+ return
183
188
  return introMessage
184
189
  },
185
190
  },
@@ -221,6 +226,9 @@ export default {
221
226
  }
222
227
  }
223
228
  }
229
+ .asd20-notification-group--inline {
230
+ margin-top: space(2) !important;
231
+ }
224
232
  .asd20-feeds-section {
225
233
  margin-top: space(2);
226
234
  .asd20-swiper-feed:first-child {
@@ -239,11 +247,15 @@ export default {
239
247
  }
240
248
  }
241
249
  .intro-message {
242
- .asd20-messaging {
243
- border-left: 40px solid var(--color__tertiary);
244
- border-bottom: 20px solid var(--color__tertiary);
245
- padding-left: space(1);
246
- padding-bottom: space(1);
250
+ .primary-messaging-section {
251
+ padding-top: space(1) !important;
252
+ padding-bottom: space(1) !important;
253
+ .asd20-messaging {
254
+ border-left: space(1) solid var(--color__tertiary);
255
+ border-bottom: space(1) solid var(--color__tertiary);
256
+ padding-left: space(1);
257
+ padding-bottom: space(1);
258
+ }
247
259
  }
248
260
  p {
249
261
  // font-family: var(--website-typography__font-family-headlines);
package/src/components/templates/Asd20WayfindingImageTemplate/index.vue CHANGED
@@ -53,35 +53,35 @@
53
53
  <!-- <asd20-breadcrumb slot="top" :links="breadcrumbLinks"></asd20-breadcrumb> -->
54
54
  </asd20-image-header>
55
55
 
56
+ <!-- Inline-Notifications -->
57
+ <template>
58
+ <client-only>
59
+ <asd20-notification-group
60
+ class="asd20-notification-group--inline"
61
+ :notifications="activeNotificationsByType.inline"
62
+ group-type="inline"
63
+ @dismiss="$emit('dismiss-notification', $event)"
64
+ @toggle-all="$emit('toggle-all')"
65
+ ></asd20-notification-group>
66
+ </client-only>
67
+ </template>
68
+
69
+ <!-- Announcement Feed -->
70
+ <template>
71
+ <asd20-feeds-section
72
+ :announcements="announcements"
73
+ :announcements-feed-props="announcementsFeedProps"
74
+ @announcements-in-view="$emit('announcements-in-view')"
75
+ ></asd20-feeds-section>
76
+ </template>
77
+
56
78
  <!-- Page Content -->
57
79
  <asd20-page-content
58
80
  class="intro-message"
59
81
  :primary-messages="primaryMessage"
60
82
  omit-detail-links
61
83
  omit-calls-to-action
62
- >
63
- <!-- Inline-Notifications -->
64
- <template slot="before">
65
- <client-only>
66
- <asd20-notification-group
67
- :notifications="activeNotificationsByType.inline"
68
- group-type="inline"
69
- @dismiss="$emit('dismiss-notification', $event)"
70
- @toggle-all="$emit('toggle-all')"
71
- ></asd20-notification-group>
72
- </client-only>
73
- </template>
74
- <!-- Announcement Feed -->
75
- <template slot="before">
76
- <asd20-feeds-section
77
- :announcements="announcements"
78
- :announcements-feed-props="announcementsFeedProps"
79
- @announcements-in-view="$emit('announcements-in-view')"
80
- ></asd20-feeds-section>
81
- </template>
82
-
83
- <slot></slot>
84
- </asd20-page-content>
84
+ />
85
85
  <asd20-page-content
86
86
  :primary-messages="wayFindingPrimaryMessages"
87
87
  :secondary-messages="secondaryMessages"
@@ -89,7 +89,7 @@
89
89
  fullscreen
90
90
  />
91
91
 
92
- <!-- Feeds -->
92
+ <!-- Feed Section -->
93
93
  <asd20-feeds-section
94
94
  :stories="stories"
95
95
  :stories-feed-props="storiesFeedProps"
@@ -183,7 +183,13 @@ export default {
183
183
  },
184
184
  primaryMessage() {
185
185
  const introMessage = this.primaryMessages.slice(0, 1)
186
- if ((introMessage[0].bodyHtml === '' || null) || (introMessage[0].detailLink !== '' || null)) return
186
+ if (
187
+ introMessage[0].bodyHtml === '' ||
188
+ null ||
189
+ introMessage[0].detailLink !== '' ||
190
+ null
191
+ )
192
+ return
187
193
  return introMessage
188
194
  },
189
195
  },
@@ -225,30 +231,14 @@ export default {
225
231
  }
226
232
  }
227
233
  }
228
- .asd20-page-content {
229
- .notification-group--inline {
230
- margin-bottom: space(1);
231
- }
232
- .asd20-feeds-section {
233
- margin-top: space(2);
234
- .asd20-swiper-feed:first-child {
235
- padding-top: space(2);
236
- padding-bottom: space(1);
237
- &::after {
238
- top: space(1);
239
- }
240
- }
241
- .asd20-swiper-feed:last-child {
242
- // margin-top: space(-1);
243
- padding-bottom: space(2);
244
- &::after {
245
- bottom: space(1);
246
- }
247
- }
248
- }
234
+ .asd20-notification-group--inline {
235
+ margin-top: space(2) !important;
236
+ }
237
+ .notification-group--inline {
238
+ margin-bottom: space(1);
249
239
  }
250
240
  .asd20-feeds-section {
251
- margin-top: space(1);
241
+ margin-top: space(2);
252
242
  .asd20-swiper-feed:first-child {
253
243
  padding-top: space(2);
254
244
  padding-bottom: space(1);
@@ -265,11 +255,15 @@ export default {
265
255
  }
266
256
  }
267
257
  .intro-message {
268
- .asd20-messaging {
269
- border-left: 40px solid var(--color__tertiary);
270
- border-bottom: 20px solid var(--color__tertiary);
271
- padding-left: space(1);
272
- padding-bottom: space(1);
258
+ .primary-messaging-section {
259
+ padding-top: space(1) !important;
260
+ padding-bottom: space(1) !important;
261
+ .asd20-messaging {
262
+ border-left: space(1) solid var(--color__tertiary);
263
+ border-bottom: space(1) solid var(--color__tertiary);
264
+ padding-left: space(1);
265
+ padding-bottom: space(1);
266
+ }
273
267
  }
274
268
  p {
275
269
  // font-family: var(--website-typography__font-family-headlines);
package/src/components/templates/Asd20WayfindingTemplate/index.vue CHANGED
@@ -53,28 +53,26 @@
53
53
  <!-- <asd20-breadcrumb slot="top" :links="breadcrumbLinks"></asd20-breadcrumb> -->
54
54
  </asd20-page-header>
55
55
 
56
+ <!-- Inline-Notifications -->
57
+ <template>
58
+ <client-only>
59
+ <asd20-notification-group
60
+ class="asd20-notification-group--inline"
61
+ :notifications="activeNotificationsByType.inline"
62
+ group-type="inline"
63
+ @dismiss="$emit('dismiss-notification', $event)"
64
+ @toggle-all="$emit('toggle-all')"
65
+ ></asd20-notification-group>
66
+ </client-only>
67
+ </template>
68
+
56
69
  <!-- Page Content -->
57
70
  <asd20-page-content
58
71
  class="intro-message"
59
72
  :primary-messages="primaryMessage"
60
73
  omit-detail-links
61
74
  omit-calls-to-action
62
- >
63
- <!-- Inline-Notifications -->
64
- <template slot="before">
65
- <client-only>
66
- <asd20-notification-group
67
- :notifications="activeNotificationsByType.inline"
68
- group-type="inline"
69
- @dismiss="$emit('dismiss-notification', $event)"
70
- @toggle-all="$emit('toggle-all')"
71
- ></asd20-notification-group>
72
- </client-only>
73
- </template>
74
-
75
- <slot></slot>
76
- </asd20-page-content>
77
-
75
+ />
78
76
  <asd20-page-content
79
77
  :primary-messages="wayFindingPrimaryMessages"
80
78
  :secondary-messages="secondaryMessages"
@@ -82,6 +80,7 @@
82
80
  grid
83
81
  />
84
82
 
83
+ <!-- Feed Section -->
85
84
  <asd20-feeds-section
86
85
  :announcements="announcements"
87
86
  :announcements-feed-props="announcementsFeedProps"
@@ -178,7 +177,13 @@ export default {
178
177
  },
179
178
  primaryMessage() {
180
179
  const introMessage = this.primaryMessages.slice(0, 1)
181
- if ((introMessage[0].bodyHtml === '' || null) || (introMessage[0].detailLink !== '' || null)) return
180
+ if (
181
+ introMessage[0].bodyHtml === '' ||
182
+ null ||
183
+ introMessage[0].detailLink !== '' ||
184
+ null
185
+ )
186
+ return
182
187
  return introMessage
183
188
  },
184
189
  },
@@ -220,13 +225,22 @@ export default {
220
225
  }
221
226
  }
222
227
  }
228
+ .asd20-notification-group--inline {
229
+ margin-top: space(2) !important;
230
+ }
231
+
223
232
  .intro-message {
224
- .asd20-messaging {
225
- border-left: 40px solid var(--color__tertiary);
226
- border-bottom: 20px solid var(--color__tertiary);
227
- padding-left: space(1);
228
- padding-bottom: space(1);
233
+ .primary-messaging-section {
234
+ padding-top: space(1) !important;
235
+ padding-bottom: space(1) !important;
236
+ .asd20-messaging {
237
+ border-left: space(1) solid var(--color__tertiary);
238
+ border-bottom: space(1) solid var(--color__tertiary);
239
+ padding-left: space(1);
240
+ padding-bottom: space(1);
241
+ }
229
242
  }
243
+
230
244
  p {
231
245
  // font-family: var(--website-typography__font-family-headlines);
232
246
  font-size: 18px !important;