@asd20/ui 3.2.745 → 3.2.746

package/package.json

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

package/src/components/molecules/Asd20Notification/index.vue

@@ -37,7 +37,7 @@
         class="asd20-notification__dismiss"
         v-if="dismissible"
         transparent
-        size="xs"
+        size="sm"
         icon="close"
         label="Dismiss"
         hide-label

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

@@ -71,7 +71,7 @@
     >
       <button :title="prevTitle" @click="previous">
         <svg
-          style="width: 16px"
+          style="width: 24px"
           viewBox="0 0 48 48"
           xmlns="http://www.w3.org/2000/svg"
         >
@@ -84,7 +84,7 @@
       <span>{{ index + 1 }} of {{ notificationsFromIndex.length }}</span>
       <button :title="nextTitle" @click="next">
         <svg
-          style="width: 16px"
+          style="width: 24px"
           viewBox="0 0 48 48"
           xmlns="http://www.w3.org/2000/svg"
         >
@@ -278,7 +278,6 @@ export default {
   &--floating {
     z-index: 1000;
     flex-direction: row;
-    margin-right: 0.25rem;
     align-items: center;
     justify-content: flex-end;
     height: 2.75rem;
@@ -335,7 +334,7 @@ export default {
     display: flex;
     justify-content: flex-end;
     align-items: center;
-    font-size: 0.75rem;
+    font-size: 0.85rem;
     z-index: 15;
 
     font-family: sans-serif;
@@ -348,8 +347,8 @@ export default {
       font-size: 1.5rem;
       font-weight: bold;
       line-height: 0;
-      width: 1rem;
-      height: 1rem;
+      width: 2rem;
+      height: 2rem;
       display: flex;
       justify-content: center;
       align-items: center;
@@ -376,7 +375,7 @@ export default {
     // z-index: -1;
     z-index: 8;
     padding-right: 2rem;
-    padding-left: 0.5rem;
+    // padding-left: 0.5rem;
     border-radius: 3rem;
     box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.0625);
   }
@@ -465,8 +464,9 @@ export default {
   &--banner .pagination {
     position: absolute;
     z-index: 199;
-    right: 0.5rem;
-    bottom: 0.5rem;
+    top: 1.125rem;
+    right: 50%;
+    transform: translatex(50%);
     color: white;
     button {
       fill: white;
@@ -653,4 +653,15 @@ export default {
     opacity: 1;
   }
 }
+
+@media (min-width: 768px) {
+  .notification-group {
+    &--banner .pagination {
+      top: inherit;
+      bottom: 0.5rem;
+      right: 0.5rem;
+      transform: translatex(0%);
+    }
+  }
+}
 </style>

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

@@ -147,17 +147,18 @@ export default {
   &__top {
     --fill-one: rgba(255, 255, 255, 1);
     --fill-two: rgba(255, 255, 255, 0.625);
-
+    width: 100%;
     position: absolute;
+    right: 0;
     z-index: 101;
     // background: white;
     display: flex;
     justify-content: flex-end;
     flex-direction: row;
     align-items: center;
-    padding: space(0.25) space(0.5);
+    padding: space(0.25) space(0.25);
     margin-top: space(0.5);
-    width: 95vw;
+    // width: 95vw;
     &::v-deep .asd20-picker {
       display: none;
     }

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

@@ -253,9 +253,10 @@ export default {
     }
     .weather-status-and-translation-container {
       display: flex;
-      flex-direction: column;
+      flex-direction: row;
       margin: space(0.25) 0;
       justify-content: flex-end;
+      align-items: center;
     }
     .asd20-language-translation {
       // position: absolute;
@@ -286,7 +287,6 @@ export default {
     .weather-link {
       text-decoration: none;
       border-radius: 3rem;
-      margin-bottom: 0.5rem;
     }
     .asd20-organization-picker {
       display: none;
@@ -299,7 +299,10 @@ export default {
     }
     .double-notification-wrapper {
       display: flex;
-      flex-direction: column;
+      flex-direction: row;
+      align-items: center;
+      flex-wrap: wrap;
+      justify-content: flex-end;
     }
   }
 }
@@ -340,9 +343,9 @@ export default {
           --fill-color: var(--color__accent) !important;
         }
       }
-      .double-notification-wrapper {
-        justify-content: center;
-      }
+      // .double-notification-wrapper {
+      //   justify-content: center;
+      // }
     }
     .asd20-video-header-content {
       top: inherit;
@@ -359,15 +362,14 @@ export default {
   }
   .asd20-video-header {
     .double-notification-wrapper {
-      justify-content: flex-end !important;
+      align-items: center;
+      flex-wrap: wrap;
     }
     .asd20-video-header-content {
       position: absolute;
       bottom: 20%;
       transform: translate3d(0, calc(-70% * var(--scroll-progress)), 0);
       animation: slide_left 1.5s ease-in-out 0.5s both;
-      .lead {
-      }
     }
     .asd20-organization-picker {
       display: inherit !important;