@asd20/ui 3.2.765 → 3.2.767

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/organisms/Asd20SecondaryHeader/index.vue +7 -2
  3. package/src/components/organisms/Asd20VideoHeaderContent/index.vue +24 -2
  4. package/src/components/templates/Asd20DistrictVideoTemplate/index.vue +12 -1
package/package.json CHANGED
@@ -5,7 +5,7 @@
5
5
  "*.scss",
6
6
  "*.vue"
7
7
  ],
8
- "version": "3.2.765",
8
+ "version": "3.2.767",
9
9
  "private": false,
10
10
  "license": "MIT",
11
11
  "repository": {
package/src/components/organisms/Asd20SecondaryHeader/index.vue CHANGED
@@ -66,7 +66,7 @@ export default {
66
66
  // background-size: 30% auto;
67
67
  }
68
68
  &::v-deep .lead {
69
- @include fluid-type($base-font-size * 1.2, $base-font-size * 1.4);
69
+ @include fluid-type($base-font-size * 1, $base-font-size * 1.15);
70
70
  color: var(--website-homepage-header__secondary-foreground-color);
71
71
  width: 100%;
72
72
  }
@@ -164,8 +164,13 @@ export default {
164
164
  padding: space(3) space(3) space(2) space(3);
165
165
  background: var(--website-homepage-header__secondary-background-color)
166
166
  var(--website-homepage-header__secondary-background-style);
167
- .asd20-messaging {
167
+ &::v-deep .asd20-messaging {
168
168
  flex-direction: row;
169
+ .asd20-messaging__heading {
170
+ @include fluid-type($base-font-size * 1.15, $base-font-size * 1.5);
171
+ // color: var(--color__accent-s10);
172
+ // border-bottom: none;
173
+ }
169
174
  }
170
175
  &::v-deep .message-image {
171
176
  margin-top: 0;
package/src/components/organisms/Asd20VideoHeaderContent/index.vue CHANGED
@@ -113,7 +113,7 @@ export default {
113
113
  &::v-deep .lead {
114
114
  margin-bottom: 0;
115
115
  // width: 90%;
116
- @include fluid-type($base-font-size * 1.2, $base-font-size * 1.4);
116
+ @include fluid-type($base-font-size * 1, $base-font-size * 1.15);
117
117
  color: var(--website-homepage-header__foreground-color) !important;
118
118
  }
119
119
  &::v-deep .asd20-button {
@@ -156,6 +156,27 @@ export default {
156
156
  // botom: space(-0.74);
157
157
  }
158
158
  }
159
+ @keyframes slide_left {
160
+ from {
161
+ opacity: 0;
162
+ margin-left: 200px;
163
+ }
164
+ to {
165
+ opacity: 1;
166
+ margin-left: 0;
167
+ }
168
+ }
169
+
170
+ @keyframes slide_left2 {
171
+ from {
172
+ opacity: 0;
173
+ margin-left: 100px;
174
+ }
175
+ to {
176
+ opacity: 1;
177
+ margin-left: 0;
178
+ }
179
+ }
159
180
 
160
181
  @media (min-width: 667px) {
161
182
  .asd20-video-header-content {
@@ -197,9 +218,10 @@ export default {
197
218
  animation: slide_left 1.5s ease-in-out 0.5s both;
198
219
  }
199
220
  .asd20-messaging__heading {
200
- @include fluid-type($base-font-size * 1.5, $base-font-size * 2);
221
+ @include fluid-type($base-font-size * 1.15, $base-font-size * 1.5);
201
222
  color: var(--color__accent-s10);
202
223
  border-bottom: none;
224
+ animation: slide_left2 1.25s ease-in-out 0.75s both;
203
225
  }
204
226
  }
205
227
  &::after {
package/src/components/templates/Asd20DistrictVideoTemplate/index.vue CHANGED
@@ -318,6 +318,17 @@ export default {
318
318
  }
319
319
  }
320
320
 
321
+ @keyframes slide_right {
322
+ from {
323
+ opacity: 0;
324
+ margin-left: -200px;
325
+ }
326
+ to {
327
+ opacity: 1;
328
+ margin-left: 0;
329
+ }
330
+ }
331
+
321
332
  @media (min-width: 768px) {
322
333
  .asd20-district-video-template {
323
334
  .asd20-video-header {
@@ -367,7 +378,7 @@ export default {
367
378
  }
368
379
  .asd20-video-header-content {
369
380
  position: absolute;
370
- bottom: 20%;
381
+ bottom: 15%;
371
382
  transform: translate3d(0, calc(-70% * var(--scroll-progress)), 0);
372
383
  animation: slide_left 1.5s ease-in-out 0.5s both;
373
384
  }