@onemrvapublic/design-system-theme 17.9.1-develop.1 → 17.12.6

package/components/_checkbox.scss

@@ -1,14 +1,18 @@
-@use "@angular/material" as mat;
-@use "sass:map";
-@use "./µ";
-@import "../utilities/variables";
+@use '@angular/material' as mat;
+@use 'sass:map';
+@use './µ';
+@import '../utilities/variables';
 
 @mixin theme($theme) {
-
   @include mat.checkbox-base($theme);
   @include mat.checkbox-theme($theme);
 
   .mat-mdc-checkbox {
+    .mdc-checkbox {
+      .mdc-checkbox__ripple {
+        display: none;
+      }
+    }
     &.mat-accent {
       .mdc-checkbox__native-control:enabled:checked,
       .mdc-checkbox__native-control:enabled:indeterminate {
@@ -68,7 +72,6 @@
       .mdc-checkbox__native-control:enabled:checked,
       .mdc-checkbox__native-control:enabled:indeterminate {
         ~ .mdc-checkbox__background {
-
           .mdc-checkbox__checkmark {
             width: calc(100% - 4px);
             top: 2px;
@@ -93,7 +96,7 @@
     label {
       @include µ.label-button($theme);
       font-family: mat.font-family(
-        map.get($theme, "typography"),
+        map.get($theme, 'typography'),
         label-button
       ); // HWKTMP For some reason, the font family is not taken into account from configuration
     }

package/components/_table.scss

@@ -8,6 +8,14 @@
   @include mat.table-theme($theme);
 
   .mat-mdc-table {
+    th.cdk-column-check {
+      width: 50px;
+      .mat-mdc-checkbox {
+        .mdc-checkbox {
+          padding: 6px;
+        }
+      }
+    }
     th.mat-mdc-header-cell {
       font-weight: 600;
       border-bottom: 2px solid µ.grayscale($theme, 200);
@@ -110,6 +118,9 @@
       tr {
         &:nth-child(even) {
           background-color: µ.primary($theme, 50);
+          a {
+            color: µ.primary($theme, 700);
+          }
         }
       }
     }

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@onemrvapublic/design-system-theme",
-    "version": "v17.9.1-develop.1",
+    "version": "v17.12.6",
     "publishConfig": {
         "access": "public"
     },

package/utilities/_fonts.scss

@@ -20,34 +20,30 @@
   $typography: map.get($onemrva-theme, 'typography');
 
   h1 {
-    font-family: mat.font-family($typography, headline-5);
-    color: µ.grayscale($onemrva-theme, 900);
+    @include mat.typography-level($typography, 'headline-4');
   }
   h2 {
-    font-family: mat.font-family($typography, headline-6);
-    color: µ.grayscale($onemrva-theme, 900);
+    @include mat.typography-level($typography, 'headline-5');
   }
   h3 {
-    font-family: mat.font-family($typography, subtitle-1);
-    color: µ.grayscale($onemrva-theme, 900);
+    @include mat.typography-level($typography, 'headline-6');
   }
   h4 {
     @include mat.typography-level($typography, 'mat-h4');
-    font-family: mat.font-family($typography, 'mat-h4');
     color: µ.grayscale($onemrva-theme, 900);
   }
   h5 {
-    font-family: mat.font-family($typography, subtitle-1);
-    font-weight: 600;
+    font-family: mat.font-family($typography, 'mat-h4');
     font-size: 18px;
+    font-style: normal;
+    font-weight: 600;
     line-height: 32px;
-    color: µ.grayscale($onemrva-theme, 900);
   }
   h6 /* always the case bu makes this rule more specific than the default one */ {
-    font-family: mat.font-family($typography, subtitle-1);
-    font-weight: 600;
+    font-family: mat.font-family($typography, 'mat-h4');
     font-size: 16px;
-    line-height: 28px;
-    color: µ.grayscale($onemrva-theme, 900);
+    font-style: normal;
+    font-weight: 600;
+    line-height: 28px; /* 175% */
   }
 }

package/utilities/_variables.scss

@@ -1,6 +1,6 @@
-@use "sass:map";
-@use "@angular/material" as mat;
-@use "palettes";
+@use 'sass:map';
+@use '@angular/material' as mat;
+@use 'palettes';
 
 $onemrva-accent-gradient: transparent
   linear-gradient(90deg, #de2174 0%, #eb142a 100%) 0% 0% no-repeat padding-box;
@@ -11,9 +11,18 @@ $box-shadow: 0px 3px 3px #312f3a29;
 $gap: 8px;
 
 $spacer: 8px !default;
-$spacers: "-0" 0, "-2xs" $spacer * 0.25, "-xs" $spacer * 0.5, "-s" $spacer,
-  "" $spacer, "-m" $spacer * 2, "-l" $spacer * 3, "-xl" $spacer * 4,
-  "-2xl" $spacer * 5, "-3xl" $spacer * 7, "-auto" "auto";
+$spacers:
+  '-0' 0,
+  '-2xs' $spacer * 0.25,
+  '-xs' $spacer * 0.5,
+  '-s' $spacer,
+  '' $spacer,
+  '-m' $spacer * 2,
+  '-l' $spacer * 3,
+  '-xl' $spacer * 4,
+  '-2xl' $spacer * 5,
+  '-3xl' $spacer * 7,
+  '-auto' 'auto';
 
 $breakpoints: (
   xsmall: (
@@ -55,10 +64,10 @@ $onemrva-typography: mat.define-typography-config(
     mat.define-typography-level(29px, 51px, 600, $font-family: Poppins),
   // Section heading corresponding to the <h1> tag.                           CSS: .mat-h1 or .mat-headline-5           Native element: <h1>
   $headline-5:
-    mat.define-typography-level(29px, 51px, 600, $font-family: Poppins),
+    mat.define-typography-level(26px, 46px, 600, $font-family: Poppins),
   // Section heading corresponding to the <h2> tag.                           CSS: .mat-h2 or .mat-headline-6           Native element: <h2>
   $headline-6:
-    mat.define-typography-level(26px, 46px, 600, $font-family: Poppins),
+    mat.define-typography-level(23px, 40px, 600, $font-family: Poppins),
   // Section heading corresponding to the <h3> tag.                           CSS: .mat-h3 or .mat-subtitle-1           Native element: <h3>
   $subtitle-1:
     mat.define-typography-level(23px, 40px, 600, $font-family: Poppins),
@@ -68,7 +77,7 @@ $onemrva-typography: mat.define-typography-config(
       16px,
       26px,
       600,
-      $font-family: "Source Sans Pro"
+      $font-family: 'Source Sans Pro'
     ),
   // Why would angular map body-1 and h4 on the same typography??? Work around: mat-h4 (see below)           CSS: .mat-h4 or .mat-body-1               Native element: <h4>
   $body-1:
@@ -76,7 +85,7 @@ $onemrva-typography: mat.define-typography-config(
       16px,
       26px,
       400,
-      $font-family: "Source Sans Pro"
+      $font-family: 'Source Sans Pro'
     ),
   // Bolder body text.                                                        CSS: .mat-body or .mat-body-2
   $body-2:
@@ -84,7 +93,7 @@ $onemrva-typography: mat.define-typography-config(
       16px,
       26px,
       400,
-      $font-family: "Source Sans Pro"
+      $font-family: 'Source Sans Pro'
     ),
   // Smaller body and hint text.                                              CSS: .mat-small or .mat-caption
   $caption:
@@ -92,16 +101,10 @@ $onemrva-typography: mat.define-typography-config(
       14px,
       21px,
       400,
-      $font-family: "Source Sans Pro"
+      $font-family: 'Source Sans Pro'
     ),
   // Buttons and anchors.
-  $button:
-    mat.define-typography-level(
-      14px,
-      21px,
-      500,
-      $font-family: "Poppins"
-    )
+  $button: mat.define-typography-level(14px, 21px, 500, $font-family: 'Poppins')
 );
 
 $onemrva-typography: map.merge(