@asd20/ui 3.2.721 → 3.2.723

package/package.json

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

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

@@ -15,10 +15,10 @@
         <span v-if="description" v-html="description"> </span>
         <a
           v-if="detailLinkUrl"
-          :tabindex="focusDisabled ? '-1' : undefined" 
+          :tabindex="focusDisabled ? '-1' : undefined"
           :href="detailLinkUrl"
         >
-        {{ detailLinkLabel || detailLinkUrl }}
+          {{ detailLinkLabel || detailLinkUrl }}
         </a>
       </div>
 
@@ -78,10 +78,14 @@ export default {
     classes() {
       let classes = {
         'asd20-notification': true,
-        'asd20-notification--banner': this.notificationStyle.toLowerCase() === 'banner',
-        'asd20-notification--floating': this.notificationStyle.toLowerCase() === 'floating',
-        'asd20-notification--inline': this.notificationStyle.toLowerCase() === 'inline',
-        'asd20-notification--status': this.notificationStyle.toLowerCase() === 'status',
+        'asd20-notification--banner':
+          this.notificationStyle.toLowerCase() === 'banner',
+        'asd20-notification--floating':
+          this.notificationStyle.toLowerCase() === 'floating',
+        'asd20-notification--inline':
+          this.notificationStyle.toLowerCase() === 'inline',
+        'asd20-notification--status':
+          this.notificationStyle.toLowerCase() === 'status',
         'asd20-notification--dismissible': this.dismissible,
       }
 
@@ -173,7 +177,6 @@ export default {
     .asd20-notification__cta {
       color: #da2e0b;
       border-color: #da2e0b;
-
     }
     .asd20-icon {
       --line-color: #da2e0b;
@@ -222,6 +225,10 @@ export default {
 
   &.asd20-notification--floating {
     box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.125);
+    .asd20-icon {
+      --line-color: #23464e;
+      --fill-color: #70b4c2;
+    }
     .asd20-notification__content {
       padding: 0;
     }
@@ -259,10 +266,9 @@ export default {
     .asd20-icon {
       height: 24px;
       width: 24px;
-      --line-color: black;
-      --fill-color: black;
-      .fill {
-        opacity: 0.25;
+      .asd20-icon {
+        --line-color: #23464e;
+        --fill-color: #70b4c2;
       }
     }
     .asd20-notification__title {
@@ -291,6 +297,10 @@ export default {
 
   &.asd20-notification--inline {
     box-shadow: 0 0 0 5px #70b4c2;
+    .asd20-icon {
+      --line-color: #23464e;
+      --fill-color: #70b4c2;
+    }
   }
 
   &.asd20-notification--banner {
@@ -406,7 +416,6 @@ export default {
   }
 }
 
-
 @media (min-width: 1024px) {
   .asd20-notification {
     &__title {

package/src/components/templates/Asd20LoginsTemplate/index.stories.js

@@ -66,7 +66,62 @@ const wrapper = {
             label: 'Login',
           },
         ],
-        categories: [{ category: { title: 'Families' } }],
+        categories: [
+          { category: { title: 'Families' } },
+          { category: { title: 'Staff' } },
+        ],
+        links: [
+          {
+            link: {
+              category: 'General',
+              type: 'Call to Action',
+              id: '82f90d70-22bf-11eb-965f-c9c4be5898ae',
+              title: 'Login',
+              url: 'https://mycampus.asd20.org/campus/portal/academy20.jsp',
+              expireDateTime: '2200-01-01T00:00:00+00:00',
+            },
+          },
+        ],
+        heading: 'Infinite Campus (IC) - Parent Portal',
+        shortDescription:
+          "​Your student's academic information including, grades, attendance and more.",
+        longDescription: '',
+        bodyContent:
+          '<p>The Infinite Campus (IC) Portal account is available to the parents/guardians of enrolled students. You must be the student\'s guardian to see student information from your account. The most common information displayed is: student picture, student ID number, attendance, grades, report cards/unofficial transcripts, notifications (district, school, and teacher). This account allows a parent/guardian to monitor the academic progress of their student. Each school determines what information appears in the portal.</p><h3>What you can do:</h3><ul><li><p>Check your student’s grades</p></li><li><p>Messages from district, schools &amp; teachers</p></li><li><p>Schedule</p></li><li><p>Attendance</p></li><li><p>Grades</p></li><li><p>Report Cards</p></li><li><p>Account Recovery Set-up</p></li></ul><h3>How to Login</h3><p>The format for a new parent/guardian is:&nbsp;<strong>username_p@asd20.org</strong>.<br><br>The username and temporary password are emailed to the parent or guardian. If the registration receipt is not available, you can contact the&nbsp;<a href="https://www.asd20.org/help-desk" rel="noopener noreferrer nofollow">Help&nbsp;Desk</a>.</p><h3>Who Has Access</h3><p>Parents/guardians of enrolled students can have a IC Portal account. Do not share your account information with your child! Students have their own IC Portal accounts.</p><h3>How to Gain Access</h3><p>At the completion of student registration, an IC Portal account is created for one of the parents/guardians registering the student. The username and temporary password are emailed to the parent or guardian.<br><br>If another parent/guardian would like an IC Portal account, a request can be submitted through the&nbsp;<a href="https://www.asd20.org/help-desk" rel="noopener noreferrer nofollow">Help&nbsp;Desk</a>.</p>',
+        detailLink: '',
+        detailLinkLabel: '',
+      },
+      {
+        id: 'd354e920-22be-11eb-8d10-97cf3b94cd87',
+        title: 'Infinite Campus (IC) - Student Login',
+        summary:
+          "Student's academic information including, grades, attendance and more.",
+        bodyHtml:
+          '<p>The Infinite Campus (IC) student account is available to all enrolled students. The most common information displayed is: student picture, student ID number, attendance, grades, report cards/unofficial transcripts, notifications (district, school, and teacher). Each school determines what information appears in the portal.</p><h3>What you can do:</h3><ul><li><p>Check your student’s grades</p></li><li><p>Messages from district, schools &amp; teachers</p></li><li><p>Schedule</p></li><li><p>Attendance</p></li><li><p>Grades</p></li><li><p>Report Cards</p></li><li><p>Account Recovery Set-up</p></li></ul><h3>How to Login</h3><p>The format for a new parent/guardian is:&nbsp;<strong>username_p@asd20.org</strong>.<br><br>The username and temporary password are emailed to the parent or guardian. If the registration receipt is not available, you can contact the&nbsp;<a href="https://www.asd20.org/help-desk" rel="noopener noreferrer nofollow">Help&nbsp;Desk</a>.</p><h3>Who Has Access</h3><p>Parents/guardians of enrolled students can have a IC Portal account. Do not share your account information with your child! Students have their own IC Portal accounts.</p><h3>How to Gain Access</h3><p>At the completion of student registration, an IC Portal account is created for one of the parents/guardians registering the student. The username and temporary password are emailed to the parent or guardian.<br><br>If another parent/guardian would like an IC Portal account, a request can be submitted through the&nbsp;<a href="https://www.asd20.org/help-desk" rel="noopener noreferrer nofollow">Help&nbsp;Desk</a>.</p>',
+        status: 'Published',
+        publishDateTime: '2020-11-09T19:07:34.962Z',
+        expireDateTime: '2070-11-29T19:07:34.962Z',
+        translations: null,
+        images: [],
+        videos: [],
+        callsToAction: [
+          {
+            link: {
+              category: 'General',
+              type: 'Call to Action',
+              id: '82f90d70-22bf-11eb-965f-c9c4be5898ae',
+              title: 'Login',
+              url: 'https://mycampus.asd20.org/campus/portal/academy20.jsp',
+              expireDateTime: '2200-01-01T00:00:00+00:00',
+            },
+            url: 'https://mycampus.asd20.org/campus/portal/academy20.jsp',
+            label: 'Login',
+          },
+        ],
+        categories: [
+          { category: { title: 'Families' } },
+          { category: { title: 'Staff' } },
+        ],
         links: [
           {
             link: {
@@ -113,7 +168,10 @@ const wrapper = {
             label: 'Login',
           },
         ],
-        categories: [{ category: { title: 'Staff' } }],
+        categories: [
+          { category: { title: 'Staff' } },
+          { category: { title: 'Families' } },
+        ],
         links: [
           {
             link: {

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

@@ -352,9 +352,13 @@ export default {
   .logins-list {
     display: flex;
     flex-direction: column;
+    padding: space(1) space(1);
     .login-list-item {
       padding: space(1);
       width: 100%;
+      outline: 1px solid rgb(235, 235, 235);
+      outline-offset: -0.5rem;
+      box-shadow: none;
     }
   }
 }