@asd20/ui 3.2.433 → 3.2.436

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 (7) hide show
  1. package/package.json +1 -1
  2. package/src/components/organisms/Asd20OrganizationPicker/index.vue +2 -2
  3. package/src/components/organisms/Asd20SecondaryHeader/index.vue +8 -3
  4. package/src/components/organisms/Asd20VideoHeader/index.vue +6 -4
  5. package/src/components/organisms/Asd20VideoHeaderContent/index.vue +9 -4
  6. package/src/components/templates/Asd20DistrictHomeTemplate/index.vue +2 -2
  7. package/src/components/templates/Asd20DistrictVideoTemplate/index.vue +37 -24
package/package.json CHANGED
@@ -5,7 +5,7 @@
5
5
  "*.scss",
6
6
  "*.vue"
7
7
  ],
8
- "version": "3.2.433",
8
+ "version": "3.2.436",
9
9
  "private": false,
10
10
  "license": "MIT",
11
11
  "repository": {
package/src/components/organisms/Asd20OrganizationPicker/index.vue CHANGED
@@ -131,8 +131,8 @@ export default {
131
131
  height: space(1.5);
132
132
  margin: space(1) auto space(1) 0;
133
133
  display: block;
134
- --fill-one: white;
135
- --fill-two: white;
134
+ --fill-one: #fff;
135
+ --fill-two: #ccc;
136
136
  }
137
137
  }
138
138
  }
package/src/components/organisms/Asd20SecondaryHeader/index.vue CHANGED
@@ -38,7 +38,7 @@ export default {
38
38
  // background-image: var(--website-homepage-header__secondary-background-style);
39
39
  // background-position: bottom right !important;
40
40
  // background-size: cover !important;
41
- padding: space(3) space(1) space(3) space(1);
41
+ padding: space(3) space(1) space(2) space(1);
42
42
 
43
43
  &::v-deep .asd20-messaging__heading {
44
44
  @include fluid-type($base-font-size * 1.5, $base-font-size * 2);
@@ -66,7 +66,8 @@ export default {
66
66
  700
67
67
  );
68
68
  flex-direction: column;
69
- width: 50vw;
69
+ width: 70vw;
70
+ margin: space(0.5) auto;
70
71
  color: var(--website-homepage-header__secondary-button-foreground-color);
71
72
  // background: var(--website-homepage-header__secondary-button-background-color);
72
73
  &:hover {
@@ -113,11 +114,15 @@ export default {
113
114
  &::v-deep .lead {
114
115
  width: 100%;
115
116
  }
117
+ &::v-deep .asd20-button {
118
+ width: 50vw;
119
+ margin: space(0.25) 0;
120
+ }
116
121
  }
117
122
  }
118
123
  @media (min-width: 1024px) {
119
124
  .asd20-secondary-header {
120
- padding: space(3);
125
+ padding: space(3) space(3) space(2) space(3);
121
126
  &::v-deep .lead {
122
127
  width: 80%;
123
128
  }
package/src/components/organisms/Asd20VideoHeader/index.vue CHANGED
@@ -86,7 +86,8 @@ export default {
86
86
  .background-image {
87
87
  display: block;
88
88
  // position: absolute;
89
- height: 90vh;
89
+ height: 80vh;
90
+ min-height: 500px;
90
91
  width: 100%;
91
92
  z-index: -1;
92
93
  object-fit: cover;
@@ -101,7 +102,8 @@ export default {
101
102
  --fill-one: rgba(255, 255, 255, 1);
102
103
  --fill-two: rgba(255, 255, 255, 0.625);
103
104
 
104
- position: relative;
105
+ position: absolute;
106
+ right: 0;
105
107
  z-index: 100;
106
108
  padding: space(0.5) space(1);
107
109
  display: flex;
@@ -231,8 +233,8 @@ export default {
231
233
  padding: 0;
232
234
  z-index: 3;
233
235
  position: absolute;
234
- margin: space(2) space(2) space(2) space(2);
235
- width: 92%;
236
+ margin: space(2) space(1) space(2) space(2);
237
+ width: 95%;
236
238
  }
237
239
  .scroll-down-indicator {
238
240
  display: block;
package/src/components/organisms/Asd20VideoHeaderContent/index.vue CHANGED
@@ -57,7 +57,7 @@ export default {
57
57
  // background: rgba(51, 92, 155, 0.7);
58
58
  background: var(--website-homepage-header__background-color);
59
59
  padding: space(1);
60
- height: 100vh;
60
+ height: auto;
61
61
  }
62
62
 
63
63
  &::v-deep .asd20-messaging__heading {
@@ -83,7 +83,8 @@ export default {
83
83
  700
84
84
  );
85
85
  flex-direction: column;
86
- width: 50vw;
86
+ width: 70vw;
87
+ margin: space(0.5) auto;
87
88
  color: var(--website-homepage-header__button-foreground-color);
88
89
  background: var(--website-homepage-header__button-background-color);
89
90
  border: none;
@@ -95,7 +96,7 @@ export default {
95
96
  .header-messaging-section {
96
97
  // border-bottom: 10px solid var(--color__accent);
97
98
  &::v-deep .asd20-messaging__content {
98
- margin-top: space(5);
99
+ margin: space(2) 0;
99
100
  }
100
101
  }
101
102
  }
@@ -113,6 +114,10 @@ export default {
113
114
  margin-top: 0;
114
115
  }
115
116
  }
117
+ &::v-deep .asd20-button {
118
+ width: 50vw;
119
+ margin: space(0.25) 0;
120
+ }
116
121
  }
117
122
  }
118
123
 
@@ -126,7 +131,7 @@ export default {
126
131
  padding: space(1);
127
132
  margin-left: space(2);
128
133
  .asd20-messaging__content {
129
- // max-width: 80%;
134
+ margin: 0;
130
135
  }
131
136
  .asd20-messaging__heading {
132
137
  @include fluid-type($base-font-size * 1.5, $base-font-size * 2);
package/src/components/templates/Asd20DistrictHomeTemplate/index.vue CHANGED
@@ -286,7 +286,7 @@ export default {
286
286
  display: flex;
287
287
  justify-content: space-between;
288
288
  align-items: center;
289
- .asd20-picker {
289
+ .asd20-organization-picker {
290
290
  display: none;
291
291
  }
292
292
  & /deep/ .notification-group--status .notifications {
@@ -370,7 +370,7 @@ export default {
370
370
  z-index: 3;
371
371
  display: flex;
372
372
  justify-content: space-between;
373
- .asd20-picker {
373
+ .asd20-organization-picker {
374
374
  display: inherit;
375
375
  .asd20-district-logo {
376
376
  height: space(3) !important;
package/src/components/templates/Asd20DistrictVideoTemplate/index.vue CHANGED
@@ -41,26 +41,27 @@
41
41
  reversed
42
42
  ></asd20-organization-picker>
43
43
  </client-only>
44
-
45
- <client-only>
46
- <asd20-notification-group
47
- :notifications="activeNotificationsByType.status"
48
- group-type="status"
49
- @dismiss="$emit('dismiss-notification', $event)"
50
- @toggle-all="$emit('toggle-all')"
51
- />
52
- </client-only>
53
-
54
- <client-only>
55
- <asd20-notification-group
56
- class="asd20-notification-group--floating"
57
- :notifications="activeNotificationsByType.floating"
58
- :total-dismissed-notifications="totalDismissedNotifications"
59
- group-type="floating"
60
- @dismiss="$emit('dismiss-notification', $event)"
61
- @toggle-all="$emit('toggle-all')"
62
- ></asd20-notification-group>
63
- </client-only>
44
+ <div class="notification-wrapper">
45
+ <client-only>
46
+ <asd20-notification-group
47
+ :notifications="activeNotificationsByType.status"
48
+ group-type="status"
49
+ @dismiss="$emit('dismiss-notification', $event)"
50
+ @toggle-all="$emit('toggle-all')"
51
+ />
52
+ </client-only>
53
+
54
+ <client-only>
55
+ <asd20-notification-group
56
+ class="asd20-notification-group--floating"
57
+ :notifications="activeNotificationsByType.floating"
58
+ :total-dismissed-notifications="totalDismissedNotifications"
59
+ group-type="floating"
60
+ @dismiss="$emit('dismiss-notification', $event)"
61
+ @toggle-all="$emit('toggle-all')"
62
+ ></asd20-notification-group>
63
+ </client-only>
64
+ </div>
64
65
  </template>
65
66
  <asd20-video-header-content :messages="messages">
66
67
  <slot />
@@ -175,10 +176,15 @@ export default {
175
176
  .asd20-organization-picker {
176
177
  display: none;
177
178
  }
179
+ .notification-wrapper {
180
+ display: flex;
181
+ flex-direction: row;
182
+ justify-content: space-between;
183
+ }
178
184
  }
179
185
  .asd20-video-header-content {
180
- position: absolute;
181
- top: space(2);
186
+ // position: absolute;
187
+ // top: space(2);
182
188
  }
183
189
  }
184
190
  .asd20-notification-group--floating {
@@ -201,8 +207,9 @@ export default {
201
207
  @media (min-width: 667px) {
202
208
  .asd20-district-video-template {
203
209
  .asd20-video-header-content {
210
+ position: absolute;
204
211
  top: inherit;
205
- bottom: 20%;
212
+ bottom: 0%;
206
213
  }
207
214
  }
208
215
  }
@@ -223,8 +230,14 @@ export default {
223
230
  // }
224
231
  }
225
232
  .asd20-video-header {
233
+ .asd20-video-header-content {
234
+ bottom: 20%;
235
+ }
226
236
  .asd20-organization-picker {
227
- display: block !important;
237
+ display: inherit !important;
238
+ .asd20-district-logo {
239
+ height: space(2.25) !important;
240
+ }
228
241
  .asd20-picker {
229
242
  .picker-button {
230
243
  margin: space(1);