qms-angular 1.1.1 → 1.1.4

package/src/lib/components/button/button-toggle.scss

@@ -120,7 +120,7 @@
 
     &.qms-button-toggle-disabled {
       cursor: default !important;
-      background: #e4e4e4 !important;
+      background: theme-apply($disabled) !important;
       color: rgba(0, 0, 0, 0.38) !important;
       user-select: none;
 

package/src/lib/components/list/_list-base.scss

@@ -5,7 +5,7 @@ $leading-icon: 24px;
 $leading-icon-padding: 4px;
 $subtitle-color: theme-apply($default-color);
 $subtitle-weight: 600;
-$border-bottom-item: #e0e0e0;
+$border-bottom-item: theme-apply($other-divider);;
 $size-caption: 0.75rem;
 $margin-icon: 0.75rem;
 $size-sm: 0.875rem;

package/src/lib/components/related/list-other-related/list-related.component.scss

@@ -47,6 +47,8 @@
 
         .material-icons-outlined {
           font-size: 13px;
+          height: 13px;
+          width: 13px;
         }
       }
 
@@ -143,6 +145,7 @@
       color: black(0.6);
       font-weight: 400;
       line-height: 22px;
+      margin: 0;
     }
 
     .trailing-box {

package/src/lib/components/rich-text/rich-text.scss

@@ -23,7 +23,7 @@
   .ck-disabled {
     .ck.ck-toolbar,
     .ck.ck-editor__main > .ck-editor__editable {
-      background-color: #e4e4e4;
+      background-color: theme-apply($disabled);
       pointer-events: none;
     }
 

package/src/lib/components/substance-conflict/substance-conflict.component.scss

@@ -58,7 +58,7 @@
   }
 
   .button-view {
-    border: 1px solid #e4e4e4;
+    border: 1px solid theme-apply($disabled);
     border-radius: 5px;
     padding: 10px;
     cursor: pointer !important;
@@ -69,7 +69,7 @@
     }
 
     &.cancel {
-      background-color: #e4e4e4;
+      background-color: theme-apply($disabled);
       color: #000000;
     }
 

package/src/lib/qms-ckeditor-components/qms-ckeditor.component.scss

@@ -64,7 +64,7 @@
   .ck-disabled {
     .ck.ck-toolbar,
     .ck.ck-editor__main > .ck-editor__editable {
-      background-color: #e4e4e4;
+      background-color: theme-apply($disabled);
       pointer-events: none;
     }
 

package/src/themes/core/_app-bar.scss

@@ -3,13 +3,13 @@
 @import "../theme/mixins";
 
 .qms-app-bar-dark {
-    background: theme-apply($-qms-app-bar-dark-background-color);
+    background: theme-apply($qms-app-bar-dark-background-color);
     width     : 100% !important;
     height    : 56px !important;
 }
 
 .qms-app-bar-light {
-    background: theme-apply($-qms-app-bar-light-background-color);
+    background: theme-apply($qms-app-bar-light-background-color);
     width     : 100% !important;
     height    : 56px !important;
 }

package/src/themes/core/_checkbox.scss

@@ -99,5 +99,11 @@
         border-color: theme-apply($primary);
       }
     }
+
+    &.mat-checkbox-indeterminate {
+      .mat-checkbox-background {
+          background-color: theme-apply($primary);
+      }
+  }
   }
 }

package/src/themes/core/_dialog-new.scss

@@ -0,0 +1,32 @@
+::ng-deep .qms-dialog-container-v2 {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  flex-wrap: nowrap;
+
+  .qms-dialog-header {
+    flex-shrink: 0;
+  }
+
+  .qms-dialog-content {
+    flex-grow: 1;
+    overflow-y: auto;
+    overflow-x: hidden;
+    margin: 0;
+    min-height: 2em;
+  }
+
+  .qms-dialog-footer {
+    margin-top: 10px;
+    flex-shrink: 0;
+
+    &.qms-dialog-footer-align-center {
+      justify-content: center;
+    }
+
+    &.qms-dialog-footer-align-start {
+      justify-content: start;
+    }
+  }
+}

package/src/themes/core/_table-pure-gap.scss

@@ -0,0 +1,82 @@
+@import "../theme/variable";
+@import "../theme/mixins";
+@import "typography";
+
+table.mat-table {
+  &.qms-table {
+    width: 100%;
+    border-collapse: separate;
+    border-spacing: 0 8px;
+    background-color: transparent;
+    font-family: Open Sans;
+
+    .mat-header-cell {
+      font-size: 14px;
+      font-weight: 600;
+      color: theme-apply($ws-text-secondary);
+
+      .mat-checkbox.qms-group-options {
+        padding: 5px 15px 5px 5px;
+      }
+    }
+
+    .mat-header-row {
+      height: 32px;
+    }
+
+    th {
+      border-bottom: none;
+    }
+
+    td {
+      border-top: 1px solid theme-apply($disabled);
+    }
+
+    &.border-left {
+      border-left: 1px solid theme-apply($disabled);
+    }
+
+    .border-right {
+      border-right: 1px solid theme-apply($disabled);
+    }
+
+    td.mat-cell {
+      padding: 10px 0 10px 0;
+      border-bottom: 1px solid theme-apply($other-divider);
+      border-top: 1px solid theme-apply($other-divider);
+      background-color: #fff;
+      color: theme-apply($ws-text-primary);
+      font-weight: 400;
+    }
+
+    td.mat-cell:first-child {
+      border-left: 1px solid theme-apply($other-divider);
+      border-bottom-left-radius: 4px;
+      border-top-left-radius: 4px;
+
+      .mat-checkbox.qms-group-options {
+        border-right: 1px solid theme-apply($other-divider);
+        border-radius: 0px;
+        padding: 5px 15px 5px 5px;
+      }
+    }
+
+    td.mat-cell:last-child {
+      border-right: 1px solid theme-apply($other-divider);
+      border-bottom-right-radius: 4px;
+      border-top-right-radius: 4px;
+    }
+
+    th.mat-header-cell:last-of-type,
+    td.mat-cell:last-of-type,
+    td.mat-footer-cell:last-of-type {
+      padding-right: 16px;
+    }
+
+    th.mat-header-cell:first-of-type,
+    td.mat-cell:first-of-type,
+    td.mat-footer-cell:first-of-type {
+      padding-left: 16px;
+    }
+  }
+}

package/src/themes/core/_table.scss

@@ -33,7 +33,7 @@
 
         &:hover, &:focus-visible {
             outline: unset;
-            color: #1954A9;
+            color: theme-apply($primary);
             text-decoration: underline;
         }
     }
@@ -57,7 +57,7 @@
     .qms-table-row {
         padding: 8px 0 8px 20px;
         background: #FFFFFF;
-        border: 1px solid #E0E0E0;
+        border: 1px solid theme-apply($other-divider);;
         border-radius: 4px;
         margin-top: 8px;
         min-height: 40px;
@@ -104,7 +104,7 @@
         }
 
         &-disabled {
-            background: #E4E4E4;
+            background: theme-apply($disabled);
             color: rgba(0, 0, 0, 0.38);
             pointer-events: none;
 
@@ -203,7 +203,7 @@
         }
 
         .qms-row-detail {
-            border: 1px solid #E0E0E0;
+            border: 1px solid theme-apply($other-divider);;
             border-top: none;
         }
     }
@@ -218,7 +218,7 @@
         }
 
         .qms-collapse-group {
-            border: 1px solid #E0E0E0;
+            border: 1px solid theme-apply($other-divider);;
             border-left: 4px solid theme-apply($primary-light-32-opacity);
             border-bottom-left-radius: 4px;
             border-bottom-right-radius: 4px;

package/src/themes/theme/_variable.scss

@@ -30,6 +30,7 @@ $slider-hover-border: --slider-hover-border;
 $slider-focus-border: --slider-focus-border;
 $slider-pressed: --slider-pressed;
 $disabled-select-input-checked: --disabled-select-input-checked;
+$other-divider: --other-divider;
 
 $error-color: --error-color;
 $success-color: --success-color;
@@ -100,31 +101,32 @@ $tab-primary-background-hover: --tab-primary-background-hover;
 $tab-primary-border: --tab-primary-border;
 $tab-disable-background: --tab-disable-background;
 
-$-qms-app-bar-dark-background-color: --qms-app-bar-dark-background-color;
-$-qms-app-bar-light-background-color: --qms-app-bar-light-background-color;
+$qms-app-bar-dark-background-color: --qms-app-bar-dark-background-color;
+$qms-app-bar-light-background-color: --qms-app-bar-light-background-color;
 
+$ws-text-secondary: --ws-text-secondary;
+$ws-text-primary: --ws-text-primary;
 
 @function black($opacity) {
-  @return rgba(black, $opacity)
-};
+  @return rgba(black, $opacity);
+}
 
 @function white($opacity) {
-  @return rgba(white, $opacity)
+  @return rgba(white, $opacity);
 }
 
-
 $qms-theme-default: (
   $primary: #1954a9,
   $primary-light: #2873df,
   $primary-lighter: #b7daf8,
   $primary-light-3-opacity: #f5faff,
-  $primary-light-6-opacity: #F2F7FD,
-  $primary-light-12-opacity: #E5EEFB,
+  $primary-light-6-opacity: #f2f7fd,
+  $primary-light-12-opacity: #e5eefb,
   $primary-light-24-opacity: rgba(40, 115, 223, 0.24),
   $primary-light-32-opacity: #94baef,
-  $primary-light-38-opacity: #86A5D1,
+  $primary-light-38-opacity: #86a5d1,
   $primary-dark: #144285,
-  $primary-dark-24-opacity: #C8D6EA,
+  $primary-dark-24-opacity: #c8d6ea,
   $secondary: #9e360f,
   $secondary-light: #b63e11,
   $secondary-dark: #872e0d,
@@ -137,7 +139,7 @@ $qms-theme-default: (
   $disabled: #e4e4e4,
   $active: #1954a9,
   $default-color: #323232,
-  $disabled-select-input-checked: #DADADA,
+  $disabled-select-input-checked: #dadada,
   $slider-background: rgba(#1954a9, 0.38),
   $slider-tick-color: rgba(255, 255, 255, 0.38),
   $slider-hover-border: rgba(25, 84, 169, 8%),
@@ -208,8 +210,11 @@ $qms-theme-default: (
   $tab-primary-background-hover: rgba(255, 255, 255, 0.08),
   $tab-primary-border: rgba(255, 255, 255, 0.38),
   $tab-disable-background: rgba(25, 84, 169, 0.12),
-  $-qms-app-bar-dark-background-color: #0d6efd,
-  $-qms-app-bar-light-background-color: #c41e1e,
+  $qms-app-bar-dark-background-color: #0d6efd,
+  $qms-app-bar-light-background-color: #c41e1e,
+  $other-divider: #e0e0e0,
+  $ws-text-secondary: #5a5a5a,
+  $ws-text-primary: #242424,
 );
 
 $qms-theme-pink: (
@@ -217,13 +222,13 @@ $qms-theme-pink: (
   $primary-light: #2873df,
   $primary-lighter: #b7daf8,
   $primary-light-3-opacity: #f5faff,
-  $primary-light-6-opacity: #F2F7FD,
-  $primary-light-12-opacity: #E5EEFB,
+  $primary-light-6-opacity: #f2f7fd,
+  $primary-light-12-opacity: #e5eefb,
   $primary-light-24-opacity: rgba(40, 115, 223, 0.24),
   $primary-light-32-opacity: #94baef,
-  $primary-light-38-opacity: #86A5D1,
+  $primary-light-38-opacity: #86a5d1,
   $primary-dark: #144285,
-  $primary-dark-24-opacity: #C8D6EA,
+  $primary-dark-24-opacity: #c8d6ea,
   $secondary: #9e360f,
   $secondary-light: #b63e11,
   $secondary-dark: #872e0d,
@@ -236,7 +241,7 @@ $qms-theme-pink: (
   $disabled: #e4e4e4,
   $active: #1954a9,
   $default-color: #323232,
-  $disabled-select-input-checked: #DADADA,
+  $disabled-select-input-checked: #dadada,
   $slider-background: rgba(#1954a9, 0.38),
   $slider-tick-color: rgba(255, 255, 255, 0.38),
   $slider-hover-border: rgba(25, 84, 169, 8%),
@@ -307,6 +312,9 @@ $qms-theme-pink: (
   $tab-primary-background-hover: rgba(255, 255, 255, 0.08),
   $tab-primary-border: rgba(255, 255, 255, 0.38),
   $tab-disable-background: rgba(25, 84, 169, 0.12),
-  $-qms-app-bar-dark-background-color: #0d6efd,
-  $-qms-app-bar-light-background-color: #c41e1e,
+  $qms-app-bar-dark-background-color: #0d6efd,
+  $qms-app-bar-light-background-color: #c41e1e,
+  $other-divider: #e0e0e0,
+  $ws-text-secondary: #5a5a5a,
+  $ws-text-primary: #242424,
 );