new-front-common-library 18.2.0 → 18.2.2

package/assets/css/material/_mdc-light-theme.scss

@@ -1,264 +1,264 @@
-@import "../mat-palettes";
-
-.light-theme {
-  // MAT SELECT
-  .mat-mdc-select {
-    color: $black-bluish
-  }
-
-  // END MAT SELECT
-
-  // MAT OPTION
-  .mat-mdc-option {
-    color: $black-bluish;
-  }
-
-  // END MAT OPTION
-
-  // MAT MENU
-  .mat-mdc-menu-item, .mat-mdc-menu-item .mat-icon {
-    color: $black-bluish !important;
-  }
-  // END MAT MENU
-
-  // MAT LABEL
-  mat-label {
-    color: $medium-blue !important;
-    font-weight: bold;
-  }
-  .mat-mdc-floating-label {
-    color: $black-bluish !important;
-    font-weight: bold;
-  }
-
-  // END MAT LABEL
-
-  // PAGINATOR
-  .mat-mdc-paginator {
-    background-color: $gray-background-lightest;
-  }
-
-  .mat-mdc-paginator-container {
-    background-color: $gray-background-lightest;
-    color: $black-bluish;
-  }
-
-  .mat-mdc-paginator-icon {
-    fill: $black-bluish;
-  }
-
-  // END PAGINATOR
-
-  // FORM FIELD
-  .mat-form-field-appearance-outline {
-    .mat-mdc-text-field-wrapper {
-      background: $gray-strong;
-      border-radius: 4px;
-    }
-    .mdc-notched-outline > * {
-      border-color: $light-border-color;
-    }
-    .mdc-text-field--focused .mdc-notched-outline > * {
-      border-color: $black-bluish;
-    }
-  }
-  .mat-mdc-checkbox .mdc-form-field {
-    -webkit-font-smoothing: initial;
-  }
-
-  --mdc-filled-text-field-container-color: transparent;
-
-  // END FORM FIELD
-
-  // TABLE
-
-  .mat-mdc-table {
-    background-color: $gray-background-light2;
-    border-color: $gray-strong;
-    border-bottom: 1px solid $gray-strong;
-  }
-
-  .mat-mdc-header-row {
-    background: $gray-background-lightest;
-  }
-
-  .mat-mdc-header-cell mat-label {
-    color: $black-bluish !important;
-  }
-
-  .mat-sort-header-arrow {
-    color: $black-bluish;
-  }
-
-  .mat-mdc-cell {
-    color: $black-bluish;
-  }
-
-  .expandable-row .mat-mdc-cell {
-    background: white;
-  }
-
-  .mat-mdc-header-cell, .mat-mdc-header-cell .mat-mdc-floating-label {
-    color: $black-bluish;
-    font-weight: bold;
-  }
-
-  .mat-mdc-row:hover {
-    background-color: whitesmoke;
-  }
-
-  .mat-mdc-row, row-drop {
-    border-left-width: 1px;
-    border-right-width: 1px;
-    border-left-color: $gray-strong;
-    border-right-color: $gray-strong;
-  }
-
-  .mat-mdc-row .mdc-text-field--filled {
-    background: $gray-strong;
-  }
-
-  .mat-mdc-row .mat-mdc-select {
-    background: $gray-strong;
-  }
-
-  .mat-mdc-row mat-label {
-    background: $black-bluish;
-  }
-
-  // END TABLE
-
-  // CALENDAR
-  .mat-calendar-body-selected {
-    background: $blue-primary;
-    border-color: $blue-primary;
-    color: white !important;
-  }
-
-  .mat-calendar-body-today {
-    background: $black-bluish !important;
-    border-color: $black-bluish !important;
-    color: white !important;
-  }
-
-  .mat-calendar-arrow {
-    fill: $blue-primary;
-  }
-
-  .mat-datepicker-toggle,
-  .mat-datepicker-content .mat-calendar-next-button,
-  .mat-datepicker-content .mat-calendar-previous-button {
-    color: $blue-primary;
-  }
-
-  .mat-datepicker-content .mat-mdc-button.mat-unthemed {
-    --mdc-text-button-label-text-color: #{$blue-primary};
-  }
-
-  .mat-calendar-body-cell-content, .mat-date-range-input-separator {
-    color: $black-bluish;
-    border-color: transparent;
-  }
-
-  //.mat-calendar-controls {
-  //  display: flex;
-  //  margin: 0% calc(33% / 7 - 16px);
-  //}
-
-  // END CALENDAR
-
-  // CHECKBOX
-  --mdc-checkbox-selected-icon-color: #{$blue-primary};
-  --mdc-checkbox-selected-hover-icon-color: #{$blue-primary};
-  --mdc-checkbox-selected-focus-icon-color: #{$blue-primary};
-  --mdc-checkbox-selected-pressed-icon-color: #{$blue-primary};
-  --mdc-checkbox-unselected-icon-color:#{$gray-primary};
-  --mdc-checkbox-unselected-hover-icon-color:#{$gray-primary};
-  --mdc-checkbox-unselected-focus-icon-color:#{$gray-primary};
-
-  // END CHECKBOX
-
-
-  //// POPUP
-
-  .mat-mdc-dialog-container {
-    --mdc-dialog-container-color: #{$gray-background-lightest};
-  }
-
-  .mat-mdc-dialog-container h1,
-  .mat-mdc-dialog-container h2,
-  .mat-mdc-dialog-container h3,
-  .mat-mdc-dialog-container h4,
-  .mat-mdc-dialog-container .text {
-    color: $black-bluish !important;
-  }
-
-  //// END POPUP
-
-  //RADIO BUTTON
-  .mat-mdc-radio-button.mat-accent {
-    --mdc-radio-unselected-hover-icon-color: #{$blue-primary};
-    --mdc-radio-unselected-icon-color: #{$blue-primary};
-    --mdc-radio-unselected-pressed-icon-color: #{$blue-primary};
-    --mdc-radio-selected-focus-icon-color: #{$blue-primary};
-    --mdc-radio-selected-hover-icon-color: #{$blue-primary};
-    --mdc-radio-selected-icon-color: #{$blue-primary};
-    --mdc-radio-selected-pressed-icon-color: #{$blue-primary};
-  }
-  //END RADIO BUTTON
-
-
-  //TEXTAREA
-  --mdc-filled-text-field-input-text-color: #{$black-bluish};
-  //END TEXTAREA
-
-  //DRAWER
-  .mat-drawer-container {
-    background-color: $gray-background-lightest;
-  }
-  //END DRAWER
-
-  //.mat-mdc-card {
-  //  padding: 5px !important;
-  //  background: $gray-background-lightest;
-  //  color: $black-bluish;
-  //}
-
-  //.mat-mdc-footer-cell {
-  //  font-style: italic;
-  //  font-weight: normal;
-  //  font-size: 14px;
-  //  background-color: $gray-background-light2;
-  //  border-color: $gray-strong;
-  //}
-
-  //mat-toolbar-row {
-  //  background-color: white;
-  //}
-
-
-
-  //.mat-footer-cell {
-  //  font-style: italic;
-  //  font-weight: normal;
-  //  font-size: 14px;
-  //  //color: $gray-light;
-  //  background-color: $gray-background-light2;
-  //  border-color: $gray-strong;
-  //}
-
-  //mat-footer-row {
-  //  background-color: $gray-background-light2;
-  //}
-
-
-
-  //.mat-drag-panel {
-  //  color: $black-bluish;
-  //}
-
-  //.mat-raised-button.mat-accent {
-  //  background: $gray-blue-primary !important;
-  //}
-
-}
+@import "../mat-palettes";
+
+.light-theme {
+  // MAT SELECT
+  .mat-mdc-select {
+    color: $black-bluish
+  }
+
+  // END MAT SELECT
+
+  // MAT OPTION
+  .mat-mdc-option {
+    color: $black-bluish;
+  }
+
+  // END MAT OPTION
+
+  // MAT MENU
+  .mat-mdc-menu-item, .mat-mdc-menu-item .mat-icon {
+    color: $black-bluish !important;
+  }
+  // END MAT MENU
+
+  // MAT LABEL
+  mat-label {
+    color: $medium-blue !important;
+    font-weight: bold;
+  }
+  .mat-mdc-floating-label {
+    color: $black-bluish !important;
+    font-weight: bold;
+  }
+
+  // END MAT LABEL
+
+  // PAGINATOR
+  .mat-mdc-paginator {
+    background-color: $gray-background-lightest;
+  }
+
+  .mat-mdc-paginator-container {
+    background-color: $gray-background-lightest;
+    color: $black-bluish;
+  }
+
+  .mat-mdc-paginator-icon {
+    fill: $black-bluish;
+  }
+
+  // END PAGINATOR
+
+  // FORM FIELD
+  .mat-form-field-appearance-outline {
+    .mat-mdc-text-field-wrapper {
+      background: $gray-strong;
+      border-radius: 4px;
+    }
+    .mdc-notched-outline > * {
+      border-color: $light-border-color;
+    }
+    .mdc-text-field--focused .mdc-notched-outline > * {
+      border-color: $black-bluish;
+    }
+  }
+  .mat-mdc-checkbox .mdc-form-field {
+    -webkit-font-smoothing: initial;
+  }
+
+  --mdc-filled-text-field-container-color: transparent;
+
+  // END FORM FIELD
+
+  // TABLE
+
+  .mat-mdc-table {
+    background-color: $gray-background-light2;
+    border-color: $gray-strong;
+    border-bottom: 1px solid $gray-strong;
+  }
+
+  .mat-mdc-header-row {
+    background: $gray-background-lightest;
+  }
+
+  .mat-mdc-header-cell mat-label {
+    color: $black-bluish !important;
+  }
+
+  .mat-sort-header-arrow {
+    color: $black-bluish;
+  }
+
+  .mat-mdc-cell {
+    color: $black-bluish;
+  }
+
+  .expandable-row .mat-mdc-cell {
+    background: white;
+  }
+
+  .mat-mdc-header-cell, .mat-mdc-header-cell .mat-mdc-floating-label {
+    color: $black-bluish;
+    font-weight: bold;
+  }
+
+  .mat-mdc-row:hover {
+    background-color: whitesmoke;
+  }
+
+  .mat-mdc-row, row-drop {
+    border-left-width: 1px;
+    border-right-width: 1px;
+    border-left-color: $gray-strong;
+    border-right-color: $gray-strong;
+  }
+
+  .mat-mdc-row .mdc-text-field--filled {
+    background: $gray-strong;
+  }
+
+  .mat-mdc-row .mat-mdc-select {
+    background: $gray-strong;
+  }
+
+  .mat-mdc-row mat-label {
+    background: $black-bluish;
+  }
+
+  // END TABLE
+
+  // CALENDAR
+  .mat-calendar-body-selected {
+    background: $blue-primary;
+    border-color: $blue-primary;
+    color: white !important;
+  }
+
+  .mat-calendar-body-today {
+    background: $black-bluish !important;
+    border-color: $black-bluish !important;
+    color: white !important;
+  }
+
+  .mat-calendar-arrow {
+    fill: $blue-primary;
+  }
+
+  .mat-datepicker-toggle,
+  .mat-datepicker-content .mat-calendar-next-button,
+  .mat-datepicker-content .mat-calendar-previous-button {
+    color: $blue-primary;
+  }
+
+  .mat-datepicker-content .mat-mdc-button.mat-unthemed {
+    --mdc-text-button-label-text-color: #{$blue-primary};
+  }
+
+  .mat-calendar-body-cell-content, .mat-date-range-input-separator {
+    color: $black-bluish;
+    border-color: transparent;
+  }
+
+  //.mat-calendar-controls {
+  //  display: flex;
+  //  margin: 0% calc(33% / 7 - 16px);
+  //}
+
+  // END CALENDAR
+
+  // CHECKBOX
+  --mdc-checkbox-selected-icon-color: #{$blue-primary};
+  --mdc-checkbox-selected-hover-icon-color: #{$blue-primary};
+  --mdc-checkbox-selected-focus-icon-color: #{$blue-primary};
+  --mdc-checkbox-selected-pressed-icon-color: #{$blue-primary};
+  --mdc-checkbox-unselected-icon-color:#{$gray-primary};
+  --mdc-checkbox-unselected-hover-icon-color:#{$gray-primary};
+  --mdc-checkbox-unselected-focus-icon-color:#{$gray-primary};
+
+  // END CHECKBOX
+
+
+  //// POPUP
+
+  .mat-mdc-dialog-container {
+    --mdc-dialog-container-color: #{$gray-background-lightest};
+  }
+
+  .mat-mdc-dialog-container h1,
+  .mat-mdc-dialog-container h2,
+  .mat-mdc-dialog-container h3,
+  .mat-mdc-dialog-container h4,
+  .mat-mdc-dialog-container .text {
+    color: $black-bluish !important;
+  }
+
+  //// END POPUP
+
+  //RADIO BUTTON
+  .mat-mdc-radio-button.mat-accent {
+    --mdc-radio-unselected-hover-icon-color: #{$blue-primary};
+    --mdc-radio-unselected-icon-color: #{$blue-primary};
+    --mdc-radio-unselected-pressed-icon-color: #{$blue-primary};
+    --mdc-radio-selected-focus-icon-color: #{$blue-primary};
+    --mdc-radio-selected-hover-icon-color: #{$blue-primary};
+    --mdc-radio-selected-icon-color: #{$blue-primary};
+    --mdc-radio-selected-pressed-icon-color: #{$blue-primary};
+  }
+  //END RADIO BUTTON
+
+
+  //TEXTAREA
+  --mdc-filled-text-field-input-text-color: #{$black-bluish};
+  //END TEXTAREA
+
+  //DRAWER
+  .mat-drawer-container {
+    background-color: $gray-background-lightest;
+  }
+  //END DRAWER
+
+  //.mat-mdc-card {
+  //  padding: 5px !important;
+  //  background: $gray-background-lightest;
+  //  color: $black-bluish;
+  //}
+
+  //.mat-mdc-footer-cell {
+  //  font-style: italic;
+  //  font-weight: normal;
+  //  font-size: 14px;
+  //  background-color: $gray-background-light2;
+  //  border-color: $gray-strong;
+  //}
+
+  //mat-toolbar-row {
+  //  background-color: white;
+  //}
+
+
+
+  //.mat-footer-cell {
+  //  font-style: italic;
+  //  font-weight: normal;
+  //  font-size: 14px;
+  //  //color: $gray-light;
+  //  background-color: $gray-background-light2;
+  //  border-color: $gray-strong;
+  //}
+
+  //mat-footer-row {
+  //  background-color: $gray-background-light2;
+  //}
+
+
+
+  //.mat-drag-panel {
+  //  color: $black-bluish;
+  //}
+
+  //.mat-raised-button.mat-accent {
+  //  background: $gray-blue-primary !important;
+  //}
+
+}