@onemrvapublic/design-system 18.2.4-develop.1 → 18.2.4-develop.11

package/mat-file-upload/src/components/onemrva-mat-file-upload/onemrva-mat-file-upload.component.scss

@@ -21,6 +21,13 @@
 
   onemrva-mat-file-upload {
     .mat-mdc-form-field-error {
+      margin-bottom: 8px;
+      padding: 8px 1em;
+      background-color: #ffebe6;
+      border-bottom: 1px solid utils.palette($theme, 'error');
+      color: utils.palette($theme, 'error');
+      display: flex;
+      line-height: 1.125;
       &:before {
         //noinspection CssNoGenericFontName
         font-family: 'Material Icons';
@@ -32,14 +39,6 @@
         vertical-align: baseline;
         flex: 0 0 16px;
       }
-
-      margin-bottom: 8px;
-      padding: 8px 1em;
-      background-color: #ffebe6;
-      border-bottom: 1px solid utils.palette($theme, 'error');
-      color: utils.palette($theme, 'error');
-      display: flex;
-      line-height: 1.125;
     }
     ul {
       list-style: none;
@@ -55,6 +54,15 @@
   }
 
   .onemrva-mat-file-upload-drop-area {
+    padding: $spacer * 3;
+    text-align: left;
+    border: dashed 2px utils.palette($theme, 'grayscale', 500);
+
+    position: relative;
+    border-radius: 16px;
+    transition:
+      background-color 0.3s ease-in-out,
+      border 0.3s ease-in-out;
     mat-icon {
       &.filled {
         vertical-align: bottom;
@@ -74,19 +82,10 @@
         color: utils.palette($theme, 'warn', 600);
       }
     }
-    padding: $spacer * 3;
-    text-align: left;
-    border: dashed 2px utils.palette($theme, 'grayscale', 500);
 
     &.fu-error {
       border: dashed 2px utils.palette($theme, 'error', 600);
     }
-
-    position: relative;
-    border-radius: 16px;
-    transition:
-      background-color 0.3s ease-in-out,
-      border 0.3s ease-in-out;
     mat-icon.onemrva-upload {
       color: utils.palette($theme, 'grayscale', 700);
       width: 60px;

package/mat-message-box/src/onemrva-mat-message-box.component.scss

@@ -12,6 +12,7 @@
     position: relative;
     padding: 8px 8px 8px 36px;
     border-radius: 4px;
+    font-size: 14px;
     gap: 16px;
 
     @include mat.m2-typography-level(map.get($theme, typography), 'caption');

package/mat-notification/src/_onemrva-mat-notification.component.scss

@@ -15,7 +15,7 @@
       position: relative;
 
       .onemrva-mat-notification-content {
-        padding: 16px 0 16px 32px;
+        padding: 16px 0 16px 48px;
         &:before {
           position: absolute;
           top: 16px;

package/mat-table-of-content/src/_onemrva-mat-table-of-content.component.scss

@@ -8,36 +8,38 @@
   $highlighted-anchor-color: utils.palette($theme, 'grayscale', 900);
   $color-checkmark: utils.palette($theme, 'success', 600);
   .toc-content {
-    display: inline-block;
+    display: block;
 
-    padding-left: 280px;
+    @media screen {
+      padding-left: 280px;
 
-    @media (min-width: 1900px) {
-      padding-left: 240px;
-    }
-    @media (min-width: 1950px) {
-      padding-left: 200px;
-    }
-    @media (min-width: 2000px) {
-      padding-left: 170px;
-    }
-    @media (min-width: 2050px) {
-      padding-left: 140px;
-    }
-    @media (min-width: 2100px) {
-      padding-left: 110px;
-    }
-    @media (min-width: 2150px) {
-      padding-left: 80px;
-    }
-    @media (min-width: 2200px) {
-      padding-left: 50px;
-    }
-    @media (min-width: 2250px) {
-      padding-left: 20px;
-    }
-    @media (min-width: 2300px) {
-      padding-left: inherit;
+      @media (min-width: 1900px) {
+        padding-left: 240px;
+      }
+      @media (min-width: 1950px) {
+        padding-left: 200px;
+      }
+      @media (min-width: 2000px) {
+        padding-left: 170px;
+      }
+      @media (min-width: 2050px) {
+        padding-left: 140px;
+      }
+      @media (min-width: 2100px) {
+        padding-left: 110px;
+      }
+      @media (min-width: 2150px) {
+        padding-left: 80px;
+      }
+      @media (min-width: 2200px) {
+        padding-left: 50px;
+      }
+      @media (min-width: 2250px) {
+        padding-left: 20px;
+      }
+      @media (min-width: 2300px) {
+        padding-left: inherit;
+      }
     }
 
     .onemrva-mat-toc {
@@ -48,7 +50,7 @@
       bottom: 0;
       overflow: auto;
       background-color: $bckgr-color;
-      padding: 16px 8px 8px 32px;
+      padding: 32px 8px 8px 32px;
       box-sizing: border-box;
 
       .onemrva-mat-toc-title {

package/mat-task-list/src/onemrva-mat-task-list.component.scss

@@ -109,13 +109,12 @@
         }
 
         span {
-          mat-icon {
-            color: utils.palette($theme, 'grayscale', '500-contrast');
-          }
-
           color: utils.palette($theme, 'grayscale', '500-contrast');
           background: utils.palette($theme, 'grayscale', 400);
           outline: 1px solid utils.palette($theme, 'grayscale', 400);
+          mat-icon {
+            color: utils.palette($theme, 'grayscale', '500-contrast');
+          }
         }
       }
       .onemrva-mat-task-title,
@@ -139,12 +138,12 @@
     }
 
     span {
-      mat-icon {
-        color: utils.palette($theme, $color, '500-contrast');
-      }
       color: utils.palette($theme, $color, '500-contrast');
       background: utils.palette($theme, $color, $weight);
       outline: 1px solid utils.palette($theme, $color, $weight);
+      mat-icon {
+        color: utils.palette($theme, $color, '500-contrast');
+      }
     }
   }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@onemrvapublic/design-system",
-  "version": "18.2.4-develop.1",
+  "version": "18.2.4-develop.11",
   "description": "Design System Onem/Rva without theme included",
   "publishConfig": {
     "access": "public"