@asd20/ui 3.2.984 → 3.2.985

package/package.json

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

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

@@ -121,10 +121,6 @@ export default {
 
 .asd20-messaging {
   box-sizing: border-box;
-  // &:first-child:last-child p:not(.lead) {
-  //   columns: 2;
-  //   column-gap: space(1);
-  // }
 
   &__heading {
     @include asd20-font(
@@ -154,10 +150,6 @@ export default {
     );
   }
 
-  // &::v-deep p {
-  //   @include asd20-font(0.75, var(--website-typography__font-family-headlines));
-  // }
-
   &__button-group {
     display: flex;
     flex-wrap: wrap;
@@ -189,24 +181,23 @@ export default {
       & > img {
         display: block;
         width: 100%;
-        // max-height: 350px;
+        height: 300px;
         object-fit: cover;
       }
     }
   }
 }
-
-// @media (min-width: 768px) {
-//   .asd20-messaging {
-//     &--fullscreen {
-//       .message-image {
-//         img {
-//           max-height: 450px;
-//         }
-//       }
-//     }
-//   }
-// }
+@media (min-width: 768px) {
+  .asd20-messaging {
+    &--fullscreen {
+      .message-image {
+        img {
+          height: 500px;
+        }
+      }
+    }
+  }
+}
 
 @media (min-width: 1024px) {
   .asd20-messaging {

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

@@ -12,14 +12,13 @@
   >
     <slot name="before"></slot>
 
-    <section class="primary-messaging-section">
-      <!-- omit messagetitle is polluting other templates (groupTemplate), making primary messages invisible. -->
-      <!-- <asd20-messaging
-        :class="primaryMessages.length < 2 ? 'omitMessageTitle' : ''"
-        v-for="(messaging, index) in formattedPrimaryMessages"
-        :key="index"
-        v-bind="messaging"
-      ></asd20-messaging> -->
+    <section
+      :class="
+        formattedPrimaryMessages.length < 3
+          ? 'primary-messaging-section wide-message'
+          : 'primary-messaging-section'
+      "
+    >
       <asd20-messaging
         v-for="(messaging, index) in formattedPrimaryMessages"
         :key="index"
@@ -127,35 +126,10 @@ export default {
     background: var(--color__tertiary);
   }
 
-  // .asd20-messaging {
-  //   padding-bottom: space(1);
-  //   border-bottom: 10px solid var(--color__tertiary);
-  // }
-
   .asd20-messaging:not(:last-child) {
-    margin-bottom: space(2);
+    margin-bottom: space(1);
   }
 
-  // &--grid {
-  //   .primary-messaging-section,
-  //   .secondary-messaging-section {
-  //     --minimum-column-width: 480px;
-  //     --gutter: #{space(1)};
-  //     display: flex;
-  //     flex-wrap: wrap;
-  //     margin: calc(var(--gutter) * -1);
-
-  //     &::v-deep > * {
-  //       flex: 0 1 var(--minimum-column-width);
-  //       margin: var(--gutter) !important;
-  //       // max-width: 60%;
-  //     }
-  //   }
-  // }
-  // &::v-deep .omitMessageTitle .asd20-messaging__heading,
-  // &::v-deep .omitMessageTitle .lead {
-  //   display: none;
-  // }
   &--fullscreen {
     .primary-messaging-section,
     .secondary-messaging-section {
@@ -208,10 +182,6 @@ export default {
       .primary-messaging-section,
       .secondary-messaging-section {
         padding: space(2) space(1) space(2) space(2);
-        // &::v-deep > * {
-        //   flex: 1 1 var(--minimum-column-width);
-        //   margin: var(--gutter) !important;
-        // }
       }
     }
   }
@@ -223,7 +193,6 @@ export default {
     .secondary-messaging-section {
       padding: space(2) space(1) space(2) space(2);
       &::v-deep > * {
-        // flex: 1 1 var(--minimum-column-width);
         margin: space(1) !important;
       }
     }
@@ -234,29 +203,24 @@ export default {
         --gutter: #{space(1)};
         display: flex;
         flex-wrap: wrap;
-        // margin: calc(var(--gutter) * -1);
-        // padding: space(2) space(3);
-
         &::v-deep > * {
           // flex: 1 1 var(--minimum-column-width);
           // margin: var(--gutter) !important;
           max-width: 28%;
         }
       }
+      .wide-message {
+        &::v-deep > * {
+          flex: 1 1 var(--minimum-column-width);
+          max-width: 44%;
+        }
+      }
     }
-    // &::v-deep .omitMessageTitle .asd20-messaging__heading,
-    // &::v-deep .omitMessageTitle .lead {
-    //   display: none;
-    // }
     &--fullscreen {
       .primary-messaging-section,
       .secondary-messaging-section {
-        // --minimum-column-width: 320px;
         --gutter: #{space(1)};
         display: flex;
-        // margin: calc(var(--gutter) * -1);
-        // padding: space(2) space(3);
-
         &::v-deep > * {
           // flex: 1 1 var(--minimum-column-width);
           // margin: var(--gutter) !important;
@@ -274,6 +238,12 @@ export default {
           max-width: 29%;
         }
       }
+      .wide-message {
+        &::v-deep > * {
+          flex: 1 1 var(--minimum-column-width);
+          max-width: 45%;
+        }
+      }
     }
   }
 }

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

@@ -291,10 +291,7 @@ export default {
   .back {
     padding: 0;
     margin-top: space(1);
-    // font-family: var(--website-typography__font-family-body);
-    // line-height: 1.2;
     font-size: 0.85rem;
-    // font-weight: normal;
     min-height: 45px;
     &::v-deep span {
       padding-right: space(0.5);
@@ -320,7 +317,6 @@ export default {
     display: flex;
     justify-content: space-between;
     align-self: center;
-    // margin-top: space(2);
     flex-direction: column;
     .asd20-breadcrumb,
     .back {
@@ -393,10 +389,6 @@ export default {
       display: none;
     }
 
-    // &::v-deep .asd20-district-logo {
-    //   display: none;
-    // }
-
     &::v-deep .notification-group--status {
       margin-top: space(0.5);
       margin-bottom: space(0.5);

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

@@ -223,20 +223,6 @@ export default {
   .asd20-notification-group--floating {
     position: absolute;
     top: space(2.06);
-    // .bell {
-    //   box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.125) !important;
-    //   svg {
-    //     fill: var(--color__accent) !important;
-    //   }
-    //   span {
-    //     background: var(--color__accent) !important;
-    //     top: inherit !important;
-    //     right: inherit !important;
-    //     width: 1.2rem !important;
-    //     height: 1.2rem !important;
-    //     font-size: 0.75rem !important;
-    //   }
-    // }
   }
   .asd20-notification-group--inline {
     margin-top: space(2) !important;
@@ -254,7 +240,6 @@ export default {
       }
     }
     .asd20-swiper-feed:last-child {
-      // margin-top: space(-1);
       padding-bottom: space(2);
       &::after {
         bottom: space(1);
@@ -263,9 +248,6 @@ export default {
   }
   .asd20-page-content:not(.intro-message) .primary-messaging-section {
     padding: space(1) space(0);
-    .asd20-messaging {
-      // margin-bottom: space(1) !important;
-    }
   }
 
   .intro-message {
@@ -321,13 +303,6 @@ export default {
     .asd20-notification-group--floating {
       position: absolute;
       top: space(1);
-      // .bell {
-      //   span {
-      //     background: var(--color__accent);
-      //     top: -0.6em !important;
-      //     right: -0.6em !important;
-      //   }
-      // }
     }
     .asd20-page-content {
       padding: space(1);
@@ -348,25 +323,18 @@ export default {
       width: 100%;
       .asd20-messaging {
         margin-bottom: space(2) !important;
-        // flex-grow: 1;
       }
     }
     .asd20-page-content {
       &--grid {
         .primary-messaging-section,
         .secondary-messaging-section {
-          // --minimum-column-width: 1000px;
           --gutter: #{space(1)};
           display: flex;
           flex-wrap: wrap;
-          // margin: calc(var(--gutter) * -1);
-          // padding: space(2) space(2) space(2) space(3);
         }
       }
     }
-    // .intro-message {
-    //   width: 90%;
-    // }
   }
 }
 </style>