@asd20/ui 3.2.707 → 3.2.709

package/package.json

@@ -5,7 +5,7 @@
     "*.scss",
     "*.vue"
   ],
-  "version": "3.2.707",
+  "version": "3.2.709",
   "private": false,
   "license": "MIT",
   "repository": {

package/src/components/atoms/Asd20Messaging/index.vue

@@ -173,6 +173,7 @@ export default {
     //   margin-top: space(-1);
     // }
     padding: space(1);
+    justify-content: space-between;
 
     & > .message-image {
       display: flex;
@@ -194,7 +195,6 @@ export default {
 @media (min-width: 1024px) {
   .asd20-messaging {
     &--fullscreen {
-      // position: relative;
       padding: 0;
       display: flex;
       align-items: center;
@@ -203,22 +203,12 @@ export default {
         position: relative;
         z-index: 1;
         height: min-content;
-        // align-self: center;
         transform: translate3d(0, calc(10% * var(--scroll-progress)), 0);
       }
 
       .message-image {
         position: relative;
-        padding-top: 0.5rem;
-        padding-right: space(1);
-        margin: 0;
-        img {
-          width: 15vw;
-          height: 15vw;
-          // filter: grayscale(100%);
-          // mix-blend-mode: lighten;
-          // opacity: 0.7;
-        }
+        margin: 0 0 0 1rem;
       }
     }
   }

package/src/components/organisms/Asd20SecondaryHeader/index.vue

@@ -38,18 +38,18 @@ export default {
   // background-image: var(--website-homepage-header__secondary-background-style);
   // background-position: bottom right !important;
   // background-size: cover !important;
-  padding: space(2) space(1) space(1) space(1);
+  padding: space(1) 0 space(1) 0;
   .asd20-messaging {
     padding: 0;
   }
 
   &::v-deep .message-image {
     order: 2;
-    padding: space(1);
-    margin-top: space(-1);
+    // padding-top: space(1);
+    // margin-top: space(-1);
     img {
       width: 100%;
-      height: 100%;
+      height: 200px;
     }
   }
   &::v-deep .asd20-messaging__heading {
@@ -72,6 +72,7 @@ export default {
     order: 1;
     max-width: 100%;
     text-shadow: 1px 1px 4px black !important;
+    padding: space(1);
   }
   &::v-deep .asd20-button {
     @include asd20-font(
@@ -138,22 +139,32 @@ export default {
     }
   }
 }
+
+@media (min-width: 768px) {
+  .asd20-secondary-header {
+    &::v-deep .asd20-messaging__content {
+      padding: space(1);
+    }
+    &::v-deep .message-image img {
+      height: 300px;
+    }
+  }
+}
 @media (min-width: 1024px) {
   .asd20-secondary-header {
     padding: space(3) space(3) space(2) space(3);
     background: var(--website-homepage-header__secondary-background-color)
       var(--website-homepage-header__secondary-background-style);
-    // &::v-deep .lead {
-    //   width: 80%;
-    // }
     &::v-deep .message-image {
-      // display: none !important;
       margin-top: 0;
-      padding: 0 0 0 space(1);
+      img {
+        height: auto;
+      }
     }
     &::v-deep .asd20-messaging__content {
       order: 1;
       max-width: 60%;
+      padding: 0;
     }
     &::v-deep .asd20-messaging__heading {
       border-bottom: none;

package/src/components/organisms/Asd20VideoHeader/index.vue

@@ -108,18 +108,14 @@ export default {
     --fill-one: rgba(255, 255, 255, 1);
     --fill-two: rgba(255, 255, 255, 0.625);
 
-    // position: absolute;
     right: 0;
     z-index: 100;
     padding: space(0.25) space(0);
-    // display: flex;
     justify-content: space-between;
     align-items: center;
     margin: 0 0.5rem;
-    // flex-direction: column;
 
     & ::v-deep .notification-group--status {
-      // margin-left: -0.5rem;
       .asd20-notification {
         margin: 0;
         padding: 0 !important;
@@ -198,10 +194,6 @@ export default {
 
 @media (min-width: 768px) {
   .asd20-video-header {
-    // .background-image {
-    //   height: 80vh;
-    //   max-height: 400px;
-    // }
     &__top {
       position: absolute;
       padding: space(0.5) space(0);

package/src/components/organisms/Asd20VideoHeaderContent/index.vue

@@ -150,7 +150,7 @@ export default {
       // width: 80%;
       &::v-deep .asd20-messaging {
         padding: space(1);
-        margin-left: space(2);
+        margin-left: space(3);
         .asd20-messaging__content {
           margin: 0;
           animation: slide_left 2s ease-in-out 0.5s both;
@@ -168,7 +168,7 @@ export default {
         width: 75%;
         top: 0;
         bottom: space(-0.74);
-        left: 1.5rem;
+        left: 3.25rem;
         height: 100%;
         right: 0;
         z-index: -1;

package/src/components/templates/Asd20DistrictVideoTemplate/index.vue

@@ -372,8 +372,8 @@ export default {
       }
     }
   }
-  // .asd20-secondary-header {
-  //   background-attachment: fixed !important;
-  // }
+  .asd20-secondary-header {
+    background-attachment: fixed !important;
+  }
 }
 </style>