@asd20/ui 3.2.548 → 3.2.550
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/organisms/Asd20SchoolHomepageVideoHeader/index.vue +13 -1
- package/src/components/organisms/Asd20VideoHeaderContent/index.vue +12 -0
- package/src/components/templates/Asd20DistrictVideoTemplate/index.vue +16 -0
- package/src/mixins/pageTemplateMixin.js +2 -2
package/package.json
CHANGED
|
@@ -317,6 +317,17 @@ export default {
|
|
|
317
317
|
|
|
318
318
|
$min: 3rem;
|
|
319
319
|
$max: 4rem;
|
|
320
|
+
|
|
321
|
+
@keyframes slide_left {
|
|
322
|
+
from {
|
|
323
|
+
opacity: 0;
|
|
324
|
+
margin-left: 100px;
|
|
325
|
+
}
|
|
326
|
+
to {
|
|
327
|
+
opacity: 1;
|
|
328
|
+
margin-left: 0;
|
|
329
|
+
}
|
|
330
|
+
}
|
|
320
331
|
@media (min-width: 667px) {
|
|
321
332
|
.asd20-school-homepage-video-header {
|
|
322
333
|
&__call-to-action {
|
|
@@ -436,6 +447,7 @@ $max: 4rem;
|
|
|
436
447
|
border-radius: var(--website-shape__radius-m);
|
|
437
448
|
border-left: space(0.5) solid var(--color__accent);
|
|
438
449
|
border-top: space(0.5) solid var(--color__accent);
|
|
450
|
+
animation: slide_left 1s ease-in-out 0.5s both;
|
|
439
451
|
}
|
|
440
452
|
|
|
441
453
|
h1 {
|
|
@@ -474,7 +486,7 @@ $max: 4rem;
|
|
|
474
486
|
height: auto;
|
|
475
487
|
margin: 0;
|
|
476
488
|
padding: 0;
|
|
477
|
-
transform: translate3d(0, calc(-
|
|
489
|
+
transform: translate3d(0, calc(-20% * var(--scroll-progress)), 0);
|
|
478
490
|
border-radius: var(--website-shape__radius-l);
|
|
479
491
|
overflow: hidden;
|
|
480
492
|
|
|
@@ -104,6 +104,17 @@ export default {
|
|
|
104
104
|
}
|
|
105
105
|
}
|
|
106
106
|
}
|
|
107
|
+
@keyframes slide_down {
|
|
108
|
+
from {
|
|
109
|
+
opacity: 0;
|
|
110
|
+
bottom: space(2);
|
|
111
|
+
}
|
|
112
|
+
to {
|
|
113
|
+
opacity: 1;
|
|
114
|
+
botom: space(-0.74);
|
|
115
|
+
}
|
|
116
|
+
}
|
|
117
|
+
|
|
107
118
|
@media (min-width: 667px) {
|
|
108
119
|
.asd20-video-header-content {
|
|
109
120
|
width: 100%;
|
|
@@ -170,6 +181,7 @@ export default {
|
|
|
170
181
|
// );
|
|
171
182
|
border-left: 20px solid var(--website-homepage-header__accent);
|
|
172
183
|
border-bottom: 20px solid var(--website-homepage-header__accent);
|
|
184
|
+
animation: slide_down 1s ease-in-out 0.5s both;
|
|
173
185
|
}
|
|
174
186
|
}
|
|
175
187
|
&::v-deep .asd20-messaging__button-group {
|
|
@@ -226,6 +226,17 @@ export default {
|
|
|
226
226
|
// }
|
|
227
227
|
// }
|
|
228
228
|
|
|
229
|
+
@keyframes slide_left {
|
|
230
|
+
from {
|
|
231
|
+
opacity: 0;
|
|
232
|
+
margin-left: 100px;
|
|
233
|
+
}
|
|
234
|
+
to {
|
|
235
|
+
opacity: 1;
|
|
236
|
+
margin-left: 0;
|
|
237
|
+
}
|
|
238
|
+
}
|
|
239
|
+
|
|
229
240
|
@media (min-width: 667px) {
|
|
230
241
|
.asd20-district-video-template {
|
|
231
242
|
.asd20-video-header-content {
|
|
@@ -255,6 +266,11 @@ export default {
|
|
|
255
266
|
.asd20-video-header-content {
|
|
256
267
|
position: absolute;
|
|
257
268
|
bottom: 20%;
|
|
269
|
+
transform: translate3d(0, calc(-70% * var(--scroll-progress)), 0);
|
|
270
|
+
animation: slide_left 1s ease-in-out 0.5s both;
|
|
271
|
+
|
|
272
|
+
.lead {
|
|
273
|
+
}
|
|
258
274
|
}
|
|
259
275
|
.asd20-organization-picker {
|
|
260
276
|
display: inherit !important;
|
|
@@ -240,8 +240,8 @@ export default {
|
|
|
240
240
|
this.firstMessage.bodyHtml !== '<p></p>' &&
|
|
241
241
|
this.desktop &&
|
|
242
242
|
this.primaryMessages.length < 3) ||
|
|
243
|
-
this.announcements
|
|
244
|
-
this.stories
|
|
243
|
+
this.announcements ||
|
|
244
|
+
this.stories
|
|
245
245
|
const relatedLinksContainImages =
|
|
246
246
|
this.relatedLinks.length && !!this.relatedLinks.find(l => !!l.imageUrl)
|
|
247
247
|
|