fix grey/white theme colors #233

marcosmoura · marcosmoura · commit 6a95f146eab1 · 2016-12-23T16:35:08.000-02:00
diff --git a/docs/src/pages/components/Icon.vue b/docs/src/pages/components/Icon.vue
@@ -23,35 +23,35 @@
         <example-box card-title="Default">
           <div slot="demo">
             <md-icon>home</md-icon>
-            <md-icon class="md-primary">home</md-icon>
-            <md-icon class="md-accent">home</md-icon>
-            <md-icon class="md-warn">home</md-icon>
+            <md-icon class="md-primary">menu</md-icon>
+            <md-icon class="md-accent">people</md-icon>
+            <md-icon class="md-warn">access_time</md-icon>
           </div>
 
           <div slot="code">
             <code-block lang="xml">
               &lt;md-icon&gt;home&lt;/md-icon&gt;
-              &lt;md-icon class=&quot;md-primary&quot;&gt;home&lt;/md-icon&gt;
-              &lt;md-icon class=&quot;md-accent&quot;&gt;home&lt;/md-icon&gt;
-              &lt;md-icon class=&quot;md-warn&quot;&gt;home&lt;/md-icon&gt;
+              &lt;md-icon class=&quot;md-primary&quot;&gt;menu&lt;/md-icon&gt;
+              &lt;md-icon class=&quot;md-accent&quot;&gt;people&lt;/md-icon&gt;
+              &lt;md-icon class=&quot;md-warn&quot;&gt;access_time&lt;/md-icon&gt;
             </code-block>
           </div>
         </example-box>
 
         <example-box card-title="Themes">
           <div slot="demo">
             <md-icon md-theme="light-blue" class="md-primary">home</md-icon>
-            <md-icon md-theme="green" class="md-primary">home</md-icon>
-            <md-icon md-theme="brown" class="md-primary">home</md-icon>
-            <md-icon md-theme="orange" class="md-primary">home</md-icon>
+            <md-icon md-theme="green" class="md-primary">menu</md-icon>
+            <md-icon md-theme="brown" class="md-primary">people</md-icon>
+            <md-icon md-theme="orange" class="md-primary">access_time</md-icon>
           </div>
 
           <div slot="code">
             <code-block lang="xml">
               &lt;md-icon md-theme=&quot;light-blue&quot; class=&quot;md-primary&quot;&gt;home&lt;/md-icon&gt;
-              &lt;md-icon md-theme=&quot;green&quot; class=&quot;md-primary&quot;&gt;home&lt;/md-icon&gt;
-              &lt;md-icon md-theme=&quot;brown&quot; class=&quot;md-primary&quot;&gt;home&lt;/md-icon&gt;
-              &lt;md-icon md-theme=&quot;orange&quot; class=&quot;md-primary&quot;&gt;home&lt;/md-icon&gt;
+              &lt;md-icon md-theme=&quot;green&quot; class=&quot;md-primary&quot;&gt;menu&lt;/md-icon&gt;
+              &lt;md-icon md-theme=&quot;brown&quot; class=&quot;md-primary&quot;&gt;people&lt;/md-icon&gt;
+              &lt;md-icon md-theme=&quot;orange&quot; class=&quot;md-primary&quot;&gt;access_time&lt;/md-icon&gt;
             </code-block>
           </div>
         </example-box>
diff --git a/docs/src/pages/components/InkRipple.vue b/docs/src/pages/components/InkRipple.vue
@@ -28,7 +28,7 @@
       </div>
 
       <div slot="example">
-        <example-box card-title="As a component">
+        <example-box card-title="Default">
           <div slot="demo">
             <div class="has-ripple">
               <md-ink-ripple></md-ink-ripple>
diff --git a/docs/src/routes.js b/docs/src/routes.js
@@ -153,11 +153,6 @@ const components = [
     name: 'components:spinner',
     component: Spinner
   },
-  {
-    path: '/components/switch',
-    name: 'components:switch',
-    component: Switch
-  },
   {
     path: '/components/subheader',
     name: 'components:subheader',
diff --git a/src/components/mdButton/mdButton.theme b/src/components/mdButton/mdButton.theme
@@ -2,16 +2,16 @@
   &.md-button:not([disabled]) {
     &.md-raised {
       &:not(.md-icon-button) {
-        color: #{'BACKGROUND-COLOR-900'};
-        background-color: #{'BACKGROUND-COLOR-50'};
+        color: #{'BACKGROUND-CONTRAST'};
+        background-color: #{'BACKGROUND-COLOR'};
 
         &:hover {
           background-color: #{'BACKGROUND-COLOR-200'};
         }
       }
 
       &.md-icon-button:not(.md-raised) {
-        color: #{'BACKGROUND-COLOR'};
+        color: #{'BACKGROUND-CONTRAST'};
       }
     }
 
@@ -24,8 +24,8 @@
       }
 
       &.md-clean {
-        color: #{'BACKGROUND-COLOR-900'};
-        background-color: #{'BACKGROUND-COLOR-50'};
+        color: #{'BACKGROUND-CONTRAST'};
+        background-color: #{'BACKGROUND-COLOR'};
 
         &:hover {
           background-color: #{'BACKGROUND-COLOR-200'};
diff --git a/src/components/mdButtonToggle/mdButtonToggle.theme b/src/components/mdButtonToggle/mdButtonToggle.theme
@@ -12,15 +12,15 @@
     }
 
     .md-toggle {
-      color: #{'BACKGROUND-CONTRAST-600'};
-      background-color: #{'BACKGROUND-COLOR-500'};
+      color: #{'BACKGROUND-CONTRAST-0.54'};
+      background-color: #{'BACKGROUND-CONTRAST-0.26'};
 
       &:hover:not([disabled]) {
-        background-color: #{'BACKGROUND-COLOR-600'};
+        background-color: #{'BACKGROUND-CONTRAST-0.38'};
       }
 
       + .md-toggle:after {
-        background-color: #{'BACKGROUND-COLOR-600'};
+        background-color: #{'BACKGROUND-CONTRAST-0.12'};
       }
     }
 
@@ -29,11 +29,11 @@
       background-color: #{'PRIMARY-COLOR'};
 
       &:hover:not([disabled]) {
-        background-color: #{'PRIMARY-COLOR-600'};
+        background-color: #{'PRIMARY-COLOR'};
       }
 
       + .md-toggle:after {
-        background-color: #{'PRIMARY-COLOR-700'};
+        background-color: #{'PRIMARY-COLOR-600'};
       }
     }
 
@@ -42,11 +42,11 @@
       background-color: #{'ACCENT-COLOR'};
 
       &:hover:not([disabled]) {
-        background-color: #{'ACCENT-COLOR-600'};
+        background-color: #{'ACCENT-COLOR'};
       }
 
       + .md-toggle:after {
-        background-color: #{'ACCENT-COLOR-700'};
+        background-color: #{'ACCENT-COLOR-600'};
       }
     }
 
@@ -55,11 +55,11 @@
       background-color: #{'WARN-COLOR'};
 
       &:hover:not([disabled]) {
-        background-color: #{'WARN-COLOR-600'};
+        background-color: #{'WARN-COLOR'};
       }
 
       + .md-toggle:after {
-        background-color: #{'WARN-COLOR-700'};
+        background-color: #{'WARN-COLOR-600'};
       }
     }
 
diff --git a/src/components/mdCard/mdCard.theme b/src/components/mdCard/mdCard.theme
@@ -1,6 +1,6 @@
 .THEME_NAME {
   &.md-card {
-    background-color: #{'BACKGROUND-COLOR-A100'};
+    background-color: #{'BACKGROUND-COLOR'};
 
     &.md-primary {
       background-color: #{'PRIMARY-COLOR'};
@@ -75,7 +75,7 @@
 
     .md-card-expand {
       .md-card-actions {
-        background-color: #{'BACKGROUND-COLOR-A100'};
+        background-color: #{'BACKGROUND-COLOR'};
       }
     }
   }
diff --git a/src/components/mdDialog/mdDialog.theme b/src/components/mdDialog/mdDialog.theme
@@ -1,6 +1,6 @@
 .THEME_NAME {
   &.md-dialog-container .md-dialog {
-    background-color: #{'BACKGROUND-COLOR-A100'};
+    background-color: #{'BACKGROUND-COLOR'};
     color: #{'BACKGROUND-CONTRAST'};
   }
 }
diff --git a/src/components/mdList/mdList.theme b/src/components/mdList/mdList.theme
@@ -1,6 +1,6 @@
 .THEME_NAME {
   &.md-list {
-    background-color: #{'BACKGROUND-COLOR-A100'};
+    background-color: #{'BACKGROUND-COLOR'};
     color: #{'BACKGROUND-CONTRAST'};
 
     &.md-transparent {
@@ -50,7 +50,7 @@
 
     .md-list-item-expand {
       .md-list-item-container {
-        background-color: #{'BACKGROUND-COLOR-A100'};
+        background-color: #{'BACKGROUND-COLOR'};
 
         &:hover,
         &:focus {
diff --git a/src/components/mdMenu/mdMenu.theme b/src/components/mdMenu/mdMenu.theme
@@ -1,6 +1,6 @@
 .THEME_NAME {
   &.md-menu-content {
-    background-color: #{'BACKGROUND-COLOR-A100'};
+    background-color: #{'BACKGROUND-COLOR'};
     color: #{'BACKGROUND-CONTRAST'};
 
     .md-menu-item {
diff --git a/src/components/mdSidenav/mdSidenav.theme b/src/components/mdSidenav/mdSidenav.theme
@@ -1,7 +1,7 @@
 .THEME_NAME {
   &.md-sidenav {
     .md-sidenav-content {
-      background-color: #{'BACKGROUND-COLOR-A100'};
+      background-color: #{'BACKGROUND-COLOR'};
       color: #{'BACKGROUND-CONTRAST'};
     }
   }
diff --git a/src/components/mdTable/mdTable.theme b/src/components/mdTable/mdTable.theme
@@ -5,13 +5,13 @@
 
   &.md-table-card {
     .md-toolbar {
-      background-color: #{'BACKGROUND-COLOR-A100'};
-      color: #{'BACKGROUND-CONTRAST-A100'};
+      background-color: #{'BACKGROUND-COLOR'};
+      color: #{'BACKGROUND-CONTRAST'};
     }
   }
 
   &.md-table-alternate-header {
-    background-color: #{'BACKGROUND-COLOR-A100'};
+    background-color: #{'BACKGROUND-COLOR'};
 
     .md-toolbar {
       background-color: #{'ACCENT-COLOR-A100-0.2'};
diff --git a/src/components/mdTooltip/mdTooltip.vue b/src/components/mdTooltip/mdTooltip.vue
@@ -59,15 +59,10 @@
     },
     methods: {
       removeTooltips() {
-        const tooltips = [...this.rootElement.querySelectorAll('.md-tooltip')];
-
-        tooltips.forEach((tooltip) => {
-          if (tooltip.parentNode) {
-            tooltip.parentNode.removeChild(tooltip);
-          }
-        });
-
-        this.tooltipElement.removeEventListener(transitionEndEventName, this.removeTooltips);
+        if (this.tooltipElement.parentNode) {
+          this.tooltipElement.removeEventListener(transitionEndEventName, this.removeTooltips);
+          this.tooltipElement.parentNode.removeChild(this.tooltipElement);
+        }
       },
       calculateTooltipPosition() {
         let position = this.parentElement.getBoundingClientRect();
diff --git a/src/core/components/mdTheme/index.js b/src/core/components/mdTheme/index.js
@@ -6,7 +6,7 @@ const VALID_THEME_TYPE = ['primary', 'accent', 'background', 'warn', 'hue-1', 'h
 const DEFAULT_THEME_COLORS = {
   primary: 'indigo',
   accent: 'pink',
-  background: 'grey',
+  background: 'white',
   warn: 'deep-orange'
 };
 /*const DEFAULT_HUES = {
diff --git a/src/core/stylesheets/core.theme b/src/core/stylesheets/core.theme
@@ -14,7 +14,7 @@
 }
 
 body.THEME_NAME {
-  background-color: #{'BACKGROUND-COLOR-A100'};
+  background-color: #{'BACKGROUND-COLOR'};
   color: #{'BACKGROUND-CONTRAST-0.87'};
 }
 

Original file line number	Diff line number	Diff line change
`@@ -2,16 +2,16 @@`
`2`	`2`	`&.md-button:not([disabled]) {`
`3`	`3`	`&.md-raised {`
`4`	`4`	`&:not(.md-icon-button) {`
`5`		`- color: #{'BACKGROUND-COLOR-900'};`
`6`		`- background-color: #{'BACKGROUND-COLOR-50'};`
	`5`	`+ color: #{'BACKGROUND-CONTRAST'};`
	`6`	`+ background-color: #{'BACKGROUND-COLOR'};`
`7`	`7`
`8`	`8`	`&:hover {`
`9`	`9`	`background-color: #{'BACKGROUND-COLOR-200'};`
`10`	`10`	`}`
`11`	`11`	`}`
`12`	`12`
`13`	`13`	`&.md-icon-button:not(.md-raised) {`
`14`		`- color: #{'BACKGROUND-COLOR'};`
	`14`	`+ color: #{'BACKGROUND-CONTRAST'};`
`15`	`15`	`}`
`16`	`16`	`}`
`17`	`17`
`@@ -24,8 +24,8 @@`
`24`	`24`	`}`
`25`	`25`
`26`	`26`	`&.md-clean {`
`27`		`- color: #{'BACKGROUND-COLOR-900'};`
`28`		`- background-color: #{'BACKGROUND-COLOR-50'};`
	`27`	`+ color: #{'BACKGROUND-CONTRAST'};`
	`28`	`+ background-color: #{'BACKGROUND-COLOR'};`
`29`	`29`
`30`	`30`	`&:hover {`
`31`	`31`	`background-color: #{'BACKGROUND-COLOR-200'};`
Original file line number	Diff line number	Diff line change
`@@ -12,15 +12,15 @@`
`12`	`12`	`}`
`13`	`13`
`14`	`14`	`.md-toggle {`
`15`		`- color: #{'BACKGROUND-CONTRAST-600'};`
`16`		`- background-color: #{'BACKGROUND-COLOR-500'};`
	`15`	`+ color: #{'BACKGROUND-CONTRAST-0.54'};`
	`16`	`+ background-color: #{'BACKGROUND-CONTRAST-0.26'};`
`17`	`17`
`18`	`18`	`&:hover:not([disabled]) {`
`19`		`- background-color: #{'BACKGROUND-COLOR-600'};`
	`19`	`+ background-color: #{'BACKGROUND-CONTRAST-0.38'};`
`20`	`20`	`}`
`21`	`21`
`22`	`22`	`+ .md-toggle:after {`
`23`		`- background-color: #{'BACKGROUND-COLOR-600'};`
	`23`	`+ background-color: #{'BACKGROUND-CONTRAST-0.12'};`
`24`	`24`	`}`
`25`	`25`	`}`
`26`	`26`
`@@ -29,11 +29,11 @@`
`29`	`29`	`background-color: #{'PRIMARY-COLOR'};`
`30`	`30`
`31`	`31`	`&:hover:not([disabled]) {`
`32`		`- background-color: #{'PRIMARY-COLOR-600'};`
	`32`	`+ background-color: #{'PRIMARY-COLOR'};`
`33`	`33`	`}`
`34`	`34`
`35`	`35`	`+ .md-toggle:after {`
`36`		`- background-color: #{'PRIMARY-COLOR-700'};`
	`36`	`+ background-color: #{'PRIMARY-COLOR-600'};`
`37`	`37`	`}`
`38`	`38`	`}`
`39`	`39`
`@@ -42,11 +42,11 @@`
`42`	`42`	`background-color: #{'ACCENT-COLOR'};`
`43`	`43`
`44`	`44`	`&:hover:not([disabled]) {`
`45`		`- background-color: #{'ACCENT-COLOR-600'};`
	`45`	`+ background-color: #{'ACCENT-COLOR'};`
`46`	`46`	`}`
`47`	`47`
`48`	`48`	`+ .md-toggle:after {`
`49`		`- background-color: #{'ACCENT-COLOR-700'};`
	`49`	`+ background-color: #{'ACCENT-COLOR-600'};`
`50`	`50`	`}`
`51`	`51`	`}`
`52`	`52`
`@@ -55,11 +55,11 @@`
`55`	`55`	`background-color: #{'WARN-COLOR'};`
`56`	`56`
`57`	`57`	`&:hover:not([disabled]) {`
`58`		`- background-color: #{'WARN-COLOR-600'};`
	`58`	`+ background-color: #{'WARN-COLOR'};`
`59`	`59`	`}`
`60`	`60`
`61`	`61`	`+ .md-toggle:after {`
`62`		`- background-color: #{'WARN-COLOR-700'};`
	`62`	`+ background-color: #{'WARN-COLOR-600'};`
`63`	`63`	`}`
`64`	`64`	`}`
`65`	`65`
Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,6 @@`
`1`	`1`	`.THEME_NAME {`
`2`	`2`	`&.md-card {`
`3`		`- background-color: #{'BACKGROUND-COLOR-A100'};`
	`3`	`+ background-color: #{'BACKGROUND-COLOR'};`
`4`	`4`
`5`	`5`	`&.md-primary {`
`6`	`6`	`background-color: #{'PRIMARY-COLOR'};`
`@@ -75,7 +75,7 @@`
`75`	`75`
`76`	`76`	`.md-card-expand {`
`77`	`77`	`.md-card-actions {`
`78`		`- background-color: #{'BACKGROUND-COLOR-A100'};`
	`78`	`+ background-color: #{'BACKGROUND-COLOR'};`
`79`	`79`	`}`
`80`	`80`	`}`
`81`	`81`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,6 @@`
`1`	`1`	`.THEME_NAME {`
`2`	`2`	`&.md-dialog-container .md-dialog {`
`3`		`- background-color: #{'BACKGROUND-COLOR-A100'};`
	`3`	`+ background-color: #{'BACKGROUND-COLOR'};`
`4`	`4`	`color: #{'BACKGROUND-CONTRAST'};`
`5`	`5`	`}`
`6`	`6`	`}`
Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,7 @@`
`1`	`1`	`.THEME_NAME {`
`2`	`2`	`&.md-sidenav {`
`3`	`3`	`.md-sidenav-content {`
`4`		`- background-color: #{'BACKGROUND-COLOR-A100'};`
	`4`	`+ background-color: #{'BACKGROUND-COLOR'};`
`5`	`5`	`color: #{'BACKGROUND-CONTRAST'};`
`6`	`6`	`}`
`7`	`7`	`}`