-
- class="tc-{{color}}-"
-
-
50
-
100
-
200
-
300
-
400
-
-
500
-
600
-
700
-
800
-
900
-
-
A100
-
A200
+
+
+
+ To manually color a font color, use our simple tc utility class:
+
+ green fontchoose from any of the material colors, in hues from 50, 100, 200, 300, 400, 500, 600, 700, 800, 900 (and A100, A200, A400, A700 for all except brown, grey & blue-grey)
+
+
+
+ class="tc-{{color}}-"
+
+
50
+
100
+
200
+
300
+
400
+
+
500
+
600
+
700
+
800
+
900
+
-
-
A400
-
A700
+
+
+ class="tc-{{color}}-"
+
+
50
+
100
+
200
+
300
+
400
+
+
500
+
600
+
700
+
800
+
900
+
-
-
-
-
- class="tc-{{color}}-"
-
-
50
-
100
-
200
-
300
-
400
+
To manually color a font color, use our simple tc utility class:
+
+ dark green font
+ ]]>
+
+
choose from any of the dark material colors, in hues from 500, B100, B65, B40, B30 & B15
+
+
+
+ class="tc-dark-{{color}}-"
+
+
500
+
B100
+
B65
+
B40
+
B30
+
B15
+
-
-
500
-
600
-
700
-
800
-
900
+
+
+ class="tc-dark-{{color}}-"
+
+
500
+
B100
+
B65
+
B40
+
B30
+
B15
+
-
-
-
-
+
\ No newline at end of file
diff --git a/src/platform/core/styles/_colors-dark.scss b/src/platform/core/styles/_colors-dark.scss
new file mode 100644
index 0000000000..de1a42e0c8
--- /dev/null
+++ b/src/platform/core/styles/_colors-dark.scss
@@ -0,0 +1,386 @@
+@import 'theme-functions';
+@import 'palette-dark';
+
+// Text color
+
+// 500
+.tc-dark-red-500 { color: md-color($md-dark-red, 500) !important; }
+.tc-dark-pink-500 { color: md-color($md-dark-pink, 500) !important; }
+.tc-dark-purple-500 { color: md-color($md-dark-purple, 500) !important; }
+.tc-dark-deep-purple-500 { color: md-color($md-dark-deep-purple, 500) !important; }
+.tc-dark-indigo-500 { color: md-color($md-dark-indigo, 500) !important; }
+.tc-dark-blue-500 { color: md-color($md-dark-blue, 500) !important; }
+.tc-dark-light-blue-500 { color: md-color($md-dark-light-blue, 500) !important; }
+.tc-dark-cyan-500 { color: md-color($md-dark-cyan, 500) !important; }
+.tc-dark-teal-500 { color: md-color($md-dark-teal, 500) !important; }
+.tc-dark-green-500 { color: md-color($md-dark-green, 500) !important; }
+.tc-dark-light-green-500 { color: md-color($md-dark-light-green, 500) !important; }
+.tc-dark-lime-500 { color: md-color($md-dark-lime, 500) !important; }
+.tc-dark-yellow-500 { color: md-color($md-dark-yellow, 500) !important; }
+.tc-dark-amber-500 { color: md-color($md-dark-amber, 500) !important; }
+.tc-dark-orange-500 { color: md-color($md-dark-orange, 500) !important; }
+.tc-dark-deep-orange-500 { color: md-color($md-dark-deep-orange, 500) !important; }
+.tc-dark-brown-500 { color: md-color($md-dark-brown, 500) !important; }
+.tc-dark-grey-500 { color: md-color($md-dark-grey, 500) !important; }
+.tc-dark-blue-grey-500 { color: md-color($md-dark-blue-grey, 500) !important; }
+
+// B100
+.tc-dark-red-B100 { color: md-color($md-dark-red, B100) !important; }
+.tc-dark-pink-B100 { color: md-color($md-dark-pink, B100) !important; }
+.tc-dark-purple-B100 { color: md-color($md-dark-purple, B100) !important; }
+.tc-dark-deep-purple-B100 { color: md-color($md-dark-deep-purple, B100) !important; }
+.tc-dark-indigo-B100 { color: md-color($md-dark-indigo, B100) !important; }
+.tc-dark-blue-B100 { color: md-color($md-dark-blue, B100) !important; }
+.tc-dark-light-blue-B100 { color: md-color($md-dark-light-blue, B100) !important; }
+.tc-dark-cyan-B100 { color: md-color($md-dark-cyan, B100) !important; }
+.tc-dark-teal-B100 { color: md-color($md-dark-teal, B100) !important; }
+.tc-dark-green-B100 { color: md-color($md-dark-green, B100) !important; }
+.tc-dark-light-green-B100 { color: md-color($md-dark-light-green, B100) !important; }
+.tc-dark-lime-B100 { color: md-color($md-dark-lime, B100) !important; }
+.tc-dark-yellow-B100 { color: md-color($md-dark-yellow, B100) !important; }
+.tc-dark-amber-B100 { color: md-color($md-dark-amber, B100) !important; }
+.tc-dark-orange-B100 { color: md-color($md-dark-orange, B100) !important; }
+.tc-dark-deep-orange-B100 { color: md-color($md-dark-deep-orange, B100) !important; }
+.tc-dark-brown-B100 { color: md-color($md-dark-brown, B100) !important; }
+.tc-dark-grey-B100 { color: md-color($md-dark-grey, B100) !important; }
+.tc-dark-blue-grey-B100 { color: md-color($md-dark-blue-grey, B100) !important; }
+
+// B65
+.tc-dark-red-B65 { color: md-color($md-dark-red, B65) !important; }
+.tc-dark-pink-B65 { color: md-color($md-dark-pink, B65) !important; }
+.tc-dark-purple-B65 { color: md-color($md-dark-purple, B65) !important; }
+.tc-dark-deep-purple-B65 { color: md-color($md-dark-deep-purple, B65) !important; }
+.tc-dark-indigo-B65 { color: md-color($md-dark-indigo, B65) !important; }
+.tc-dark-blue-B65 { color: md-color($md-dark-blue, B65) !important; }
+.tc-dark-light-blue-B65 { color: md-color($md-dark-light-blue, B65) !important; }
+.tc-dark-cyan-B65 { color: md-color($md-dark-cyan, B65) !important; }
+.tc-dark-teal-B65 { color: md-color($md-dark-teal, B65) !important; }
+.tc-dark-green-B65 { color: md-color($md-dark-green, B65) !important; }
+.tc-dark-light-green-B65 { color: md-color($md-dark-light-green, B65) !important; }
+.tc-dark-lime-B65 { color: md-color($md-dark-lime, B65) !important; }
+.tc-dark-yellow-B65 { color: md-color($md-dark-yellow, B65) !important; }
+.tc-dark-amber-B65 { color: md-color($md-dark-amber, B65) !important; }
+.tc-dark-orange-B65 { color: md-color($md-dark-orange, B65) !important; }
+.tc-dark-deep-orange-B65 { color: md-color($md-dark-deep-orange, B65) !important; }
+.tc-dark-brown-B65 { color: md-color($md-dark-brown, B65) !important; }
+.tc-dark-grey-B65 { color: md-color($md-dark-grey, B65) !important; }
+.tc-dark-blue-grey-B65 { color: md-color($md-dark-blue-grey, B65) !important; }
+
+// B40
+.tc-dark-red-B40 { color: md-color($md-dark-red, B40) !important; }
+.tc-dark-pink-B40 { color: md-color($md-dark-pink, B40) !important; }
+.tc-dark-purple-B40 { color: md-color($md-dark-purple, B40) !important; }
+.tc-dark-deep-purple-B40 { color: md-color($md-dark-deep-purple, B40) !important; }
+.tc-dark-indigo-B40 { color: md-color($md-dark-indigo, B40) !important; }
+.tc-dark-blue-B40 { color: md-color($md-dark-blue, B40) !important; }
+.tc-dark-light-blue-B40 { color: md-color($md-dark-light-blue, B40) !important; }
+.tc-dark-cyan-B40 { color: md-color($md-dark-cyan, B40) !important; }
+.tc-dark-teal-B40 { color: md-color($md-dark-teal, B40) !important; }
+.tc-dark-green-B40 { color: md-color($md-dark-green, B40) !important; }
+.tc-dark-light-green-B40 { color: md-color($md-dark-light-green, B40) !important; }
+.tc-dark-lime-B40 { color: md-color($md-dark-lime, B40) !important; }
+.tc-dark-yellow-B40 { color: md-color($md-dark-yellow, B40) !important; }
+.tc-dark-amber-B40 { color: md-color($md-dark-amber, B40) !important; }
+.tc-dark-orange-B40 { color: md-color($md-dark-orange, B40) !important; }
+.tc-dark-deep-orange-B40 { color: md-color($md-dark-deep-orange, B40) !important; }
+.tc-dark-brown-B40 { color: md-color($md-dark-brown, B40) !important; }
+.tc-dark-grey-B40 { color: md-color($md-dark-grey, B40) !important; }
+.tc-dark-blue-grey-B40 { color: md-color($md-dark-blue-grey, B40) !important; }
+
+// B30
+.tc-dark-red-B30 { color: md-color($md-dark-red, B30) !important; }
+.tc-dark-pink-B30 { color: md-color($md-dark-pink, B30) !important; }
+.tc-dark-purple-B30 { color: md-color($md-dark-purple, B30) !important; }
+.tc-dark-deep-purple-B30 { color: md-color($md-dark-deep-purple, B30) !important; }
+.tc-dark-indigo-B30 { color: md-color($md-dark-indigo, B30) !important; }
+.tc-dark-blue-B30 { color: md-color($md-dark-blue, B30) !important; }
+.tc-dark-light-blue-B30 { color: md-color($md-dark-light-blue, B30) !important; }
+.tc-dark-cyan-B30 { color: md-color($md-dark-cyan, B30) !important; }
+.tc-dark-teal-B30 { color: md-color($md-dark-teal, B30) !important; }
+.tc-dark-green-B30 { color: md-color($md-dark-green, B30) !important; }
+.tc-dark-light-green-B30 { color: md-color($md-dark-light-green, B30) !important; }
+.tc-dark-lime-B30 { color: md-color($md-dark-lime, B30) !important; }
+.tc-dark-yellow-B30 { color: md-color($md-dark-yellow, B30) !important; }
+.tc-dark-amber-B30 { color: md-color($md-dark-amber, B30) !important; }
+.tc-dark-orange-B30 { color: md-color($md-dark-orange, B30) !important; }
+.tc-dark-deep-orange-B30 { color: md-color($md-dark-deep-orange, B30) !important; }
+.tc-dark-brown-B30 { color: md-color($md-dark-brown, B30) !important; }
+.tc-dark-grey-B30 { color: md-color($md-dark-grey, B30) !important; }
+.tc-dark-blue-grey-B30 { color: md-color($md-dark-blue-grey, B30) !important; }
+
+// B15
+.tc-dark-red-B15 { color: md-color($md-dark-red, B15) !important; }
+.tc-dark-pink-B15 { color: md-color($md-dark-pink, B15) !important; }
+.tc-dark-purple-B15 { color: md-color($md-dark-purple, B15) !important; }
+.tc-dark-deep-purple-B15 { color: md-color($md-dark-deep-purple, B15) !important; }
+.tc-dark-indigo-B15 { color: md-color($md-dark-indigo, B15) !important; }
+.tc-dark-blue-B15 { color: md-color($md-dark-blue, B15) !important; }
+.tc-dark-light-blue-B15 { color: md-color($md-dark-light-blue, B15) !important; }
+.tc-dark-cyan-B15 { color: md-color($md-dark-cyan, B15) !important; }
+.tc-dark-teal-B15 { color: md-color($md-dark-teal, B15) !important; }
+.tc-dark-green-B15 { color: md-color($md-dark-green, B15) !important; }
+.tc-dark-light-green-B15 { color: md-color($md-dark-light-green, B15) !important; }
+.tc-dark-lime-B15 { color: md-color($md-dark-lime, B15) !important; }
+.tc-dark-yellow-B15 { color: md-color($md-dark-yellow, B15) !important; }
+.tc-dark-amber-B15 { color: md-color($md-dark-amber, B15) !important; }
+.tc-dark-orange-B15 { color: md-color($md-dark-orange, B15) !important; }
+.tc-dark-deep-orange-B15 { color: md-color($md-dark-deep-orange, B15) !important; }
+.tc-dark-brown-B15 { color: md-color($md-dark-brown, B15) !important; }
+.tc-dark-grey-B15 { color: md-color($md-dark-grey, B15) !important; }
+.tc-dark-blue-grey-B15 { color: md-color($md-dark-blue-grey, B15) !important; }
+
+// Background color
+
+// 500
+.bgc-dark-red-500 { background-color: md-color($md-dark-red, 500) !important; }
+.bgc-dark-pink-500 { background-color: md-color($md-dark-pink, 500) !important; }
+.bgc-dark-purple-500 { background-color: md-color($md-dark-purple, 500) !important; }
+.bgc-dark-deep-purple-500 { background-color: md-color($md-dark-deep-purple, 500) !important; }
+.bgc-dark-indigo-500 { background-color: md-color($md-dark-indigo, 500) !important; }
+.bgc-dark-blue-500 { background-color: md-color($md-dark-blue, 500) !important; }
+.bgc-dark-light-blue-500 { background-color: md-color($md-dark-light-blue, 500) !important; }
+.bgc-dark-cyan-500 { background-color: md-color($md-dark-cyan, 500) !important; }
+.bgc-dark-teal-500 { background-color: md-color($md-dark-teal, 500) !important; }
+.bgc-dark-green-500 { background-color: md-color($md-dark-green, 500) !important; }
+.bgc-dark-light-green-500 { background-color: md-color($md-dark-light-green, 500) !important; }
+.bgc-dark-lime-500 { background-color: md-color($md-dark-lime, 500) !important; }
+.bgc-dark-yellow-500 { background-color: md-color($md-dark-yellow, 500) !important; }
+.bgc-dark-amber-500 { background-color: md-color($md-dark-amber, 500) !important; }
+.bgc-dark-orange-500 { background-color: md-color($md-dark-orange, 500) !important; }
+.bgc-dark-deep-orange-500 { background-color: md-color($md-dark-deep-orange, 500) !important; }
+.bgc-dark-brown-500 { background-color: md-color($md-dark-brown, 500) !important; }
+.bgc-dark-grey-500 { background-color: md-color($md-dark-grey, 500) !important; }
+.bgc-dark-blue-grey-500 { background-color: md-color($md-dark-blue-grey, 500) !important; }
+
+// B100
+.bgc-dark-red-B100 { background-color: md-color($md-dark-red, B100) !important; }
+.bgc-dark-pink-B100 { background-color: md-color($md-dark-pink, B100) !important; }
+.bgc-dark-purple-B100 { background-color: md-color($md-dark-purple, B100) !important; }
+.bgc-dark-deep-purple-B100 { background-color: md-color($md-dark-deep-purple, B100) !important; }
+.bgc-dark-indigo-B100 { background-color: md-color($md-dark-indigo, B100) !important; }
+.bgc-dark-blue-B100 { background-color: md-color($md-dark-blue, B100) !important; }
+.bgc-dark-light-blue-B100 { background-color: md-color($md-dark-light-blue, B100) !important; }
+.bgc-dark-cyan-B100 { background-color: md-color($md-dark-cyan, B100) !important; }
+.bgc-dark-teal-B100 { background-color: md-color($md-dark-teal, B100) !important; }
+.bgc-dark-green-B100 { background-color: md-color($md-dark-green, B100) !important; }
+.bgc-dark-light-green-B100 { background-color: md-color($md-dark-light-green, B100) !important; }
+.bgc-dark-lime-B100 { background-color: md-color($md-dark-lime, B100) !important; }
+.bgc-dark-yellow-B100 { background-color: md-color($md-dark-yellow, B100) !important; }
+.bgc-dark-amber-B100 { background-color: md-color($md-dark-amber, B100) !important; }
+.bgc-dark-orange-B100 { background-color: md-color($md-dark-orange, B100) !important; }
+.bgc-dark-deep-orange-B100 { background-color: md-color($md-dark-deep-orange, B100) !important; }
+.bgc-dark-brown-B100 { background-color: md-color($md-dark-brown, B100) !important; }
+.bgc-dark-grey-B100 { background-color: md-color($md-dark-grey, B100) !important; }
+.bgc-dark-blue-grey-B100 { background-color: md-color($md-dark-blue-grey, B100) !important; }
+
+// B65
+.bgc-dark-red-B65 { background-color: md-color($md-dark-red, B65) !important; }
+.bgc-dark-pink-B65 { background-color: md-color($md-dark-pink, B65) !important; }
+.bgc-dark-purple-B65 { background-color: md-color($md-dark-purple, B65) !important; }
+.bgc-dark-deep-purple-B65 { background-color: md-color($md-dark-deep-purple, B65) !important; }
+.bgc-dark-indigo-B65 { background-color: md-color($md-dark-indigo, B65) !important; }
+.bgc-dark-blue-B65 { background-color: md-color($md-dark-blue, B65) !important; }
+.bgc-dark-light-blue-B65 { background-color: md-color($md-dark-light-blue, B65) !important; }
+.bgc-dark-cyan-B65 { background-color: md-color($md-dark-cyan, B65) !important; }
+.bgc-dark-teal-B65 { background-color: md-color($md-dark-teal, B65) !important; }
+.bgc-dark-green-B65 { background-color: md-color($md-dark-green, B65) !important; }
+.bgc-dark-light-green-B65 { background-color: md-color($md-dark-light-green, B65) !important; }
+.bgc-dark-lime-B65 { background-color: md-color($md-dark-lime, B65) !important; }
+.bgc-dark-yellow-B65 { background-color: md-color($md-dark-yellow, B65) !important; }
+.bgc-dark-amber-B65 { background-color: md-color($md-dark-amber, B65) !important; }
+.bgc-dark-orange-B65 { background-color: md-color($md-dark-orange, B65) !important; }
+.bgc-dark-deep-orange-B65 { background-color: md-color($md-dark-deep-orange, B65) !important; }
+.bgc-dark-brown-B65 { background-color: md-color($md-dark-brown, B65) !important; }
+.bgc-dark-grey-B65 { background-color: md-color($md-dark-grey, B65) !important; }
+.bgc-dark-blue-grey-B65 { background-color: md-color($md-dark-blue-grey, B65) !important; }
+
+// B40
+.bgc-dark-red-B40 { background-color: md-color($md-dark-red, B40) !important; }
+.bgc-dark-pink-B40 { background-color: md-color($md-dark-pink, B40) !important; }
+.bgc-dark-purple-B40 { background-color: md-color($md-dark-purple, B40) !important; }
+.bgc-dark-deep-purple-B40 { background-color: md-color($md-dark-deep-purple, B40) !important; }
+.bgc-dark-indigo-B40 { background-color: md-color($md-dark-indigo, B40) !important; }
+.bgc-dark-blue-B40 { background-color: md-color($md-dark-blue, B40) !important; }
+.bgc-dark-light-blue-B40 { background-color: md-color($md-dark-light-blue, B40) !important; }
+.bgc-dark-cyan-B40 { background-color: md-color($md-dark-cyan, B40) !important; }
+.bgc-dark-teal-B40 { background-color: md-color($md-dark-teal, B40) !important; }
+.bgc-dark-green-B40 { background-color: md-color($md-dark-green, B40) !important; }
+.bgc-dark-light-green-B40 { background-color: md-color($md-dark-light-green, B40) !important; }
+.bgc-dark-lime-B40 { background-color: md-color($md-dark-lime, B40) !important; }
+.bgc-dark-yellow-B40 { background-color: md-color($md-dark-yellow, B40) !important; }
+.bgc-dark-amber-B40 { background-color: md-color($md-dark-amber, B40) !important; }
+.bgc-dark-orange-B40 { background-color: md-color($md-dark-orange, B40) !important; }
+.bgc-dark-deep-orange-B40 { background-color: md-color($md-dark-deep-orange, B40) !important; }
+.bgc-dark-brown-B40 { background-color: md-color($md-dark-brown, B40) !important; }
+.bgc-dark-grey-B40 { background-color: md-color($md-dark-grey, B40) !important; }
+.bgc-dark-blue-grey-B40 { background-color: md-color($md-dark-blue-grey, B40) !important; }
+
+// B30
+.bgc-dark-red-B30 { background-color: md-color($md-dark-red, B30) !important; }
+.bgc-dark-pink-B30 { background-color: md-color($md-dark-pink, B30) !important; }
+.bgc-dark-purple-B30 { background-color: md-color($md-dark-purple, B30) !important; }
+.bgc-dark-deep-purple-B30 { background-color: md-color($md-dark-deep-purple, B30) !important; }
+.bgc-dark-indigo-B30 { background-color: md-color($md-dark-indigo, B30) !important; }
+.bgc-dark-blue-B30 { background-color: md-color($md-dark-blue, B30) !important; }
+.bgc-dark-light-blue-B30 { background-color: md-color($md-dark-light-blue, B30) !important; }
+.bgc-dark-cyan-B30 { background-color: md-color($md-dark-cyan, B30) !important; }
+.bgc-dark-teal-B30 { background-color: md-color($md-dark-teal, B30) !important; }
+.bgc-dark-green-B30 { background-color: md-color($md-dark-green, B30) !important; }
+.bgc-dark-light-green-B30 { background-color: md-color($md-dark-light-green, B30) !important; }
+.bgc-dark-lime-B30 { background-color: md-color($md-dark-lime, B30) !important; }
+.bgc-dark-yellow-B30 { background-color: md-color($md-dark-yellow, B30) !important; }
+.bgc-dark-amber-B30 { background-color: md-color($md-dark-amber, B30) !important; }
+.bgc-dark-orange-B30 { background-color: md-color($md-dark-orange, B30) !important; }
+.bgc-dark-deep-orange-B30 { background-color: md-color($md-dark-deep-orange, B30) !important; }
+.bgc-dark-brown-B30 { background-color: md-color($md-dark-brown, B30) !important; }
+.bgc-dark-grey-B30 { background-color: md-color($md-dark-grey, B30) !important; }
+.bgc-dark-blue-grey-B30 { background-color: md-color($md-dark-blue-grey, B30) !important; }
+
+// B15
+.bgc-dark-red-B15 { background-color: md-color($md-dark-red, B15) !important; }
+.bgc-dark-pink-B15 { background-color: md-color($md-dark-pink, B15) !important; }
+.bgc-dark-purple-B15 { background-color: md-color($md-dark-purple, B15) !important; }
+.bgc-dark-deep-purple-B15 { background-color: md-color($md-dark-deep-purple, B15) !important; }
+.bgc-dark-indigo-B15 { background-color: md-color($md-dark-indigo, B15) !important; }
+.bgc-dark-blue-B15 { background-color: md-color($md-dark-blue, B15) !important; }
+.bgc-dark-light-blue-B15 { background-color: md-color($md-dark-light-blue, B15) !important; }
+.bgc-dark-cyan-B15 { background-color: md-color($md-dark-cyan, B15) !important; }
+.bgc-dark-teal-B15 { background-color: md-color($md-dark-teal, B15) !important; }
+.bgc-dark-green-B15 { background-color: md-color($md-dark-green, B15) !important; }
+.bgc-dark-light-green-B15 { background-color: md-color($md-dark-light-green, B15) !important; }
+.bgc-dark-lime-B15 { background-color: md-color($md-dark-lime, B15) !important; }
+.bgc-dark-yellow-B15 { background-color: md-color($md-dark-yellow, B15) !important; }
+.bgc-dark-amber-B15 { background-color: md-color($md-dark-amber, B15) !important; }
+.bgc-dark-orange-B15 { background-color: md-color($md-dark-orange, B15) !important; }
+.bgc-dark-deep-orange-B15 { background-color: md-color($md-dark-deep-orange, B15) !important; }
+.bgc-dark-brown-B15 { background-color: md-color($md-dark-brown, B15) !important; }
+.bgc-dark-grey-B15 { background-color: md-color($md-dark-grey, B15) !important; }
+.bgc-dark-blue-grey-B15 { background-color: md-color($md-dark-blue-grey, B15) !important; }
+
+// Fill color
+
+// 500
+.fill-red-500 { fill: md-color($md-dark-red, 500) !important; }
+.fill-pink-500 { fill: md-color($md-dark-pink, 500) !important; }
+.fill-purple-500 { fill: md-color($md-dark-purple, 500) !important; }
+.fill-deep-purple-500 { fill: md-color($md-dark-deep-purple, 500) !important; }
+.fill-indigo-500 { fill: md-color($md-dark-indigo, 500) !important; }
+.fill-blue-500 { fill: md-color($md-dark-blue, 500) !important; }
+.fill-light-blue-500 { fill: md-color($md-dark-light-blue, 500) !important; }
+.fill-cyan-500 { fill: md-color($md-dark-cyan, 500) !important; }
+.fill-teal-500 { fill: md-color($md-dark-teal, 500) !important; }
+.fill-green-500 { fill: md-color($md-dark-green, 500) !important; }
+.fill-light-green-500 { fill: md-color($md-dark-light-green, 500) !important; }
+.fill-lime-500 { fill: md-color($md-dark-lime, 500) !important; }
+.fill-yellow-500 { fill: md-color($md-dark-yellow, 500) !important; }
+.fill-amber-500 { fill: md-color($md-dark-amber, 500) !important; }
+.fill-orange-500 { fill: md-color($md-dark-orange, 500) !important; }
+.fill-deep-orange-500 { fill: md-color($md-dark-deep-orange, 500) !important; }
+.fill-brown-500 { fill: md-color($md-dark-brown, 500) !important; }
+.fill-grey-500 { fill: md-color($md-dark-grey, 500) !important; }
+.fill-blue-grey-500 { fill: md-color($md-dark-blue-grey, 500) !important; }
+
+// B100
+.fill-red-B100 { fill: md-color($md-dark-red, B100) !important; }
+.fill-pink-B100 { fill: md-color($md-dark-pink, B100) !important; }
+.fill-purple-B100 { fill: md-color($md-dark-purple, B100) !important; }
+.fill-deep-purple-B100 { fill: md-color($md-dark-deep-purple, B100) !important; }
+.fill-indigo-B100 { fill: md-color($md-dark-indigo, B100) !important; }
+.fill-blue-B100 { fill: md-color($md-dark-blue, B100) !important; }
+.fill-light-blue-B100 { fill: md-color($md-dark-light-blue, B100) !important; }
+.fill-cyan-B100 { fill: md-color($md-dark-cyan, B100) !important; }
+.fill-teal-B100 { fill: md-color($md-dark-teal, B100) !important; }
+.fill-green-B100 { fill: md-color($md-dark-green, B100) !important; }
+.fill-light-green-B100 { fill: md-color($md-dark-light-green, B100) !important; }
+.fill-lime-B100 { fill: md-color($md-dark-lime, B100) !important; }
+.fill-yellow-B100 { fill: md-color($md-dark-yellow, B100) !important; }
+.fill-amber-B100 { fill: md-color($md-dark-amber, B100) !important; }
+.fill-orange-B100 { fill: md-color($md-dark-orange, B100) !important; }
+.fill-deep-orange-B100 { fill: md-color($md-dark-deep-orange, B100) !important; }
+.fill-brown-B100 { fill: md-color($md-dark-brown, B100) !important; }
+.fill-grey-B100 { fill: md-color($md-dark-grey, B100) !important; }
+.fill-blue-grey-B100 { fill: md-color($md-dark-blue-grey, B100) !important; }
+
+// B65
+.fill-red-B65 { fill: md-color($md-dark-red, B65) !important; }
+.fill-pink-B65 { fill: md-color($md-dark-pink, B65) !important; }
+.fill-purple-B65 { fill: md-color($md-dark-purple, B65) !important; }
+.fill-deep-purple-B65 { fill: md-color($md-dark-deep-purple, B65) !important; }
+.fill-indigo-B65 { fill: md-color($md-dark-indigo, B65) !important; }
+.fill-blue-B65 { fill: md-color($md-dark-blue, B65) !important; }
+.fill-light-blue-B65 { fill: md-color($md-dark-light-blue, B65) !important; }
+.fill-cyan-B65 { fill: md-color($md-dark-cyan, B65) !important; }
+.fill-teal-B65 { fill: md-color($md-dark-teal, B65) !important; }
+.fill-green-B65 { fill: md-color($md-dark-green, B65) !important; }
+.fill-light-green-B65 { fill: md-color($md-dark-light-green, B65) !important; }
+.fill-lime-B65 { fill: md-color($md-dark-lime, B65) !important; }
+.fill-yellow-B65 { fill: md-color($md-dark-yellow, B65) !important; }
+.fill-amber-B65 { fill: md-color($md-dark-amber, B65) !important; }
+.fill-orange-B65 { fill: md-color($md-dark-orange, B65) !important; }
+.fill-deep-orange-B65 { fill: md-color($md-dark-deep-orange, B65) !important; }
+.fill-brown-B65 { fill: md-color($md-dark-brown, B65) !important; }
+.fill-grey-B65 { fill: md-color($md-dark-grey, B65) !important; }
+.fill-blue-grey-B65 { fill: md-color($md-dark-blue-grey, B65) !important; }
+
+// B40
+.fill-red-B40 { fill: md-color($md-dark-red, B40) !important; }
+.fill-pink-B40 { fill: md-color($md-dark-pink, B40) !important; }
+.fill-purple-B40 { fill: md-color($md-dark-purple, B40) !important; }
+.fill-deep-purple-B40 { fill: md-color($md-dark-deep-purple, B40) !important; }
+.fill-indigo-B40 { fill: md-color($md-dark-indigo, B40) !important; }
+.fill-blue-B40 { fill: md-color($md-dark-blue, B40) !important; }
+.fill-light-blue-B40 { fill: md-color($md-dark-light-blue, B40) !important; }
+.fill-cyan-B40 { fill: md-color($md-dark-cyan, B40) !important; }
+.fill-teal-B40 { fill: md-color($md-dark-teal, B40) !important; }
+.fill-green-B40 { fill: md-color($md-dark-green, B40) !important; }
+.fill-light-green-B40 { fill: md-color($md-dark-light-green, B40) !important; }
+.fill-lime-B40 { fill: md-color($md-dark-lime, B40) !important; }
+.fill-yellow-B40 { fill: md-color($md-dark-yellow, B40) !important; }
+.fill-amber-B40 { fill: md-color($md-dark-amber, B40) !important; }
+.fill-orange-B40 { fill: md-color($md-dark-orange, B40) !important; }
+.fill-deep-orange-B40 { fill: md-color($md-dark-deep-orange, B40) !important; }
+.fill-brown-B40 { fill: md-color($md-dark-brown, B40) !important; }
+.fill-grey-B40 { fill: md-color($md-dark-grey, B40) !important; }
+.fill-blue-grey-B40 { fill: md-color($md-dark-blue-grey, B40) !important; }
+
+// B30
+.fill-red-B30 { fill: md-color($md-dark-red, B30) !important; }
+.fill-pink-B30 { fill: md-color($md-dark-pink, B30) !important; }
+.fill-purple-B30 { fill: md-color($md-dark-purple, B30) !important; }
+.fill-deep-purple-B30 { fill: md-color($md-dark-deep-purple, B30) !important; }
+.fill-indigo-B30 { fill: md-color($md-dark-indigo, B30) !important; }
+.fill-blue-B30 { fill: md-color($md-dark-blue, B30) !important; }
+.fill-light-blue-B30 { fill: md-color($md-dark-light-blue, B30) !important; }
+.fill-cyan-B30 { fill: md-color($md-dark-cyan, B30) !important; }
+.fill-teal-B30 { fill: md-color($md-dark-teal, B30) !important; }
+.fill-green-B30 { fill: md-color($md-dark-green, B30) !important; }
+.fill-light-green-B30 { fill: md-color($md-dark-light-green, B30) !important; }
+.fill-lime-B30 { fill: md-color($md-dark-lime, B30) !important; }
+.fill-yellow-B30 { fill: md-color($md-dark-yellow, B30) !important; }
+.fill-amber-B30 { fill: md-color($md-dark-amber, B30) !important; }
+.fill-orange-B30 { fill: md-color($md-dark-orange, B30) !important; }
+.fill-deep-orange-B30 { fill: md-color($md-dark-deep-orange, B30) !important; }
+.fill-brown-B30 { fill: md-color($md-dark-brown, B30) !important; }
+.fill-grey-B30 { fill: md-color($md-dark-grey, B30) !important; }
+.fill-blue-grey-B30 { fill: md-color($md-dark-blue-grey, B30) !important; }
+
+// B15
+.fill-red-B15 { fill: md-color($md-dark-red, B15) !important; }
+.fill-pink-B15 { fill: md-color($md-dark-pink, B15) !important; }
+.fill-purple-B15 { fill: md-color($md-dark-purple, B15) !important; }
+.fill-deep-purple-B15 { fill: md-color($md-dark-deep-purple, B15) !important; }
+.fill-indigo-B15 { fill: md-color($md-dark-indigo, B15) !important; }
+.fill-blue-B15 { fill: md-color($md-dark-blue, B15) !important; }
+.fill-light-blue-B15 { fill: md-color($md-dark-light-blue, B15) !important; }
+.fill-cyan-B15 { fill: md-color($md-dark-cyan, B15) !important; }
+.fill-teal-B15 { fill: md-color($md-dark-teal, B15) !important; }
+.fill-green-B15 { fill: md-color($md-dark-green, B15) !important; }
+.fill-light-green-B15 { fill: md-color($md-dark-light-green, B15) !important; }
+.fill-lime-B15 { fill: md-color($md-dark-lime, B15) !important; }
+.fill-yellow-B15 { fill: md-color($md-dark-yellow, B15) !important; }
+.fill-amber-B15 { fill: md-color($md-dark-amber, B15) !important; }
+.fill-orange-B15 { fill: md-color($md-dark-orange, B15) !important; }
+.fill-deep-orange-B15 { fill: md-color($md-dark-deep-orange, B15) !important; }
+.fill-brown-B15 { fill: md-color($md-dark-brown, B15) !important; }
+.fill-grey-B15 { fill: md-color($md-dark-grey, B15) !important; }
+.fill-blue-grey-B15 { fill: md-color($md-dark-blue-grey, B15) !important; }
diff --git a/src/platform/core/styles/_palette-dark.scss b/src/platform/core/styles/_palette-dark.scss
new file mode 100644
index 0000000000..b290428950
--- /dev/null
+++ b/src/platform/core/styles/_palette-dark.scss
@@ -0,0 +1,326 @@
+// Contrasting colors
+$black-87-opacity: rgba(black, 0.87);
+$white-87-opacity: rgba(white, 0.87);
+// Dark color palettes.
+$md-dark-red: (
+ 500: #f44336,
+ B100: #ff4336,
+ B65: #a62c23,
+ B40: #661b15,
+ B30: #4d1410,
+ B15: #330d0b,
+ contrast: (
+ 500: $black-87-opacity,
+ B100: $black-87-opacity,
+ B65: $black-87-opacity,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
+
+$md-dark-pink: (
+ 500: #e91e63,
+ B100: #ff216b,
+ B65: #A41A47,
+ B40: #660d2b,
+ B30: #4d0a20,
+ B15: #260510,
+ contrast: (
+ 500: $black-87-opacity,
+ B100: $black-87-opacity,
+ B65: $black-87-opacity,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
+
+$md-dark-purple: (
+ 500: #9c27b0,
+ B100: #ec80ff,
+ B65: #9224a6,
+ B40: #5a1666,
+ B30: #41004d,
+ B15: #210026,
+ contrast: (
+ 500: $black-87-opacity,
+ B100: $black-87-opacity,
+ B65: $black-87-opacity,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
+
+$md-dark-deep-purple: (
+ 500: #673ab7,
+ B100: #ae80ff,
+ B65: #5e35a6,
+ B40: #3a2166,
+ B30: #1c004d,
+ B15: #0e0026,
+ contrast: (
+ 500: white,
+ B100: white,
+ B65: white,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
+
+$md-dark-indigo: (
+ 500: #3f51b5,
+ B100: #8093ff,
+ B65: #3a4aa6,
+ B40: #242e66,
+ B30: #000b4d,
+ B15: #000626,
+ contrast: (
+ 500: white,
+ B100: white,
+ B65: white,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
+
+$md-dark-blue: (
+ 500: #2196f3,
+ B100: #80c6ff,
+ B65: #1766a6,
+ B40: #0e3f66,
+ B30: #002a4d,
+ B15: #001526,
+ contrast: (
+ 500: white,
+ B100: white,
+ B65: white,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
+
+$md-dark-light-blue: (
+ 500: #03a9f4,
+ B100: #80d7ff,
+ B65: #0272a6,
+ B40: #014666,
+ B30: #00344d,
+ B15: #001a26,
+ contrast: (
+ 500: white,
+ B100: white,
+ B65: white,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
+
+$md-dark-cyan: (
+ 500: #00bcd4,
+ B100: #00e1ff,
+ B65: #0092a6,
+ B40: #005a66,
+ B30: #00444d,
+ B15: #002226,
+ contrast: (
+ 500: white,
+ B100: white,
+ B65: white,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
+
+$md-dark-teal: (
+ 500: #009688,
+ B100: #00ffe5,
+ B65: #00a695,
+ B40: #00665c,
+ B30: #004d45,
+ B15: #002622,
+ contrast: (
+ 500: white,
+ B100: white,
+ B65: white,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
+
+$md-dark-green: (
+ 500: #4caf50,
+ B100: #6eff72,
+ B65: #47a64a,
+ B40: #2c662e,
+ B30: #214d22,
+ B15: #102611,
+ contrast: (
+ 500: white,
+ B100: white,
+ B65: white,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
+
+$md-dark-light-green: (
+ 500: #8bc34a,
+ B100: #b5ff61,
+ B65: #76a63f,
+ B40: #486627,
+ B30: #364d1d,
+ B15: #1b260f,
+ contrast: (
+ 500: $black-87-opacity,
+ B100: $black-87-opacity,
+ B65: white,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
+
+$md-dark-lime: (
+ 500: #cddc39,
+ B100: #ecff42,
+ B65: #99a62b,
+ B40: #5e661b,
+ B30: #474d14,
+ B15: #172621,
+ contrast: (
+ 500: $black-87-opacity,
+ B100: $black-87-opacity,
+ B65: $black-87-opacity,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
+
+$md-dark-yellow: (
+ 500: #ffeb3b,
+ B100: #ffeb3b,
+ B65: #a69926,
+ B40: #665e17,
+ B30: #4d4712,
+ B15: #26160c,
+ contrast: (
+ 500: $black-87-opacity,
+ B100: $black-87-opacity,
+ B65: $black-87-opacity,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
+
+$md-dark-amber: (
+ 500: #ffc107,
+ B100: #ffc107,
+ B65: #a67e05,
+ B40: #664d03,
+ B30: #4d3a02,
+ B15: #261c15,
+ contrast: (
+ 500: $black-87-opacity,
+ B100: $black-87-opacity,
+ B65: $black-87-opacity,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
+
+$md-dark-orange: (
+ 500: #ff9800,
+ B100: #ff9800,
+ B65: #a66300,
+ B40: #663d00,
+ B30: #4d2e00,
+ B15: #261700,
+ contrast: (
+ 500: $black-87-opacity,
+ B100: $black-87-opacity,
+ B65: $black-87-opacity,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
+
+$md-dark-deep-orange: (
+ 500: #ff5722,
+ B100: #ff5722,
+ B65: #a63716,
+ B40: #66220d,
+ B30: #4d190a,
+ B15: #260d05,
+ contrast: (
+ 500: $black-87-opacity,
+ B100: $black-87-opacity,
+ B65: $black-87-opacity,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
+
+$md-dark-brown: (
+ 500: #795548,
+ B100: #ffb499,
+ B65: #a67563,
+ B40: #66483d,
+ B30: #4d362e,
+ B15: #261b17,
+ contrast: (
+ 500: white,
+ B100: white,
+ B65: white,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
+
+$md-dark-grey: (
+ 500: #9e9e9e,
+ B100: #ffffff,
+ B65: #a6a6a6,
+ B40: #666666,
+ B30: #4d4d4d,
+ B15: #262626,
+ contrast: (
+ 500: $black-87-opacity,
+ B100: $black-87-opacity,
+ B65: $black-87-opacity,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
+
+$md-dark-blue-grey: (
+ 500: #607d8b,
+ B100: #b0e5ff,
+ B65: #7295a6,
+ B40: #465b66,
+ B30: #35454d,
+ B15: #1a2226,
+ contrast: (
+ 500: white,
+ B100: white,
+ B65: white,
+ B40: white,
+ B30: white,
+ B15: white,
+ )
+);
diff --git a/src/platform/core/styles/platform.scss b/src/platform/core/styles/platform.scss
index 3230fd6a51..196e1a843c 100644
--- a/src/platform/core/styles/platform.scss
+++ b/src/platform/core/styles/platform.scss
@@ -13,7 +13,9 @@ $md-font-url: 'font/';
@import "navigation-drawer";
@import "theme-functions";
@import "palette";
+@import "palette-dark";
@import "colors";
+@import "colors-dark";
@import "layout";
@import "list";
@import "structure";
diff --git a/src/theme.scss b/src/theme.scss
index 6a9c24fb65..a05b71d20a 100644
--- a/src/theme.scss
+++ b/src/theme.scss
@@ -32,7 +32,8 @@ $theme: md-light-theme($primary, $accent, $warn);
$blue-orange: md-light-theme($primary2, $accent2, $warn2);
- @include angular-material-theme($blue-orange);
+ @include angular-material-theme($blue-orange);
+ @include covalent-theme($blue-orange);
}
.blue-grey-deep-orange {
@@ -42,5 +43,6 @@ $theme: md-light-theme($primary, $accent, $warn);
$blue-grey-deep-orange: md-light-theme($primary3, $accent3, $warn3);
- @include angular-material-theme($blue-grey-deep-orange);
+ @include angular-material-theme($blue-grey-deep-orange);
+ @include covalent-theme($blue-grey-deep-orange);
}