Update material styles

akveo · Mar 10, 2020 · c668b34 · c668b34
1 parent 6398508
commit c668b34
Show file tree

Hide file tree

Showing 4 changed files with 41 additions and 31 deletions.
diff --git a/src/app/@theme/components/header/header.component.html b/src/app/@theme/components/header/header.component.html
@@ -29,12 +29,13 @@
 <div class="header-container">
   <nb-actions size="small">
 
-    <nb-action
-      class="control-item"
-      matRipple
-      [matRippleUnbounded]="true"
-      [matRippleCentered]="true"
-    ><nb-search type="rotate-layout"></nb-search></nb-action>
+    <nb-action class="control-item">
+      <nb-search
+        type="rotate-layout"
+        matRipple
+        [matRippleUnbounded]="true"
+        [matRippleCentered]="true"
+      ></nb-search></nb-action>
     <nb-action
       class="control-item"
       icon="email-outline"

diff --git a/src/app/@theme/styles/material/_material-dark.scss b/src/app/@theme/styles/material/_material-dark.scss
@@ -371,9 +371,12 @@ $theme: (
 
   header-background-color: color-primary-default,
   footer-background-color: color-primary-default,
+  header-text-color: text-basic-color,
   footer-text-color: text-basic-color,
   footer-text-highlight-color: footer-text-color,
   sidebar-background-color: background-basic-color-2,
+  actions-icon-color: text-basic-color,
+  actions-text-color: text-basic-color,
 
   material-regular-font-weight: 400,
   menu-text-font-weight: material-regular-font-weight,
@@ -398,10 +401,10 @@ $theme: (
   input-basic-focus-border-color: color-primary-focus,
   input-basic-disabled-border-color: input-basic-border-color,
   input-basic-hover-border-color: input-basic-border-color,
-  input-basic-background-color: card-background-color,
-  input-basic-focus-background-color: card-background-color,
-  input-basic-disabled-background-color: card-background-color,
-  input-basic-hover-background-color: card-background-color,
+  input-basic-background-color: transparent,
+  input-basic-focus-background-color: transparent,
+  input-basic-disabled-background-color: transparent,
+  input-basic-hover-background-color: transparent,
   input-rectangle-border-radius: 0,
   input-semi-round-border-radius: 0,
   input-round-border-radius: 0,
@@ -443,10 +446,10 @@ $theme: (
   select-outline-basic-focus-border-color: color-primary-focus,
   select-outline-basic-hover-border-color: select-outline-basic-border-color,
   select-outline-basic-disabled-border-color: select-outline-basic-border-color,
-  select-outline-basic-background-color: card-background-color,
-  select-outline-basic-focus-background-color: card-background-color,
-  select-outline-basic-hover-background-color: card-background-color,
-  select-outline-basic-disabled-background-color: card-background-color,
+  select-outline-basic-background-color: transparent,
+  select-outline-basic-focus-background-color: transparent,
+  select-outline-basic-hover-background-color: transparent,
+  select-outline-basic-disabled-background-color: transparent,
   select-outline-primary-background-color: select-outline-basic-background-color,
   select-outline-primary-focus-background-color: select-outline-basic-focus-background-color,
   select-outline-primary-hover-background-color: select-outline-basic-hover-background-color,

diff --git a/src/app/@theme/styles/material/_material-light.scss b/src/app/@theme/styles/material/_material-light.scss
@@ -275,7 +275,7 @@ $theme: (
 
   background-basic-color-1: color-basic-100,
   background-basic-color-2: color-basic-300,
-  background-basic-color-3: color-basic-100,
+  background-basic-color-3: #fafafa,
   background-basic-color-4: color-basic-400,
 
   background-alternative-color-1: color-basic-800,
@@ -371,9 +371,12 @@ $theme: (
 
   header-background-color: color-primary-default,
   footer-background-color: color-primary-default,
+  header-text-color: text-alternate-color,
   footer-text-color: text-alternate-color,
   footer-text-highlight-color: footer-text-color,
   sidebar-background-color: background-basic-color-2,
+  actions-icon-color: text-alternate-color,
+  actions-text-color: text-alternate-color,
 
   menu-text-font-weight: 400,
   menu-text-color: rgba(0, 0, 0, 0.87),
@@ -396,10 +399,10 @@ $theme: (
   input-basic-focus-border-color: color-primary-focus,
   input-basic-disabled-border-color: rgba(0, 0, 0, 0.42),
   input-basic-hover-border-color: rgba(0, 0, 0, 0.42),
-  input-basic-background-color: background-basic-color-1,
-  input-basic-focus-background-color: background-basic-color-1,
-  input-basic-disabled-background-color: background-basic-color-1,
-  input-basic-hover-background-color: background-basic-color-1,
+  input-basic-background-color: transparent,
+  input-basic-focus-background-color: transparent,
+  input-basic-disabled-background-color: transparent,
+  input-basic-hover-background-color: transparent,
   input-rectangle-border-radius: 0,
   input-semi-round-border-radius: 0,
   input-round-border-radius: 0,
@@ -441,10 +444,10 @@ $theme: (
   select-outline-basic-focus-border-color: color-primary-focus,
   select-outline-basic-hover-border-color: select-outline-basic-border-color,
   select-outline-basic-disabled-border-color: select-outline-basic-border-color,
-  select-outline-basic-background-color: background-basic-color-1,
-  select-outline-basic-focus-background-color: background-basic-color-1,
-  select-outline-basic-hover-background-color: background-basic-color-1,
-  select-outline-basic-disabled-background-color: background-basic-color-1,
+  select-outline-basic-background-color: transparent,
+  select-outline-basic-focus-background-color: transparent,
+  select-outline-basic-hover-background-color: transparent,
+  select-outline-basic-disabled-background-color: transparent,
   select-outline-primary-background-color: select-outline-basic-background-color,
   select-outline-primary-focus-background-color: select-outline-basic-focus-background-color,
   select-outline-primary-hover-background-color: select-outline-basic-hover-background-color,

diff --git a/src/app/@theme/styles/material/_material.scss b/src/app/@theme/styles/material/_material.scss
@@ -15,12 +15,15 @@
     @include mat-core();
 
     nb-layout-header {
-      .logo-container, nb-action {
-        a, nb-icon, .user-name {
-          color: nb-theme(text-control-color) !important;
-        }
+      .logo-container nb-icon {
+        color: nb-theme(text-control-color);
+      }
+
+      .select-button {
+        background-color: nb-theme(background-basic-color-3) !important;
       }
     }
+
 
     nb-sidebar {
       transition: width 0.3s;
@@ -30,10 +33,6 @@
       }
     }
 
-    ngx-footer .socials {
-      color: nb-theme(color-basic-100) !important;
-    }
-
     nb-card {
       border-bottom-left-radius: 0.125rem;
       border-bottom-right-radius: 0.125rem;
@@ -50,5 +49,9 @@
         border-color: nb-theme(color-primary-focus) !important;
       }
     }
+
+    [nbbutton] {
+      box-shadow: none !important;
+    }
   }
 }