qms-angular 1.0.27 → 1.0.31

package/src/lib/components/related/popup/related-popup.component.scss

@@ -111,6 +111,52 @@
       }
     }
   }
+
+  .qmslib-related-popup-splitview{
+    background-color: white;
+    border-left: 1px solid #ccc;
+    margin-top: 12px;
+
+    .splitview-header{
+      height: 30px;
+      font-size: 12px;
+      letter-spacing: 1px;
+      font-family: "RALEWAY";
+      font-weight: 600;    
+      display: flex;
+      align-items: center;
+    }
+
+    .mat-checkbox.qms-group-options {
+      padding: 0px;
+    }
+
+    .mat-checkbox.qms-group-options .mat-checkbox-inner-container {
+      margin-right: 11px;
+    }
+
+    .mat-checkbox.qms-group-options.mat-checkbox-checked {
+      background: transparent !important;
+    }
+
+    .expand-node {
+      margin-left: 8px;
+      display: flex;
+      align-items: center;
+      min-height: 40px;
+  
+      .mat-icon {
+        color: black(0.6);
+        margin-right: 17px;
+        min-width: fit-content;
+  
+        svg {
+          display: block;
+          min-width: fit-content;
+        }
+      }
+    }
+  }
 }
 
 cdk-virtual-scroll-viewport {

package/src/lib/components/table/table.scss

@@ -80,30 +80,8 @@ $heightAction: 46px;
   }
 }
 
-.btn-more {
+button.btn-more {
   display: none;
-  cursor: pointer;
-  border: 1px solid #ddd;
-  height: 100%;
-  border-radius: 0;
-  box-sizing: border-box;
-  position: relative;
-  overflow: hidden;
-  -webkit-tap-highlight-color: transparent;
-  white-space: nowrap;
-  text-decoration: none;
-  vertical-align: baseline;
-  text-align: center;
-  margin: 0;
-  font-family: Open Sans;
-  font-weight: 600;
-  font-size: 14px;
-  letter-spacing: 1px;
-  font-style: normal;
-  outline: none;
-  line-height: 40px;
-  padding: 0 9px;
-  background-color: #fff;
 
   mat-icon {
     color: $primary;
@@ -137,7 +115,7 @@ $heightAction: 46px;
 }
 
 @media (max-width: 1199.98px) {
-  .btn-block1 {
+  button.btn-block1 {
     display: inline-block;
   }
   .block1 {
@@ -146,7 +124,7 @@ $heightAction: 46px;
 }
 
 @media (max-width: 991.98px) {
-  .btn-block2 {
+  button.btn-block2 {
     display: inline-block;
   }
   .block2 {
@@ -155,7 +133,7 @@ $heightAction: 46px;
 }
 
 @media (max-width: 767.98px) {
-  .btn-block3 {
+  button.btn-block3 {
     display: inline-block;
   }
   .block3 {
@@ -164,7 +142,7 @@ $heightAction: 46px;
 }
 
 @media (max-width: 575.98px) {
-  .btn-block4 {
+  button.btn-block4 {
     display: inline-block;
   }
   .block4 {

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

@@ -0,0 +1,11 @@
+@import '../../styles/style.scss';
+.qmsckeditor__tooltip__container {
+    .mat-form-field {
+        width: 100%;
+    }
+
+    textarea.mat-input-element {
+        min-height: 150px;
+    }
+}
+

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

@@ -16,7 +16,8 @@
 
 .qms-ckeditor {
   .ck.ck-editor__editable {
-    min-height: 150px;
+    max-height: 172px;
+    min-height: 172px;
     background-color: black(0.04);
     font-family: Open Sans;
 
@@ -24,6 +25,33 @@
       background-color: black(0.08);
       border-bottom: 2px solid black(0.38);
     }
+
+    /* width */
+    &::-webkit-scrollbar {
+      width: 12px;
+    }
+
+    /* Track */
+    &::-webkit-scrollbar-track {
+      background: transparent;
+      background-clip: content-box;
+    }
+
+    /* Handle */
+    &::-webkit-scrollbar-thumb {
+      background: black(0.38);
+      border-radius: 20px;
+      width: 4px;
+      border: 4px solid transparent;
+      background-clip: content-box;
+    }
+
+    /* Handle on hover */
+    &::-webkit-scrollbar-thumb:hover {
+      background: black(0.5);
+      background-clip: content-box;
+      border: 4px solid transparent;
+    }
   }
 
   .ck-placeholder {

package/src/lib/qms-ckeditor-components/styles/_modules.scss

@@ -146,3 +146,9 @@
         font-size: 20px;
     }
 }
+
+.qmsckeditor.tooltip-content.height{
+    min-height: 400px;
+    max-height: 450px;
+    overflow: auto;
+}

package/src/themes/core/_form.scss

@@ -104,6 +104,10 @@ $padding-field-flex-datepicker: 0.9rem 1rem 1rem 1rem;
         height: auto;
       }
 
+      textarea.mat-input-element {
+        padding: 0;
+      }
+
       &.mat-focused {
         .mat-form-field-label {
           color: $primary;

package/src/themes/core/_input.scss

@@ -9,4 +9,12 @@
             padding-right: 0.5em;
         }
     }
+}
+
+/* Change the white to any color */
+input:-webkit-autofill,
+input:-webkit-autofill:hover,
+input:-webkit-autofill:focus,
+input:-webkit-autofill:active {
+    transition: background-color 5000s ease-in-out 0s;
 }

package/src/themes/core/_scrollbar.scss

@@ -1,5 +1,5 @@
 @import "colors";
-.qms-scrollbar{
+.qms-scrollbar {
     /* width */
   &::-webkit-scrollbar {
       width: 12px;
@@ -26,4 +26,11 @@
     background-clip: content-box;
     border: 4px solid transparent;
   }
-}
+
+  &.none-scroll-bg {
+    &::-webkit-scrollbar-track {
+      background: transparent; 
+      background-clip: content-box;
+    }
+  }
+}

package/src/themes/core/_styles.scss

@@ -41,6 +41,11 @@
   padding-top: 21px !important;
   padding-bottom: 21px !important;
   .mat-simple-snackbar {
+    button {
+      &:hover {
+          background-color: $primary-light-6-opacity;
+      }
+    }
     span {
       font-family: "Open Sans";
       font-style: normal;

package/src/themes/core/_tab.scss

@@ -56,20 +56,30 @@
             display: flex;
             flex-direction: column;
             align-items: center;
-            color: black(0.6);
+            color: #323232;
             font-family: Open Sans, Arial, Sans-Serif;
-            font-weight: 600;
+            font-weight: 400;
+            .mat-icon{
+                color: black(0.6);
+            }
         }
 
         .mat-tab-label-active{
             .qms-tab-label{
                 color: $active;
+                font-weight: 600;
+                .mat-icon{
+                    color: $active;
+                }
             }
         }
 
         .mat-tab-disabled{
             .qms-tab-label{
-                color: black(0.6);
+                color: black(0.38);
+                .mat-icon{
+                    color: black(0.38);
+                }
             }
         }
 
@@ -127,16 +137,38 @@
 
     &.qms-tab-group-advanced.primary{
         background: #00324E;
+
+        .mat-tab-labels{
+            border-bottom: 1px solid rgba(255, 255, 255, 0.24);
+        }
         .qms-tab-label{
             display: flex;
             flex-direction: column;
             align-items: center;
-            color: rgba(255, 255, 255, 0.6);
+            color: white;
+            font-weight: 400;
+            .mat-icon{
+                color: rgba(255, 255, 255, 0.6);
+            }
+        }
+
+
+        .mat-tab-disabled{
+            .qms-tab-label{
+                color: rgba(255, 255, 255, 0.24);
+                .mat-icon{
+                    color: rgba(255, 255, 255, 0.24);
+                }
+            }
         }
 
         .mat-tab-label-active{
             .qms-tab-label{
                 color: white;
+                font-weight: 600;  
+                .mat-icon{
+                    color: white;
+                }
             }
         }
 
@@ -155,7 +187,7 @@
             }
 
             .mat-ripple-element{
-                background-color: #00324E;
+                background-color: rgba(255, 255, 255, 0.24);
             }
             
             &.mat-tab-label-active{
@@ -207,5 +239,239 @@
             }
         }
     }
-    
+}
+
+
+.mat-tab-nav-bar{
+    &.qms-tab-group{
+        .qms-tab-label{
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            color: #323232;
+            font-family: Open Sans, Arial, Sans-Serif;
+        }
+
+        .mat-tab-label-active{
+            color: $active;
+            font-weight: 600;
+        }
+
+        .mat-tab-disabled{
+            &.qms-tab-label, .qms-tab-label{
+                color: black(0.24);
+            }
+        }
+
+        .mat-tab-link.mat-tab-disabled:hover{
+            background: white;
+        }
+
+        .mat-tab-link{
+            opacity: 1;
+            &:hover, 
+            &:focus-visible,
+            &.cdk-keyboard-focused:not(.mat-tab-disabled), 
+            &.cdk-program-focused:not(.mat-tab-disabled),
+            .mat-ripple-element{
+                background: rgba(25, 84, 169, 0.12); ;
+            }
+        }
+
+        .mat-tab-header-pagination.mat-tab-header-pagination-disabled{
+            .mat-tab-header-pagination-chevron{
+                border-color: black(0.38);
+            }
+            
+        }
+
+        .mat-tab-header-pagination{
+            .mat-tab-header-pagination-chevron{
+                border-color: #666666;
+            }
+        }
+    }
+
+    &.qms-tab-group-advanced{
+        .qms-tab-label{
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            color: #323232;
+            font-family: Open Sans, Arial, Sans-Serif;
+            font-weight: 600;
+            .mat-icon{
+                color: black(0.6);
+            }
+        }
+
+        .mat-tab-label-active{
+            &.qms-tab-label{
+                color: $active;
+                .mat-icon{
+                    color: $active;
+                }
+            }
+        }
+
+        .mat-tab-disabled{
+            &.qms-tab-label, .qms-tab-label{
+                color: black(0.38);
+                .mat-icon{
+                    color: black(0.38);
+                }
+            }
+        }
+
+        .mat-tab-link.mat-tab-disabled:hover{
+            background: white;
+        }
+
+        .mat-tab-link{
+            opacity: 1;
+        }
+
+        .mat-tab-link{
+            &:hover{
+                background: black(0.04);
+            }
+
+            &:focus-visible{
+                background-color: black(0.12);
+            }
+
+            &.cdk-keyboard-focused:not(.mat-tab-disabled), 
+            &.cdk-program-focused:not(.mat-tab-disabled){
+                background: black(0.12);
+            }
+
+            .mat-ripple-element{
+                background-color:rgba(0, 0, 0, 0.12)
+            }
+            
+            &.mat-tab-label-active{
+                &:hover{
+                    background: #F2F7FD;
+                }
+                
+                &:focus-visible, .mat-ripple-element,
+                &.cdk-keyboard-focused:not(.mat-tab-disabled), 
+                &.cdk-program-focused:not(.mat-tab-disabled){
+                    background: rgba(25, 84, 169, 0.12);
+                }
+            }
+        }
+        .mat-tab-header-pagination.mat-tab-header-pagination-disabled{
+            .mat-tab-header-pagination-chevron{
+                border-color: black(0.38);
+            }
+            
+        }
+
+        .mat-tab-header-pagination{
+            .mat-tab-header-pagination-chevron{
+                border-color: #666666;
+            }
+        }
+    }
+
+    &.qms-tab-group-advanced.primary{
+        background: #00324E;
+        
+        .qms-tab-label{
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            color: white;
+            font-weight: 400;
+            .mat-icon{
+                color: rbga(255,255,255, 0.6);
+            }
+        }
+        
+        .mat-tab-disabled{
+            &.qms-tab-label{
+                color: rgba(255, 255, 255, 0.24);
+                .mat-icon{
+                    color: rgba(255, 255, 255, 0.24);
+                }
+            }
+        }
+
+        .mat-tab-label-active{
+            color: white;
+            font-weight: 600;
+            .mat-icon{
+                color: white;
+            }
+        }
+        
+
+        .mat-tab-link{
+            &:hover{
+                background: rgba(255, 255, 255, 0.08);
+            }
+
+            &:focus-visible{
+                background-color: rgba(255, 255, 255, 0.24);
+            }
+
+            &.cdk-keyboard-focused:not(.mat-tab-disabled), 
+            &.cdk-program-focused:not(.mat-tab-disabled){
+                background-color: rgba(255, 255, 255, 0.24);
+            }
+
+            .mat-ripple-element{
+                background-color: #00324E;
+            }
+            
+            &.mat-tab-label-active{
+                &:hover{
+                    background: rgba(255, 255, 255, 0.08);
+                }
+                
+                &:focus-visible{
+                    background-color: rgba(255, 255, 255, 0.24);
+                }
+
+                .mat-ripple-element{
+                    background-color:rgba(255, 255, 255, 0.24);;
+                }
+            }
+            
+            &.mat-tab-disabled:hover{
+                background: #00324E;
+            }
+        }
+
+
+        .mat-ink-bar{
+            background-color: white;
+        }
+
+
+        .mat-tab-header-pagination.mat-tab-header-pagination-disabled{
+            .mat-tab-header-pagination-chevron{
+                border-color: rgba(255, 255, 255, 0.38);
+            }
+            
+        }
+
+        .mat-tab-header-pagination{
+            .mat-tab-header-pagination-chevron{
+                border-color: white;
+            }
+        }
+    }
+
+    &.qms-tab-group-advanced-fixed{
+        .mat-tab-list{
+            max-width: 100%;
+            position: relative;
+
+            .mat-tab-link{
+                flex: 1 1 auto;
+            }
+        }
+    }
 }