@asd20/ui 3.2.1036 → 3.2.1037

package/package.json

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

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

@@ -263,6 +263,8 @@ export default {
     align-items: center;
     justify-content: flex-end;
     height: 2.75rem;
+    border-radius: 2rem;
+    border: 1px solid var(--website-page__alternate-background-color);
   }
 
   &--floating .bell {

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

@@ -84,7 +84,7 @@
       <template slot="top">
         <div class="notification-translation-container">
           <div class="language-wrapper">
-            <client-only>
+            <!-- <client-only>
               <a
                 v-if="activeNotificationsByType.status.length > 0"
                 class="weather-link"
@@ -97,7 +97,7 @@
                   @toggle-all="$emit('toggle-all')"
                 />
               </a>
-            </client-only>
+            </client-only> -->
             <client-only>
               <Asd20BlockSchedule
                 v-if="blockEvent"
@@ -118,7 +118,11 @@
           <!-- Floating Notifications -->
           <client-only>
             <asd20-notification-group
-              class="asd20-notification-group--floating"
+              :class="
+                !blockEvent
+                  ? 'asd20-notification-group--floating no-block-widget'
+                  : 'asd20-notification-group--floating'
+              "
               :notifications="activeNotificationsByType.floating"
               :total-dismissed-notifications="totalDismissedNotifications"
               group-type="floating"
@@ -319,7 +323,7 @@ export default {
     flex-wrap: wrap;
     justify-content: flex-end;
     width: 100%;
-    margin: 0 1.5rem;
+    margin: 0 0.5rem;
     .language-wrapper {
       display: flex;
       flex-direction: row;
@@ -345,6 +349,10 @@ export default {
         }
       }
     }
+    .no-block-widget {
+      position: absolute;
+      top: 0;
+    }
   }
 
   .asd20-language-loader {
@@ -379,12 +387,17 @@ export default {
 @media (min-width: 667px) {
   .asd20-school-home-template {
     .notification-translation-container {
+      margin: 0 1.5rem;
+      justify-content: flex-end;
       flex-wrap: nowrap;
       .language-wrapper {
         justify-content: flex-start;
         margin-bottom: 0;
       }
-      justify-content: flex-end;
+      .no-block-widget {
+        position: relative;
+        top: unset;
+      }
     }
   }
 }

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

@@ -81,7 +81,7 @@
       <template slot="top">
         <div class="notification-translation-container">
           <div class="language-wrapper">
-            <client-only>
+            <!-- <client-only>
               <a
                 v-if="activeNotificationsByType.status.length > 0"
                 class="weather-link"
@@ -95,7 +95,7 @@
                   @toggle-all="$emit('toggle-all')"
                 />
               </a>
-            </client-only>
+            </client-only> -->
 
             <client-only>
               <Asd20BlockSchedule
@@ -118,7 +118,11 @@
           <!-- Floating Notifications -->
           <client-only>
             <asd20-notification-group
-              class="asd20-notification-group--floating"
+              :class="
+                !blockEvent
+                  ? 'asd20-notification-group--floating no-block-widget'
+                  : 'asd20-notification-group--floating'
+              "
               :notifications="activeNotificationsByType.floating"
               :total-dismissed-notifications="totalDismissedNotifications"
               group-type="floating"
@@ -302,6 +306,9 @@ export default {
       position: absolute;
       top: 3.5rem;
     }
+    .no-block-widget {
+      top: 0;
+    }
     .asd20-language-loader {
       order: 1;
     }