@asd20/ui 3.2.365 → 3.2.368

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/organisms/Asd20SchoolHomepageHeader/index.vue +13 -11
  3. package/src/components/organisms/Asd20SchoolHomepageVideoHeader/index.vue +0 -9
  4. package/src/components/organisms/Asd20VideoHeaderContent/index.vue +35 -26
  5. package/src/components/templates/Asd20DistrictVideoTemplate/index.vue +4 -1
  6. package/src/components/templates/Asd20SchoolHomeTemplate/index.vue +17 -33
  7. package/src/components/templates/Asd20SchoolHomeVideoTemplate/index.vue +17 -4
  8. package/src/data/page-queries/school-home-page-query-result.json +27 -0
package/package.json CHANGED
@@ -5,7 +5,7 @@
5
5
  "*.scss",
6
6
  "*.vue"
7
7
  ],
8
- "version": "3.2.365",
8
+ "version": "3.2.368",
9
9
  "private": false,
10
10
  "license": "MIT",
11
11
  "repository": {
package/src/components/organisms/Asd20SchoolHomepageHeader/index.vue CHANGED
@@ -138,18 +138,17 @@ export default {
138
138
  z-index: 101;
139
139
  background: white;
140
140
  display: flex;
141
- justify-content: space-between;
141
+ justify-content: flex-end;
142
+ flex-direction: row;
142
143
  align-items: center;
143
- flex-direction: column;
144
- align-items: flex-start;
145
- padding: space(0.25);
144
+ padding: space(0.25) space(0.5);
146
145
 
147
146
  &::v-deep .asd20-picker {
148
147
  display: none;
149
148
  }
150
149
 
151
150
  &::v-deep .notification-group--status {
152
- margin-left: 0.5rem;
151
+ // margin-left: 0.5rem;
153
152
  .asd20-notification {
154
153
  margin: 0;
155
154
  padding: 0 !important;
@@ -167,7 +166,7 @@ export default {
167
166
  position: relative;
168
167
  color: var(--website-header__title-color);
169
168
  @include asd20-font(
170
- 2.5,
169
+ 2.0,
171
170
  var(--website-typography__font-family-headlines),
172
171
  1.2,
173
172
  700
@@ -242,8 +241,8 @@ $max: 4rem;
242
241
  .asd20-school-homepage-header {
243
242
  &__top {
244
243
  flex-direction: row;
245
- justify-content: flex-start;
246
- padding: 0 space(1);
244
+ justify-content: flex-end;
245
+ padding: space(0.25) space(1);
247
246
  align-items: center !important;
248
247
  }
249
248
  }
@@ -315,10 +314,13 @@ $max: 4rem;
315
314
  background: white !important;
316
315
  grid-column: -6 / -2;
317
316
  grid-row: 3 / 5;
318
- right: auto;
319
- justify-self: end;
320
317
  padding-right: 0;
321
318
  }
319
+ &::v-deep .asd20-notification-group--floating {
320
+ position: absolute;
321
+ right: space(3);
322
+ top: space(3.5);
323
+ }
322
324
 
323
325
  &__content {
324
326
  position: relative;
@@ -366,7 +368,7 @@ $max: 4rem;
366
368
  height: auto;
367
369
  margin: 0;
368
370
  padding: 0;
369
- // transform: translate3d(0, calc(-10% * var(--scroll-progress)), 0);
371
+ transform: translate3d(0, calc(-10% * var(--scroll-progress)), 0);
370
372
  border-radius: var(--website-shape__radius-l);
371
373
  overflow: hidden;
372
374
 
package/src/components/organisms/Asd20SchoolHomepageVideoHeader/index.vue CHANGED
@@ -418,15 +418,6 @@ $max: 4rem;
418
418
  }
419
419
  }
420
420
 
421
- &::v-deep .asd20-notification-group--status {
422
- background: white !important;
423
- grid-column: -6 / -2;
424
- grid-row: 3 / 5;
425
- right: auto;
426
- justify-self: end;
427
- padding-right: 0;
428
- }
429
-
430
421
  &__content {
431
422
  top: space(1);
432
423
  left: space(1);
package/src/components/organisms/Asd20VideoHeaderContent/index.vue CHANGED
@@ -41,20 +41,21 @@ export default {
41
41
 
42
42
  .asd20-video-header-content {
43
43
  .asd20-messaging {
44
- margin-bottom: space(1);
45
- background-image: linear-gradient(
46
- to right,
47
- rgba(255, 255, 255, 0.9) 70%,
48
- rgba(255, 255, 255, 0.5) 90%,
49
- rgba(255, 255, 255, 0) 100%
50
- );
44
+ // margin-bottom: space(1);
45
+ // background-image: linear-gradient(
46
+ // to right,
47
+ // rgba(255, 255, 255, 0.9) 70%,
48
+ // rgba(255, 255, 255, 0.5) 90%,
49
+ // rgba(255, 255, 255, 0) 100%
50
+ // );
51
51
  // background-image: linear-gradient(
52
52
  // to right,
53
53
  // rgba(8, 24, 43, 0.9) 50%,
54
54
  // rgba(8, 24, 43, 0.5) 80%,
55
55
  // rgba(8, 24, 43, 0) 100%
56
56
  // );
57
- padding: space(0.5);
57
+ background: rgba(51, 92, 155, 0.7);
58
+ padding: space(1);
58
59
  }
59
60
 
60
61
  &::v-deep .asd20-messaging__heading {
@@ -64,15 +65,18 @@ export default {
64
65
  1.5,
65
66
  700
66
67
  );
67
- color: var(--color__accent-s30);
68
+ color: #fff !important;
69
+ padding-bottom: space(0.25);
70
+ border-bottom: 5px solid var(--color__accent);
68
71
  }
69
72
  &::v-deep .asd20-messaging__body-content {
70
73
  display: none;
71
74
  }
72
75
  &::v-deep .lead {
73
76
  margin-bottom: 0;
74
- width: 90%;
77
+ // width: 90%;
75
78
  font-size: 18px;
79
+ color: #f6f6f6 !important
76
80
  }
77
81
  &::v-deep .asd20-button {
78
82
  @include asd20-font(
@@ -89,9 +93,9 @@ export default {
89
93
  }
90
94
  }
91
95
  .header-messaging-section {
92
- border-left: 10px solid var(--color__accent);
96
+ // border-bottom: 10px solid var(--color__accent);
93
97
  .asd20-messaging__content {
94
- width: 85%;
98
+ // width: 85%;
95
99
  }
96
100
  }
97
101
  }
@@ -100,12 +104,13 @@ export default {
100
104
  .asd20-video-header-content {
101
105
  width: 80%;
102
106
  .header-messaging-section {
103
- border-left: none;
107
+ border-bottom: none;
108
+ width: 70%;
104
109
  &::v-deep .asd20-messaging {
105
110
  padding: space(1);
106
- margin-left: space(1);
111
+ margin-left: space(2);
107
112
  .asd20-messaging__content {
108
- max-width: 80%;
113
+ // max-width: 60%;
109
114
  }
110
115
  }
111
116
  &::after {
@@ -113,9 +118,10 @@ export default {
113
118
  display: block;
114
119
  position: absolute;
115
120
  height: space(10);
116
- width: 90%;
117
- bottom: space(0);
118
- left: 0;
121
+ width: 45%;
122
+ bottom: space(-.75);
123
+ left: space(1.25);
124
+ height: 60%;
119
125
  right: 0;
120
126
  z-index: -1;
121
127
  // background: var(--color__accent);
@@ -125,14 +131,16 @@ export default {
125
131
  // rgba(255, 255, 255, 0.5) 90%,
126
132
  // rgba(255, 255, 255, 0) 100%
127
133
  // );
128
- background: radial-gradient(
129
- ellipse at bottom left,
130
- var(--color__accent) 30%,
131
- rgba(255, 255, 255, 0) 70%,
132
- rgba(255, 255, 255, 0) 80%,
133
- rgba(255, 255, 255, 0) 90%,
134
- rgba(0, 0, 0, 0) 100%
135
- );
134
+ // background: radial-gradient(
135
+ // ellipse at bottom left,
136
+ // var(--color__accent) 30%,
137
+ // rgba(255, 255, 255, 0) 70%,
138
+ // rgba(255, 255, 255, 0) 80%,
139
+ // rgba(255, 255, 255, 0) 90%,
140
+ // rgba(0, 0, 0, 0) 100%
141
+ // );
142
+ border-left: 20px solid var(--color__accent);
143
+ border-bottom: 20px solid var(--color__accent);
136
144
  }
137
145
  }
138
146
  &::v-deep .asd20-messaging__heading {
@@ -144,6 +152,7 @@ export default {
144
152
  700
145
153
  );
146
154
  color: var(--color__accent-s10);
155
+ border-bottom: none;
147
156
  }
148
157
  &::v-deep .asd20-messaging__body-content {
149
158
  display: none;
package/src/components/templates/Asd20DistrictVideoTemplate/index.vue CHANGED
@@ -160,7 +160,7 @@ export default {
160
160
  margin-top: space(2.25);
161
161
  .asd20-video-header-content {
162
162
  position: absolute;
163
- bottom: 20%;
163
+ bottom: 30%;
164
164
  // .asd20-messaging__button-group {
165
165
  // justify-content: center;
166
166
  // }
@@ -169,6 +169,9 @@ export default {
169
169
 
170
170
  @media (min-width: 768px) {
171
171
  .asd20-district-video-template {
172
+ .asd20-video-header-content {
173
+ bottom: 20%;
174
+ }
172
175
  // .lead {
173
176
  // margin-bottom: 0;
174
177
  // width: 90%;
package/src/components/templates/Asd20SchoolHomeTemplate/index.vue CHANGED
@@ -224,52 +224,27 @@ export default {
224
224
  .asd20-feeds-section {
225
225
  margin-top: space(0);
226
226
  }
227
-
228
- .asd20-notification-group--floating {
229
- position: absolute;
230
- right: space(0.5);
231
- top: space(0.5) !important;
232
- }
233
-
234
- // .announcements,
235
- // .calendars {
236
- // margin-top: space(0);
237
- // }
238
227
  .asd20-quicklinks-menu {
239
228
  position: relative;
240
229
  background-color: var(--website-quick-links__background-color);
241
230
  }
242
231
  }
243
- @media (min-width: 667px) {
244
- .asd20-school-home-template {
245
- .asd20-notification-group--floating {
246
- right: space(1);
247
- top: space(0.2) !important;
248
- }
249
- }
250
- }
251
232
 
252
233
  @media (min-width: 1024px) {
253
234
  .asd20-school-home-template {
254
235
  display: block;
255
236
  margin-left: space(3);
256
237
  margin-top: 0;
257
- &::v-deep .asd20-notification-group--status {
258
- background: white;
259
- top: space(2);
260
- }
238
+ // &::v-deep .asd20-notification-group--status {
239
+ // background: white;
240
+ // top: space(2);
241
+ // }
261
242
  .pickerContainer {
262
243
  display: flex;
263
244
  .optionalLogo {
264
- max-width: 12rem;
265
- max-height: 6rem;
266
- margin-left: space(0.5);
245
+ display: none;
267
246
  }
268
247
  }
269
- // .asd20-feeds-section {
270
- // margin-top: space(1);
271
- // }
272
-
273
248
  .asd20-quicklinks-menu {
274
249
  padding-bottom: space(1);
275
250
  margin: space(-1) 0 0 0;
@@ -283,9 +258,18 @@ export default {
283
258
  margin-right: space(0.5);
284
259
  }
285
260
  }
286
- .asd20-notification-group--floating {
287
- right: space(1);
288
- top: space(7) !important;
261
+ }
262
+ }
263
+ @media (min-width: 1350px) {
264
+ .asd20-school-home-template {
265
+ .pickerContainer {
266
+ display: flex;
267
+ .optionalLogo {
268
+ display: block;
269
+ max-width: 12rem;
270
+ max-height: 6rem;
271
+ margin-left: space(0.5);
272
+ }
289
273
  }
290
274
  }
291
275
  }
package/src/components/templates/Asd20SchoolHomeVideoTemplate/index.vue CHANGED
@@ -202,7 +202,6 @@ export default {
202
202
  right: space(0.5);
203
203
  top: space(0.5) !important;
204
204
  }
205
-
206
205
  .asd20-notification-group--floating {
207
206
  position: absolute;
208
207
  right: space(0.5);
@@ -237,7 +236,7 @@ export default {
237
236
  .optionalLogo {
238
237
  max-width: 12rem;
239
238
  max-height: 6rem;
240
- margin-left: space(2);
239
+ margin-left: space(1);
241
240
  }
242
241
  }
243
242
 
@@ -260,8 +259,22 @@ export default {
260
259
  }
261
260
  .asd20-notification-group--status {
262
261
  order: 0;
263
- right: space(1) !important;
264
- top: space(4) !important;
262
+ right: space(4) !important;
263
+ top: space(6) !important;
264
+ }
265
+ }
266
+ }
267
+
268
+ @media (min-width: 1350px) {
269
+ .asd20-school-home-video-template {
270
+ .asd20-notification-group--status {
271
+ order: 0;
272
+ right: space(3) !important;
273
+ top: space(2.5) !important;
274
+ }
275
+ .asd20-notification-group--floating {
276
+ right: space(3.5);
277
+ top: space(3.5) !important;
265
278
  }
266
279
  }
267
280
  }
package/src/data/page-queries/school-home-page-query-result.json CHANGED
@@ -165,6 +165,21 @@
165
165
  "url": "https://www.asd20.org/register",
166
166
  "label": "Register",
167
167
  "id": "4c8c8200-3573-11eb-8803-c3566d07dfac"
168
+ },
169
+ {
170
+ "link": {
171
+ "category": "General",
172
+ "type": "Call to Action",
173
+ "id": "4c8c8200-3573-11eb-8803-c3566d07dfac",
174
+ "title": "Graduation Livestream",
175
+ "url": "https://www.asd20.org/register",
176
+ "description": "",
177
+ "imageUrl": null,
178
+ "expireDateTime": "2200-01-01T00:00:00+00:00"
179
+ },
180
+ "url": "https://www.asd20.org/register",
181
+ "label": "Graduation Livestream",
182
+ "id": "4c8c8200-3573-11eb-8803-c3566d07dfac"
168
183
  }
169
184
  ],
170
185
  "categories": [],
@@ -180,6 +195,18 @@
180
195
  "imageUrl": null,
181
196
  "expireDateTime": "2200-01-01T00:00:00+00:00"
182
197
  }
198
+ },
199
+ {
200
+ "link": {
201
+ "category": "General",
202
+ "type": "Call to Action",
203
+ "id": "4c8c8200-3573-11eb-8803-c3566d07dfac",
204
+ "title": "Graduation Livestream",
205
+ "url": "https://www.asd20.org/register",
206
+ "description": "",
207
+ "imageUrl": null,
208
+ "expireDateTime": "2200-01-01T00:00:00+00:00"
209
+ }
183
210
  }
184
211
  ],
185
212
  "heading": "Feel the THUNDER",