@asd20/ui 3.2.395 → 3.2.398

package/package.json

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

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

@@ -129,7 +129,7 @@ $accent: var(--color__accent);
     font-weight: bold;
     color: var(--color__accent-s20);
     white-space: nowrap;
-    margin-right: space(0.25);
+    margin-right: space(0.5);
   }
   .time {
     font-size: 0.75rem;
@@ -145,7 +145,8 @@ $accent: var(--color__accent);
     font-size: 0.75rem;
     margin-bottom: 0.5em;
     display: none;
-    white-space: nowrap;
+    margin-right: space(0.5);
+    // white-space: nowrap;
   }
   .description {
     display: none;
@@ -158,7 +159,7 @@ $accent: var(--color__accent);
     }
     .start-time {
       margin-top: space(0.125);
-      display: inline-block;
+      display: block;
       font-size: 0.875rem;
       margin-left: space(0.5);
     }
@@ -167,6 +168,7 @@ $accent: var(--color__accent);
       margin-top: space(0.125);
       margin-bottom: 0;
       font-size: 0.875rem;
+      margin-left: space(0.5);
     }
   }
   &--all-day {

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

@@ -17,6 +17,7 @@
         {{ title }}
         <span class="version" v-if="version" v-html="version"></span>
       </div>
+      <asd20-district-logo link="https://www.asd20.org"/>
     </h1>
     <slot />
   </header>
@@ -25,9 +26,11 @@
 <script>
 import Asd20Button from '../../atoms/Asd20Button'
 import Asd20Icon from '../../atoms/Asd20Icon'
+import Asd20DistrictLogo from '../../atoms/Asd20DistrictLogo'
+
 export default {
   name: 'Asd20AppHeader',
-  components: { Asd20Button, Asd20Icon },
+  components: { Asd20Button, Asd20Icon, Asd20DistrictLogo },
   props: {
     title: { type: String, default: '' },
     icon: { type: String, default: '' },
@@ -47,21 +50,28 @@ export default {
   display: flex;
   align-items: center;
   flex-shrink: 0;
-  border-bottom: 1px solid var(--color__tertiary);
   background: white;
   flex-wrap: wrap;
+  border-bottom: 1px solid var(--color__tertiary);
 
   &__title {
     display: flex;
     align-items: center;
     flex-shrink: 0;
     padding: space(0.5) 0;
+    // width: 100vw;
+    // border-bottom: 1px solid var(--color__tertiary);
   }
 
   h1 {
     margin: 0;
     font-size: 1rem;
     color: var(--color__primary);
+    flex-grow: 1;
+    width: 100%;
+    border-bottom: 1px solid var(--color__tertiary);
+    display: flex;
+    align-items: center;
     .asd20-icon {
       margin: 0 space(0.5);
     }
@@ -145,6 +155,14 @@ export default {
 
 @media (max-width: 480px) {
   .asd20-app-header {
+    &__title {
+      display: flex;
+      align-items: center;
+      flex-shrink: 0;
+      padding: space(0.5) 0;
+      width: 100vw;
+      border-bottom: 1px solid var(--color__tertiary);
+    }
   }
 }
 </style>

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

@@ -237,8 +237,8 @@ export default {
   bottom: 0;
   // bottom: space(7);
   background: var(--website-menu__open-background-color, white);
-  // overflow: auto;
-  overflow-y: scroll !important;
+  overflow: auto;
+  // overflow-y: scroll !important;
 }
 
 .asd20-table-of-contents {
@@ -262,7 +262,7 @@ export default {
     flex-grow: 0;
     justify-content: space-between;
     align-items: center;
-    padding: space(0.5) space(0.5);
+    padding: space(1) space(1);
     cursor: pointer;
     transition: background asd20-speed(1) ease-in-out;
     box-shadow: 0 -1px 0 0 var(--website-menu__divider-color) inset;
@@ -305,7 +305,6 @@ export default {
   top: 0;
   right: 0;
   bottom: 0;
-  // overflow-y: scroll;
   &__back {
     display: flex;
     justify-content: flex-start;
@@ -343,7 +342,7 @@ export default {
   }
 
   .asd20-site-menu__items {
-    overflow-y: scroll !important; /* has to be scroll, not auto */
+    overflow-y: scroll; /* has to be scroll, not auto */
     // -webkit-overflow-scrolling: touch;
   }
 

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

@@ -39,16 +39,6 @@
       :items="actionItems"
     /> -->
 
-    <transition name="slide">
-      <asd20-site-menu
-        ref="siteMenu"
-        v-show="menuOpen"
-        :active="menuOpen"
-        @update:active="$emit('update:menuOpen', $event)"
-        :sections="navigation"
-        v-scroll-lock="menuOpen"
-      />
-    </transition>
     <transition name="slide">
       <asd20-action-menu
         v-show="(mq === 'lg' || mq === 'xl') && isLoaded"
@@ -66,6 +56,25 @@
         @update:active="$emit('update:menuOpen', $event)"
       /> -->
     </transition>
+
+    <transition name="slide">
+      <asd20-site-menu
+        ref="siteMenu"
+        v-show="menuOpen"
+        :active="menuOpen"
+        @update:active="$emit('update:menuOpen', $event)"
+        :sections="navigation"
+      />
+      <!-- <asd20-site-menu
+        ref="siteMenu"
+        v-show="menuOpen"
+        :active="menuOpen"
+        @update:active="$emit('update:menuOpen', $event)"
+        :sections="navigation"
+        v-scroll-lock="menuOpen"
+      /> -->
+    </transition>
+
     <transition name="slide">
       <asd20-site-search
         v-show="searchOpen"