@asd20/ui 3.2.995 → 3.2.996

package/package.json

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

package/src/components/atoms/Asd20Icon/index.stories.js

@@ -93,11 +93,13 @@ storiesOf('Atoms - Asd20Icon', module)
           'star',
           'thumb',
           'thumb-filled',
+          'info-alt',
 
           'phone-alt',
           'hours-alt',
           'map',
           'external',
+          'contact',
           'chevron',
           'menu',
           'close',
@@ -124,6 +126,7 @@ storiesOf('Atoms - Asd20Icon', module)
           'info',
           'jobs',
           'language',
+          'link',
           'login',
           'pearson',
           'personalize',

package/src/components/atoms/icons/Asd20AccessibilitySvg.vue

@@ -1,20 +1,47 @@
-<template>
+<!-- <template>
   <g>
+    <path class="fill" d="M6 6v16h20V6zm10 14a6 6 0 1 1 6-6 6 6 0 0 1-6 6z" />
     <path
-      class="fill"
-      d="M6 6v16h20V6zm10 14a6 6 0 1 1 6-6 6 6 0 0 1-6 6z"
-    /><path
       class="line"
       fill="currentColor"
       d="M16 20.5A6.5 6.5 0 1 0 9.5 14a6.51 6.51 0 0 0 6.5 6.5zm0-1c-.73 0-1.5-1.09-1.92-2.82h3.84c-.42 1.73-1.19 2.82-1.92 2.82zm-2.1-3.82a10.92 10.92 0 0 1 0-3.36h4.2a10.92 10.92 0 0 1 0 3.36zM18 19.1a7.6 7.6 0 0 0 1-2.42h1.8A5.53 5.53 0 0 1 18 19.1zm3.5-5.1a5.19 5.19 0 0 1-.27 1.68h-2.11a12.88 12.88 0 0 0 0-3.36h2.11A5.19 5.19 0 0 1 21.5 14zm-.7-2.68H19a7.6 7.6 0 0 0-1-2.42 5.53 5.53 0 0 1 2.8 2.42zM16 8.5c.73 0 1.5 1.09 1.92 2.82h-3.84C14.5 9.59 15.27 8.5 16 8.5zm-2 .4a7.6 7.6 0 0 0-1 2.42h-1.8A5.53 5.53 0 0 1 14 8.9zM10.5 14a5.19 5.19 0 0 1 .27-1.68h2.11a12.88 12.88 0 0 0 0 3.36h-2.11A5.19 5.19 0 0 1 10.5 14zm2.5 2.68a7.6 7.6 0 0 0 1 2.42 5.53 5.53 0 0 1-2.76-2.42z"
-    /><path
+    />
+    <path
       class="line"
       fill="currentColor"
       d="M4 4v20h11v-1H5V5h22v18h-8v1h9V4H4z"
-    /><path
+    />
+    <path class="line" fill="currentColor" d="M14 23v5l6.75-5H19l-4 3v-3h-1z" />
+  </g>
+</template> -->
+
+<template>
+  <g
+    viewBox="0 0 32 40"
+    width="128"
+    height="160"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <!-- 3/4 Circle badge outline -->
+    <path
+      d="M6 28 a15 15 0 1 1 20 0"
+      fill="none"
       class="line"
-      fill="currentColor"
-      d="M14 23v5l6.75-5H19l-4 3v-3h-1z"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
+    />
+    <!-- Info background bubble (more rounded shape) -->
+    <path
+      class="fill"
+      stroke="currentColor"
+      stroke-width="2"
+      d="M 11 7.8 h 10 a 4.4 4 90 0 1 4 4.4 v 7.15 a 4.4 4 90 0 1 -4 4.4 h -3 l -3.5 3.85 a 1.1 1 90 0 1 -1.5 -0.99 v -2.86 h -2 a 4.4 4 90 0 1 -4 -4.4 v -7.15 a 4.4 4 90 0 1 4 -4.4 z"
+    />
+    <path
+      class="fill"
+      fill="white"
+      d="M 15.9 21.75 A 5.85 5.85 90 1 0 10.05 15.9 a 5.859 5.859 90 0 0 5.85 5.85 z m 0 -0.9 c -0.657 0 -1.35 -0.981 -1.728 -2.538 h 3.456 c -0.378 1.557 -1.071 2.538 -1.728 2.538 z m -1.89 -3.438 a 9.828 9.828 90 0 1 0 -3.024 h 3.78 a 9.828 9.828 90 0 1 0 3.024 z M 17.7 20.49 a 6.84 6.84 90 0 0 0.9 -2.178 h 1.62 A 4.977 4.977 90 0 1 17.7 20.49 z m 3.15 -4.59 a 4.671 4.671 90 0 1 -0.243 1.512 h -1.899 a 11.592 11.592 90 0 0 0 -3.024 h 1.899 A 4.671 4.671 90 0 1 20.85 15.9 z m -0.63 -2.412 H 18.6 a 6.84 6.84 90 0 0 -0.9 -2.178 a 4.977 4.977 90 0 1 2.52 2.178 z M 15.9 10.95 c 0.657 0 1.35 0.981 1.728 2.538 h -3.456 C 14.55 11.931 15.243 10.95 15.9 10.95 z m -1.8 0.36 a 6.84 6.84 90 0 0 -0.9 2.178 h -1.62 A 4.977 4.977 90 0 1 14.1 11.31 z M 10.95 15.9 a 4.671 4.671 90 0 1 0.243 -1.512 h 1.899 a 11.592 11.592 90 0 0 0 3.024 h -1.899 A 4.671 4.671 90 0 1 10.95 15.9 z m 2.25 2.412 a 6.84 6.84 90 0 0 0.9 2.178 a 4.977 4.977 90 0 1 -2.484 -2.178 z"
     />
   </g>
 </template>

package/src/components/atoms/icons/Asd20AlertSvg.vue

@@ -1,4 +1,4 @@
-<template>
+<!-- <template>
   <g>
     <path class="fill" d="M18 6h-4L6 22v3h20v-3z" /><path
       class="line"
@@ -17,4 +17,34 @@
       r="1"
     />
   </g>
+</template> -->
+
+<template>
+  <g
+    viewBox="0 0 32 40"
+    width="128"
+    height="160"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <!-- 3/4 Circle outline (open at bottom) -->
+    <path
+      d="M6 28 a15 15 0 1 1 20 0"
+      fill="none"
+      class="line"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
+    />
+    <!-- Alert circle (fill and outlined) -->
+    <path  d="M25.7677 20.4635 17.6512 6.8938C16.9383 5.702 15.0617 5.702 14.3488 6.8939L6.2323 20.4635C5.5487 21.6065 6.4558 23 7.8835 23H24.1165C25.5442 23 26.4513 21.6065 25.7677 20.4635Z" class="fill" stroke="currentColor" stroke-width="1.5" />
+    <!-- Exclamation mark (tapered bar, wider at top) -->
+    <polygon
+      points="15,10 17.6,10 16.7,18 15.9,18"
+      class="line"
+      fill="currentColor"
+    />
+    <!-- Dot -->
+    <circle cx="16.3" cy="20" r="1.2" class="line" fill="currentColor"/>
+  </g>
 </template>
+

package/src/components/atoms/icons/Asd20ArtsSvg.vue

@@ -1,27 +1,44 @@
 <template>
-  <g>
-    <path
-      class="fill"
-      d="M12.46,16.78V12.23l2-.62a7.31,7.31,0,0,1-1.5-2.19L11.74,7a1,1,0,0,0-1.21-.42C9.23,7.15,7.93,8,7.06,11.2c-1.19,4.4,1.75,7.48,5.4,8.75Z"
-    />
-    <path
-      class="fill"
-      d="M16.46,15.73v4.15A4.56,4.56,0,0,0,18.86,17a11.19,11.19,0,0,0,.37-2.08Z"
-    />
-    <path
-      class="line"
-      fill="currentColor"
-      d="M10.3,9.47a1.26,1.26,0,0,0,1.54-.89A1.25,1.25,0,0,0,11,7a1.26,1.26,0,0,0-.66,2.43Z"
-    />
-    <path
-      class="line"
-      fill="currentColor"
-      d="M9.65,11.9a1.26,1.26,0,1,0-1.54.88A1.26,1.26,0,0,0,9.65,11.9Z"
-    />
+  <g
+    viewBox="0 0 32 40"
+    width="128"
+    height="160"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <!-- 3/4 Circle outline (open at bottom) -->
     <path
+      d="M6 28 a15 15 0 1 1 20 0"
+      fill="none"
       class="line"
-      fill="currentColor"
-      d="M18.16,10.43l1.62-.51a2.63,2.63,0,0,0-1.17-.29,2.74,2.74,0,0,0-.64.08c-.56.14-.95.47-1.36.47s-.83-.35-1.45-1.57c.48-1,.74-2,1.56-3.92a19.92,19.92,0,0,0-2.41,2.24l-.74-1.48A2.58,2.58,0,0,0,11.27,4a2.44,2.44,0,0,0-.8.13c-1.9.63-4.36,1.58-5.67,6.43a9,9,0,0,0,1.41,7.79l-2,3a1,1,0,0,0,1.66,1.13l1.78-2.64a12.52,12.52,0,0,0,4.85,2.53V23c-1.69.17-3,1.2-3,2.46S11,28,13,28s3.5-1.12,3.5-2.5V22.39a6.94,6.94,0,0,0,4.67-4.79,12.52,12.52,0,0,0,.47-3.39l-.37.11L22.46,14v7.13c-1.7.18-3,1.21-3,2.47s1.57,2.5,3.5,2.5,3.5-1.12,3.5-2.5V7.82ZM14.55,9.6a3,3,0,0,0,1.54,1.49l-3.21,1,.57-.85a.49.49,0,0,0,.05-.44A10.19,10.19,0,0,0,14.55,9.6ZM6.81,17.5a8,8,0,0,1-1-6.65C7,6.38,9.17,5.64,10.79,5.1A1.51,1.51,0,0,1,11.27,5a1.61,1.61,0,0,1,1.41.87l.92,1.85a15.19,15.19,0,0,0-1.49,2.17.51.51,0,0,0-.31.21L8.91,14.39a1.23,1.23,0,0,0-1.11.91,1.16,1.16,0,0,0,0,.69Zm1.36,1.55,1.74-2.57a1.07,1.07,0,0,0,.19-.28l2.36-3.49V17.2a1,1,0,0,0-.29-.15,1.27,1.27,0,0,0-1.55.89,1.25,1.25,0,0,0,1.84,1.41v2A11.35,11.35,0,0,1,8.17,19.05Zm12-1.71a5.89,5.89,0,0,1-3.7,4V15.73l4.13-1.22A11.6,11.6,0,0,1,20.16,17.34Zm5.3-3.79v10c0,.71-1,1.5-2.5,1.5s-2.5-.79-2.5-1.5.92-1.35,2.1-1.47l.78-.12.11-.77V12.61L22.18,13l-6,1.79-.72.21V25.5c0,.71-1,1.5-2.5,1.5s-2.5-.79-2.5-1.5.92-1.35,2.1-1.47l.71-.11.16-.69,0-.11V13l12-3.78Z"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
     />
+    <g transform="translate(3,3) scale(0.85)">
+      <path
+        class="fill"
+        d="M12.46,16.78V12.23l2-.62a7.31,7.31,0,0,1-1.5-2.19L11.74,7a1,1,0,0,0-1.21-.42C9.23,7.15,7.93,8,7.06,11.2c-1.19,4.4,1.75,7.48,5.4,8.75Z"
+      />
+      <path
+        class="fill"
+        d="M16.46,15.73v4.15A4.56,4.56,0,0,0,18.86,17a11.19,11.19,0,0,0,.37-2.08Z"
+      />
+      <path
+        class="line"
+        fill="currentColor"
+        d="M10.3,9.47a1.26,1.26,0,0,0,1.54-.89A1.25,1.25,0,0,0,11,7a1.26,1.26,0,0,0-.66,2.43Z"
+      />
+      <path
+        class="line"
+        fill="currentColor"
+        d="M9.65,11.9a1.26,1.26,0,1,0-1.54.88A1.26,1.26,0,0,0,9.65,11.9Z"
+      />
+      <path
+        class="line"
+        stroke="currentColor"
+        stroke-width="0.75"
+        d="M18.16,10.43l1.62-.51a2.63,2.63,0,0,0-1.17-.29,2.74,2.74,0,0,0-.64.08c-.56.14-.95.47-1.36.47s-.83-.35-1.45-1.57c.48-1,.74-2,1.56-3.92a19.92,19.92,0,0,0-2.41,2.24l-.74-1.48A2.58,2.58,0,0,0,11.27,4a2.44,2.44,0,0,0-.8.13c-1.9.63-4.36,1.58-5.67,6.43a9,9,0,0,0,1.41,7.79l-2,3a1,1,0,0,0,1.66,1.13l1.78-2.64a12.52,12.52,0,0,0,4.85,2.53V23c-1.69.17-3,1.2-3,2.46S11,28,13,28s3.5-1.12,3.5-2.5V22.39a6.94,6.94,0,0,0,4.67-4.79,12.52,12.52,0,0,0,.47-3.39l-.37.11L22.46,14v7.13c-1.7.18-3,1.21-3,2.47s1.57,2.5,3.5,2.5,3.5-1.12,3.5-2.5V7.82ZM14.55,9.6a3,3,0,0,0,1.54,1.49l-3.21,1,.57-.85a.49.49,0,0,0,.05-.44A10.19,10.19,0,0,0,14.55,9.6ZM6.81,17.5a8,8,0,0,1-1-6.65C7,6.38,9.17,5.64,10.79,5.1A1.51,1.51,0,0,1,11.27,5a1.61,1.61,0,0,1,1.41.87l.92,1.85a15.19,15.19,0,0,0-1.49,2.17.51.51,0,0,0-.31.21L8.91,14.39a1.23,1.23,0,0,0-1.11.91,1.16,1.16,0,0,0,0,.69Zm1.36,1.55,1.74-2.57a1.07,1.07,0,0,0,.19-.28l2.36-3.49V17.2a1,1,0,0,0-.29-.15,1.27,1.27,0,0,0-1.55.89,1.25,1.25,0,0,0,1.84,1.41v2A11.35,11.35,0,0,1,8.17,19.05Zm12-1.71a5.89,5.89,0,0,1-3.7,4V15.73l4.13-1.22A11.6,11.6,0,0,1,20.16,17.34Zm5.3-3.79v10c0,.71-1,1.5-2.5,1.5s-2.5-.79-2.5-1.5.92-1.35,2.1-1.47l.78-.12.11-.77V12.61L22.18,13l-6,1.79-.72.21V25.5c0,.71-1,1.5-2.5,1.5s-2.5-.79-2.5-1.5.92-1.35,2.1-1.47l.71-.11.16-.69,0-.11V13l12-3.78Z"
+      />
+    </g>
   </g>
 </template>

package/src/components/atoms/icons/Asd20AthleticsSvg.vue

@@ -1,4 +1,4 @@
-<template>
+<!-- <template>
   <g>
     <path
       class="fill"
@@ -23,4 +23,45 @@
       d="M27,24.86C27,21.86,25,22,23,21s-2-2.16-2.09-2.44L20,15l4-5L18,4,13,9h-.74a3,3,0,0,0-2.15.89L5,15l1.58,1.73-.86.82.69.72.85-.8L8.5,18.81l-.83.79.69.72.81-.77,1.24,1.35-.79.75.69.73.77-.74L12.32,23l-.76.72.69.73.74-.71.57.62a8.2,8.2,0,0,0,6,2.66h6.55a.85.85,0,0,0,.84-.84ZM14,9.41l4-4,4.65,4.66-3.87,4.75-.69-.1A4.79,4.79,0,0,1,14,10ZM12.26,10H13A5.77,5.77,0,0,0,18,15.71l1.24.17.16.62H17.5v1h2.11l.25,1H18.5v1h1.62a4.47,4.47,0,0,0,2.43,2.39c.5.25,1,.43,1.41.6.86.31,1.4.52,1.7,1H20.37a6.53,6.53,0,0,1-4.81-2.12L12.46,18h0V15.83a7.26,7.26,0,0,0-1.95-5l.27-.26A2,2,0,0,1,12.26,10ZM9.84,11.57a6.28,6.28,0,0,1,1.66,4.26V17L8.13,13.28ZM19.61,26a7.22,7.22,0,0,1-5.31-2.33L6.38,15l1-1,7.4,8.07a7.56,7.56,0,0,0,5.55,2.44h5.56c0,.13,0,.25,0,.4L26,26Z"
     />
   </g>
+</template> -->
+
+<template>
+  <g viewBox="0 0 32 40" xmlns="http://www.w3.org/2000/svg">
+    <!-- 3/4 arc outline (open at bottom) -->
+    <path
+      d="M6 28 a15 15 0 1 1 20 0"
+      fill="none"
+      class="line"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
+    />
+
+    <!-- Athletics shape (scaled & centered) -->
+    <g transform="translate(3.5,7) scale(0.34)">
+      <path
+        class="line"
+        fill="currentColor"
+        d="M 55.0026 33.4714 c -5.84 -0.2106 -12.56 -1.4134 -14.672 -2.624 c -1.3894 -0.7974 -2.696 -2.2454 -3.8746 -3.928 l 0.9654 -0.3226 c 0.6986 -0.2346 1.0746 -0.9894 0.8426 -1.688 c -0.232 -0.6934 -0.9814 -1.08 -1.6854 -0.8426 l -1.5814 0.528 c -0.5386 -0.9626 -1.0426 -1.944 -1.472 -2.92 l 1.2294 -0.4106 c 0.6986 -0.2346 1.0746 -0.9894 0.8426 -1.688 c -0.232 -0.6934 -0.9814 -1.08 -1.6854 -0.8426 l -1.3574 0.4534 c -0.448 -1.2906 -0.768 -2.472 -0.9014 -3.3786 c -0.0534 -0.368 -0.2586 -0.696 -0.5654 -0.904 c -0.3094 -0.2134 -0.688 -0.2854 -1.0506 -0.2026 C 18.8 17.2554 10.1306 17.3328 9.1146 17.3328 c -0.12 0 -0.104 0 -0.1146 0 c -0.72 0 -1.312 0.5706 -1.3334 1.2934 c -0.048 1.648 -0.5814 5.0934 -1.1466 8.7414 C 5.7734 32.194 5 37.1808 5 39.9994 v 8 c 0 0.736 0.5974 1.3334 1.3334 1.3334 h 61.3334 c 0.736 0 1.3334 -0.5974 1.3334 -1.3306 C 69 40.138 62.8506 33.7567 55.0026 33.4714 z M 7.6694 39.9994 c 0 -2.6106 0.7894 -7.7174 1.488 -12.224 c 0.48 -3.1094 0.9094 -5.8774 1.0906 -7.7894 c 2.7946 -0.0666 9.9414 -0.4374 19.0534 -2.3946 c 0.176 0.712 0.4374 1.5494 0.7386 2.4294 l -0.128 0.0426 c -0.6986 0.2346 -1.0746 0.992 -0.8426 1.688 c 0.1866 0.56 0.7066 0.9146 1.264 0.9146 c 0.1386 0 0.28 -0.0214 0.4214 -0.0694 l 0.2454 -0.0826 c 0.416 0.9814 0.88 1.9814 1.4134 2.9786 c -0.5814 0.2934 -0.888 0.9574 -0.6774 1.592 c 0.1866 0.5574 0.7066 0.912 1.264 0.912 c 0.1386 0 0.28 -0.0214 0.4214 -0.0694 l 0.36 -0.12 c 1.456 2.2186 3.2026 4.1866 5.224 5.3466 c 2.7946 1.6054 10.2826 2.776 15.904 2.9786 c 3.9306 0.1414 7.3066 2.1786 9.3546 5.1974 H 7.6694 V 39.9994 z M 7.6694 46.666 v -2.6666 h 57.944 c 0.304 0.8534 0.5466 1.736 0.6506 2.6666 H 7.6694 z"
+      />
+
+      <!-- Shoe sole fill (under the outline) -->
+      <path
+        class="fill"
+        d="M 7.6694 46.666 v -2.6666 h 57.944 c 0.304 0.8534 0.5466 1.736 0.6506 2.6666 H 7.6694 z"/>
+
+      <!-- Diagonal stripes -->
+      <line x1="25" y1="20" x2="10" y2="35" class="line" stroke="currentColor" stroke-width="1.5" />
+      <line x1="30" y1="22" x2="11" y2="40" class="line" stroke="currentColor" stroke-width="1.5" />
+
+      <!-- Filled circle behind the baseball -->
+      <circle class="fill" cx="54" cy="16" r="15" />
+
+      <path
+        class="line"
+        fill="currentColor"
+        d="M 47.2492 6.0773 C 49.5822 8.7207 51 12.1955 51 16 C 51 19.8045 49.5822 23.2794 47.2492 25.9227 C 49.1726 27.2341 51.4958 28 54 28 C 56.5042 28 58.8274 27.2341 60.7507 25.9227 C 58.4178 23.2794 57 19.8045 57 16 C 57 12.1955 58.4178 8.7207 60.7507 6.0773 C 58.8274 4.7658 56.5042 4 54 4 C 51.4958 4 49.1726 4.7658 47.2492 6.0773 Z M 63 8.0624 C 61.1316 10.1789 60 12.9566 60 16 C 60 19.0435 61.1316 21.8212 63 23.9375 C 64.8684 21.8212 66 19.0435 66 16 C 66 12.9566 64.8684 10.1789 63 8.0624 Z M 45 23.9375 C 46.8684 21.8212 48 19.0435 48 16 C 48 12.9566 46.8684 10.1789 45 8.0624 C 43.1316 10.1789 42 12.9566 42 16 C 42 19.0435 43.1316 21.8212 45 23.9375 Z M 43.9996 4.8198 C 46.6524 2.4455 50.1592 1 54 1 C 57.8407 1 61.3476 2.4455 64.0003 4.8198 C 67.0666 7.5643 69 11.5574 69 16 C 69 20.4427 67.0666 24.4357 64.0003 27.1802 C 61.3476 29.5545 57.8407 31 54 31 C 50.1592 31 46.6524 29.5545 43.9996 27.1802 C 40.9333 24.4357 39 20.4427 39 16 C 39 11.5574 40.9333 7.5643 43.9996 4.8198 Z"
+      />
+    </g>
+  </g>
 </template>

package/src/components/atoms/icons/Asd20AwardSvg.vue

@@ -1,4 +1,4 @@
-<template>
+<!-- <template>
   <g>
     <path class="fill" d="M10 6h12v6a6 6 0 0 1-6 6 6 6 0 0 1-6-6z" /><path
       class="line"
@@ -6,4 +6,34 @@
       d="M24 5V4H8v1H4v7a5 5 0 0 0 5 5h.76A8 8 0 0 0 14 19.74V24h-3v4h10v-4h-3v-4.26A8 8 0 0 0 22.24 17H23a5 5 0 0 0 5-5V5zm0 3h1v4a2 2 0 0 1-1 1.73V8zM8 12v1.73A2 2 0 0 1 7 12V8h1zm1 4a4 4 0 0 1-4-4V6h3v1H6v5a3 3 0 0 0 2.57 3 9.47 9.47 0 0 0 .43.91zm11 9v2h-8v-2zm-5-1v-4.07a7.18 7.18 0 0 0 2 0V24zm1-5a7 7 0 0 1-7-7V5h14v7a7 7 0 0 1-7 7zm11-7a4 4 0 0 1-4 4v-.13a9.47 9.47 0 0 0 .43-.91A3 3 0 0 0 26 12V7h-2V6h3zM16.88 9.79L16 7l-.88 2.79H12.2l2.37 1.7-.92 2.78L16 12.5l2.35 1.74-.92-2.78 2.37-1.7z"
     />
   </g>
+</template> -->
+
+<template>
+  <g
+    viewBox="0 0 32 40"
+    width="128"
+    height="160"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <!-- 3/4 Circle badge outline (open at bottom) -->
+    <path
+      d="M6 28 a15 15 0 1 1 20 0"
+      fill="none"
+      class="line"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
+    />
+    <!-- Main award shape (outline color) -->
+    <path
+      class="line"
+      fill="currentColor"
+      d="M20.295 16.944l2.516-.479-.608-2.259 1.911-1.508L22.42 10.891l.917-2.461-2.566-.696L20.295 5.13 17.73 6.105 15.863 4l-1.74 1.955L11.477 4.92 10.911 7.507 8.305 8.212l.827 2.233-1.87 1.807 1.87 1.608-.65 2.324 2.43.583.23.943L8.22 25.921l3.215-.833 2.432 2.288 1.82-6.589 2.002 6.589 2.169-2.086 3.559.148-3.303-7.767L20.295 16.944zM13.534 25.726l-1.858-1.924-2.12.743 1.923-5.189 1.196-.554.944-.381 1.49 1.534L13.534 25.726zM19.702 24.369l-1.621 1.533-1.793-6.034 1.224-1.27 2.405.757 2.361 5.278L19.702 24.369z"
+    />
+    <!-- Medal center (fill color) -->
+    <ellipse cx="15.686" cy="12.058" rx="3.857" ry="3.861" class="fill"/>
+    <!-- Outline for medal center (line color) -->
+    <ellipse cx="15.686" cy="12.058" rx="3.857" ry="3.861" class="line" fill="none" stroke="currentColor" stroke-width="1"/>
+  </g>
 </template>
+

package/src/components/atoms/icons/Asd20BellSvg.vue

@@ -1,4 +1,4 @@
-<template>
+<!-- <template>
   <g>
     <path class="fill" d="M16 7a6 6 0 0 1 6 6v7H10v-7a6 6 0 0 1 6-6z" /><path
       class="line"
@@ -10,4 +10,35 @@
       d="M8 21h16v1H8zM18 24a4 4 0 0 1-8 0z"
     />
   </g>
+</template> -->
+
+<template>
+  <g
+    viewBox="0 0 32 40"
+    width="128"
+    height="160"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <!-- 3/4 Circle outline (open at bottom) -->
+    <path
+      d="M6 28 a15 15 0 1 1 20 0"
+      fill="none"
+      class="line"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
+    />
+    <!-- Alert circle (fill and outlined) -->
+    <circle cx="16.2" cy="16.6" r="9" class="fill" stroke="currentColor" stroke-width="2" />
+    <!-- Exclamation mark (tapered bar, wider at top) -->
+    <polygon
+      points="15,11 17.6,11 16.7,19 15.9,19"
+      class="line"
+      fill="currentColor"
+    />
+    <!-- Dot -->
+    <circle cx="16.3" cy="21.4" r="1.2" class="line" fill="currentColor"/>
+  </g>
 </template>
+
+

package/src/components/atoms/icons/Asd20BusSvg.vue

@@ -1,4 +1,4 @@
-<template>
+<!-- <template>
   <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32">
     <g>
       <path
@@ -32,4 +32,48 @@
       />
     </g>
   </svg>
+</template> -->
+
+<template>
+  <g viewBox="0 0 32 40" xmlns="http://www.w3.org/2000/svg">
+    <!-- 3/4 arc outline (open at bottom) -->
+    <path
+      d="M6 28 a15 15 0 1 1 20 0"
+      fill="none"
+      class="line"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
+    />
+
+    <!-- Scale & center the original bus drawing inside the arc -->
+    <g transform="translate(5,6) scale(0.18)">
+      <!-- Bus outline (stroke only so windshield can be colored) -->
+      <path
+        class="line"
+        fill="none"
+        stroke="currentColor"
+        stroke-width="7"
+        stroke-linecap="round"
+        stroke-linejoin="round"
+        d="M110.8,103.6h-7.6V114c0,3.6-2.9,6.5-6.5,6.5h-9c-3.6,0-6.5-2.9-6.5-6.5v-10.3H41.5V114c0,3.6-2.9,6.5-6.5,6.5
+           h-9c-3.6,0-6.5-2.9-6.5-6.5v-10.3H12v-82c0-7.6,4.4-13.1,13.3-16.5c17.6-6.9,54.6-6.9,72.3,0c8.9,3.4,13.3,8.9,13.3,16.5V103.6 
+           L110.8,103.6L110.8,103.6z M118.6,40.4h-3.8V62h3.8c2.4,0,4.3-1.9,4.3-4.3V44.7C122.9,42.3,121,40.4,118.6,40.4L118.6,40.4z 
+           M4.3,40.4h3.8V62H4.3C1.9,62,0,60.1,0,57.7V44.7C0,42.3,1.9,40.4,4.3,40.4L4.3,40.4z M46.4,8.6h30.1c0.9,0,1.6,0.7,1.6,1.6v5.2 
+           c0,0.9-0.7,1.6-1.6,1.6H46.4c-0.9,0-1.6-0.7-1.6-1.6v-5.2C44.8,9.3,45.5,8.6,46.4,8.6L46.4,8.6z M22.9,23.2h76.7 
+           c1,0,1.9,0.9,1.9,1.9v42.8c0,1-0.9,1.9-1.9,1.9H22.9c-1,0-1.9-0.9-1.9-1.9V25.1C21,24.1,21.8,23.2,22.9,23.2L22.9,23.2L22.9,23.2 
+           L22.9,23.2z M98.6,84.9c0-1.9-0.7-3.6-2-4.9c-1.3-1.3-3-2-4.9-2c-1.9,0-3.5,0.7-4.9,2c-1.4,1.3-2,3-2,4.9c0,1.9,0.7,3.5,2,4.8 
+           c1.4,1.3,3,2,4.9,2c1.9,0,3.6-0.7,4.9-2C98,88.4,98.6,86.8,98.6,84.9L98.6,84.9L98.6,84.9L98.6,84.9z M38.1,84.9 
+           c0-1.9-0.7-3.6-2-4.9c-1.3-1.3-3-2-4.9-2c-1.9,0-3.6,0.7-4.9,2c-1.3,1.3-2,3-2,4.9c0,1.9,0.6,3.5,2,4.8c1.3,1.3,3,2,4.9,2 
+           c2,0,3.6-0.7,4.9-2C37.4,88.4,38.1,86.8,38.1,84.9L38.1,84.9L38.1,84.9L38.1,84.9z"
+      />
+
+      <!-- Windshield (colored). This matches the bus's main window area. -->
+      <rect
+        class="fill"
+        x="22.9" y="23.2" width="76.7" height="42.8" rx="6"
+      />
+    </g>
+  </g>
 </template>
+

package/src/components/atoms/icons/Asd20CalendarAltSvg.vue

@@ -1,4 +1,4 @@
-<template>
+<!-- <template>
   <g>
     <path class="fill" d="M6 10h20v14H6z" /><path
       class="line"
@@ -18,4 +18,43 @@
       d="M16 17h7v1h-7zM11 11h1v12h-1z"
     /><path class="line" fill="currentColor" d="M10 22h3v1h-3zM10 11h2v1h-2z" />
   </g>
+</template> -->
+
+<template>
+  <g
+    viewBox="0 0 32 40"
+    width="128"
+    height="160"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <!-- 3/4 Circle outline (open at bottom) -->
+    <path
+      d="M6 28 a15 15 0 1 1 20 0"
+      fill="none"
+      class="line"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
+    />
+    <!-- Calendar main body (rounded rectangle, outline only) -->
+    <rect x="7" y="10" width="18" height="15" rx="3" class="line" fill="none" stroke="currentColor" stroke-width="2"/>
+    <!-- Calendar header bar (fill color) -->
+    <rect x="6" y="10" width="20" height="4" rx="2" class="fill"/>
+    <!-- Calendar "rings" (outline color) -->
+    <rect x="9" y="7" width="2.3" height="4" rx="1" class="line" fill="currentColor"/>
+    <rect x="21" y="7" width="2.3" height="4" rx="1" class="line" fill="currentColor"/>
+    <!-- Calendar number "31" (fill color, centered, bold) -->
+    <text
+      x="16"
+      y="20"
+      text-anchor="middle"
+      alignment-baseline="middle"
+      font-size="10"
+      font-family="sans-serif"
+      font-weight="bold"
+      class="fill"
+      style="pointer-events:none;"
+    >31</text>
+  </g>
 </template>
+

package/src/components/atoms/icons/Asd20CalendarSvg.vue

@@ -1,4 +1,4 @@
-<template>
+<!-- <template>
   <g>
     <path class="fill" d="M6 10h20v14H6z" /><path
       class="line"
@@ -14,4 +14,41 @@
       d="M26 26v1H6v-1h20m1-1H5v3h22v-3zM4 8h24v1H4z"
     />
   </g>
+</template> -->
+
+<template>
+  <g
+    viewBox="0 0 32 40"
+    width="128"
+    height="160"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <!-- 3/4 Circle outline (open at bottom) -->
+    <path
+      d="M6 28 a15 15 0 1 1 20 0"
+      fill="none"
+      class="line"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
+    />
+    <!-- Calendar main body (rounded rectangle, outline only) -->
+    <rect x="7" y="10" width="18" height="15" rx="3" class="line" fill="none" stroke="currentColor" stroke-width="2"/>
+    <!-- Calendar header bar (fill color) -->
+    <rect x="6" y="10" width="20" height="4" rx="2" class="fill"/>
+    <!-- Calendar "rings" (outline color) -->
+    <rect x="9" y="7" width="2.3" height="4" rx="1" class="line" fill="currentColor"/>
+    <rect x="21" y="7" width="2.3" height="4" rx="1" class="line" fill="currentColor"/>
+    <!-- Calendar squares for days (fill color) -->
+    <rect x="10" y="16" width="2.2" height="2.2" rx="0.6" class="fill"/>
+    <rect x="13.2" y="16" width="2.2" height="2.2" rx="0.6" class="fill"/>
+    <rect x="16.4" y="16" width="2.2" height="2.2" rx="0.6" class="fill"/>
+    <rect x="19.6" y="16" width="2.2" height="2.2" rx="0.6" class="fill"/>
+
+    <rect x="10" y="19.4" width="2.2" height="2.2" rx="0.6" class="fill"/>
+    <rect x="13.2" y="19.4" width="2.2" height="2.2" rx="0.6" class="fill"/>
+    <rect x="16.4" y="19.4" width="2.2" height="2.2" rx="0.6" class="fill"/>
+    <rect x="19.6" y="19.4" width="2.2" height="2.2" rx="0.6" class="fill"/>
+  </g>
 </template>
+

package/src/components/atoms/icons/Asd20CommitteeSvg.vue

@@ -1,4 +1,4 @@
-<template>
+<!-- <template>
   <g>
     <path
       class="fill"
@@ -16,4 +16,58 @@
         d="M19 7a3 3 0 1 0-3 3 3 3 0 0 0 3-3zm-3 2a2 2 0 1 1 2-2 2 2 0 0 1-2 2zm0 1a4 4 0 0 0-4 3.57c.33 0 .67-.09 1-.12a3 3 0 0 1 5.88 0c.35 0 .69.08 1 .12A4 4 0 0 0 16 10z"
     /></g>
   </g>
+</template> -->
+
+<template>
+  <g
+    viewBox="0 0 32 40"
+    width="128"
+    height="160"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+    <!-- 3/4 Circle outline (open at bottom) -->
+    <path
+      d="M6 28 a15 15 0 1 1 20 0"
+      fill="none"
+      class="line"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
+    />
+    <g transform="translate(3,3) scale(0.8)">
+      <!-- Table (fill) -->
+      <path
+        class="fill"
+        d="M16 15c5.72 0 10 1.66 10 3.15s-4.28 3.14-10 3.14-10-1.66-10-3.14S10.28 15 16 15M16 26.17c5 0 7.74-1.58 8-2.21v-.89a25.13 25.13 0 0 1-8 1.22 25.13 25.13 0 0 1-8-1.22V24c.26.59 3 2.17 8 2.17z"
+      />
+      <!-- Left person/group -->
+      <path
+        class="line"
+        stroke="currentColor"
+        stroke-width="0.75"
+        d="M11 8.29a3 3 0 1 0-3 3 3 3 0 0 0 3-3zm-3 2a2 2 0 1 1 2-2 2 2 0 0 1-2 2zm0 1a4 4 0 0 0-4 4v3a2.79 2.79 0 0 1 1-2v-1a3 3 0 0 1 5.6-1.46c.34-.07.68-.14 1-.19A4 4 0 0 0 8 11.29z"
+      />
+      <!-- Right person/group -->
+      <path
+        class="line"
+        stroke="currentColor"
+        stroke-width="0.75"
+        d="M27 8.29a3 3 0 1 0-3 3 3 3 0 0 0 3-3zm-3 2a2 2 0 1 1 2-2 2 2 0 0 1-2 2zm0 1a4 4 0 0 0-3.63 2.35c.35 0 .69.12 1 .19A3 3 0 0 1 27 15.29v1a2.79 2.79 0 0 1 1 2v-3a4 4 0 0 0-4-4z"
+      />
+      <!-- Central person/group -->
+      <path
+        class="line"
+        stroke="currentColor"
+        stroke-width="0.75"
+        d="M19 7a3 3 0 1 0-3 3 3 3 0 0 0 3-3zm-3 2a2 2 0 1 1 2-2 2 2 0 0 1-2 2zm0 1a4 4 0 0 0-4 3.57c.33 0 .67-.09 1-.12a3 3 0 0 1 5.88 0c.35 0 .69.08 1 .12A4 4 0 0 0 16 10z"
+      />
+      <!-- Table outline & more details -->
+      <path
+        class="line"
+        stroke="currentColor"
+        stroke-width="0.75"
+        d="M28 18.29c0-2.76-5.37-5-12-5s-12 2.24-12 5a3.53 3.53 0 0 0 2 2.76V24c0 2.3 4.48 4.17 10 4.17S26 26.3 26 24v-2.95a3.53 3.53 0 0 0 2-2.76zM25 24c0 1.29-3.51 3.17-9 3.17S7 25.29 7 24v-2.41a21.89 21.89 0 0 0 9 1.7 21.89 21.89 0 0 0 9-1.7zm-9-1.71c-6.3 0-11-2.11-11-4s4.7-4 11-4 11 2.11 11 4-4.7 4-11 4z"
+      />
+    </g>
+  </g>
 </template>

package/src/components/atoms/icons/Asd20ContactSvg.vue

@@ -0,0 +1,27 @@
+<template>
+  <g
+    viewBox="0 0 32 40"
+    width="128"
+    height="160"
+    xmlns="http://www.w3.org/2000/svg"
+  >
+
+    <!-- Document, using the mask so lines are "see through" -->
+    <rect
+      x="8.5" y="8" width="14" height="19" rx="2.2"
+      class="line"
+      stroke="currentColor"
+      stroke-width="2"
+      fill="none"
+    />
+    <rect x="11" y="10" width="9" height="0.5" rx="0.6" class="line" stroke="currentColor" stroke-width="1"/>
+    <rect x="11" y="12" width="9" height="0.5" rx="0.6" class="line" stroke="currentColor" stroke-width="1"/>
+    <rect x="11" y="14" width="9" height="0.5" rx="0.6" class="line" stroke="currentColor" stroke-width="1"/>
+    <!-- <rect x="11" y="19" width="7" height="0.5" rx="0.6" class="line" stroke="currentColor" stroke-width="1"/> -->
+    <!-- Person (body and head, clearly defined) -->
+    <!-- Head -->
+    <circle cx="15.5" cy="18.5" r="2.3" class="fill" fill="currentColor"/>
+    <!-- Body -->
+    <rect x="12" y="21" width="8" height="6" rx="1.3" class="fill" fill="currentColor"/>
+  </g>
+</template>