j1-template 2021.1.18 → 2021.1.22
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/_includes/themes/j1/layouts/content_generator_post.html +2 -1
- data/_includes/themes/j1/layouts/layout_metadata_generator.html +3 -0
- data/_includes/themes/j1/procedures/global/attributes_loader.proc +4 -0
- data/_includes/themes/j1/procedures/posts/collate_timeline.proc +12 -7
- data/_includes/themes/j1/procedures/posts/create_series_header.proc +21 -11
- data/_layouts/default.html +3 -120
- data/assets/data/banner.html +19 -18
- data/assets/data/cookieconsent.html +7 -4
- data/assets/data/gallery_customizer.html +106 -19
- data/assets/data/panel.html +30 -19
- data/assets/data/quicklinks.html +0 -2
- data/assets/data/rtext_resizer.html +130 -0
- data/assets/error_pages/HTTP204.html +3 -1
- data/assets/error_pages/HTTP400.html +3 -1
- data/assets/error_pages/HTTP401.html +3 -1
- data/assets/error_pages/HTTP403.html +3 -1
- data/assets/error_pages/HTTP404.html +3 -1
- data/assets/error_pages/HTTP444.html +3 -1
- data/assets/error_pages/HTTP500.html +3 -1
- data/assets/error_pages/HTTP501.html +3 -1
- data/assets/error_pages/HTTP502.html +3 -1
- data/assets/error_pages/HTTP503.html +6 -2
- data/assets/themes/j1/adapter/js/clipboard.js +26 -4
- data/assets/themes/j1/adapter/js/cookieConsent.js +19 -2
- data/assets/themes/j1/adapter/js/j1.js +38 -2
- data/assets/themes/j1/adapter/js/justifiedGalleryCustomizer.js +17 -27
- data/assets/themes/j1/adapter/js/rtextResizer.js +293 -0
- data/assets/themes/j1/adapter/js/themer.js +10 -6
- data/assets/themes/j1/core/css/themes/uno-light/bootstrap.css +49 -3
- data/assets/themes/j1/core/css/themes/uno-light/bootstrap.min.css +1 -1
- data/assets/themes/j1/core/css/vendor.css +187 -0
- data/assets/themes/j1/core/css/vendor.min.css +1 -1
- data/assets/themes/j1/core/js/template.js +2 -2
- data/assets/themes/j1/core/js/template.js.map +1 -1
- data/assets/themes/j1/core/js/template.min.js +2 -2
- data/assets/themes/j1/core/js/template.min.js.map +1 -1
- data/assets/themes/j1/modules/lightGallery/js/core/j1/lightgallery-x.js +7 -0
- data/assets/themes/j1/modules/lightGallery/js/modules/j1/j1-x-video.js +56 -44
- data/assets/themes/j1/modules/mdiPreviewer/css/previewer.css +1 -1
- data/assets/themes/j1/modules/mdiPreviewer/css/previewer.min.css +1 -1
- data/assets/themes/j1/modules/mdiPreviewer/js/previewer.js +12 -2
- data/assets/themes/j1/modules/mdiPreviewer/js/previewer.min.js +1 -1
- data/assets/themes/j1/modules/twemoji/css/picker/twemoji-picker.css +1 -1
- data/assets/themes/j1/modules/twemoji/css/picker/twemoji-picker.min.css +1 -1
- data/assets/themes/j1/modules/twemoji/js/picker/twemoji-picker.js +35 -6
- data/assets/themes/j1/modules/twemoji/js/picker/twemoji-picker.min.js +1 -1
- data/lib/j1/version.rb +1 -1
- data/lib/starter_web/Gemfile +1 -1
- data/lib/starter_web/_config.yml +2 -2
- data/lib/starter_web/_data/_defaults/resources.yml +29 -11
- data/lib/starter_web/_data/apps/justifiedGallery.yml +40 -0
- data/lib/starter_web/_data/blocks/banner.yml +8 -8
- data/lib/starter_web/_data/blocks/footer.yml +5 -7
- data/lib/starter_web/_data/blocks/panel.yml +27 -17
- data/lib/starter_web/_data/resources.yml +24 -3
- data/lib/starter_web/_includes/attributes.asciidoc +13 -2
- data/lib/starter_web/_plugins/lunr_index.rb +1 -1
- data/lib/starter_web/assets/images/modules/attics/franck-1920x1280.jpg +0 -0
- data/lib/starter_web/assets/images/pages/roundtrip/500_themes/themes-menu-1280x800.jpg +0 -0
- data/lib/starter_web/assets/images/pages/videos/szabo-viktor-1920x1280.jpg +0 -0
- data/lib/starter_web/assets/videos/tiktok/einhorn.jpg +0 -0
- data/lib/starter_web/assets/videos/tiktok/waluschka.jpg +0 -0
- data/lib/starter_web/collections/posts/public/featured/_posts/0000-00-00-welcome-to-j1.adoc.erb +1 -0
- data/lib/starter_web/collections/posts/public/featured/_posts/2020-01-01-about-cookies.adoc +1 -2
- data/lib/starter_web/collections/posts/public/featured/_posts/2021-03-01-site-generators.adoc +1 -1
- data/lib/starter_web/collections/posts/public/featured/_posts/2021-03-03-about-j1.adoc +1 -2
- data/lib/starter_web/collections/posts/public/featured/_posts/_includes/attributes.asciidoc +7 -1
- data/lib/starter_web/collections/posts/public/series/_posts/2020-01-01-post-test-series.adoc +1 -3
- data/lib/starter_web/collections/posts/public/series/_posts/2020-01-02-post-test-series.adoc +1 -3
- data/lib/starter_web/collections/posts/public/series/_posts/2020-01-03-post-test-series.adoc +1 -3
- data/lib/starter_web/collections/posts/public/series/_posts/2020-01-04-post-test-series.adoc +2 -3
- data/lib/starter_web/collections/posts/public/wikipedia/_posts/2016-11-20-minneapolis.adoc +2 -1
- data/lib/starter_web/collections/posts/public/wikipedia/_posts/2016-11-24-narcisse-snake-dens.adoc +2 -2
- data/lib/starter_web/collections/posts/public/wikipedia/_posts/2016-11-26-columbia-river.adoc +2 -2
- data/lib/starter_web/collections/posts/public/wikipedia/_posts/_includes/attributes.asciidoc +7 -0
- data/lib/starter_web/package.json +1 -1
- data/lib/starter_web/pages/public/asciidoc_skeletons/book/_includes/attributes.asciidoc +7 -1
- data/lib/starter_web/pages/public/asciidoc_skeletons/multi-document/_includes/attributes.asciidoc +7 -1
- data/lib/starter_web/pages/public/blog/navigator/archive/categoryview.html +3 -1
- data/lib/starter_web/pages/public/blog/navigator/archive/dateview.html +3 -1
- data/lib/starter_web/pages/public/blog/navigator/archive/tagview.html +3 -1
- data/lib/starter_web/pages/public/blog/navigator/archive.html +3 -2
- data/lib/starter_web/pages/public/learn/roundtrip/100_present_images.adoc +1 -1
- data/lib/starter_web/pages/public/learn/roundtrip/500_themes.adoc +4 -1
- data/lib/starter_web/pages/public/learn/roundtrip/_includes/attributes.asciidoc +11 -0
- data/lib/starter_web/pages/public/legal/de/100_copyright.adoc +2 -2
- data/lib/starter_web/pages/public/legal/de/100_impress.adoc +1 -1
- data/lib/starter_web/pages/public/legal/de/300_privacy.adoc +272 -126
- data/lib/starter_web/pages/public/legal/de/400_comment_policy.adoc +27 -50
- data/lib/starter_web/pages/public/legal/en/300_privacy.adoc +243 -198
- data/lib/starter_web/pages/public/previewer/_includes/attributes.asciidoc +6 -0
- data/lib/starter_web/pages/public/previewer/md_color_palette.adoc +338 -275
- data/lib/starter_web/pages/public/previewer/rouge.adoc +1 -1
- data/lib/starter_web/pages/public/previewer/twitter_emoji_preview.adoc +3 -3
- data/lib/starter_web/utilsrv/_defaults/package.json +1 -1
- data/lib/starter_web/utilsrv/package.json +1 -1
- metadata +9 -5
- data/assets/themes/j1/modules/kofax.7z +0 -0
- data/assets/themes/j1/modules/mdiPreviewer/js/previewer.new.js +0 -111
- data/assets/themes/j1/modules/mdiPreviewer/js/previewer.old.js +0 -103
|
@@ -8,6 +8,12 @@ tag::urls[]
|
|
|
8
8
|
end::urls[]
|
|
9
9
|
|
|
10
10
|
|
|
11
|
+
// FOOTNOTES, global asciidoc attributes (variables)
|
|
12
|
+
// -----------------------------------------------------------------------------
|
|
13
|
+
tag::footnotes[]
|
|
14
|
+
end::footnotes[]
|
|
15
|
+
|
|
16
|
+
|
|
11
17
|
// Tags - Asciidoc attributes used internally
|
|
12
18
|
// -----------------------------------------------------------------------------
|
|
13
19
|
tag::tags[]
|
|
@@ -81,40 +81,40 @@ better reading or orientation.
|
|
|
81
81
|
<div class="color-palette col-lg-12">
|
|
82
82
|
<div class="color-group col-lg-6">
|
|
83
83
|
<ul>
|
|
84
|
-
<li class="color main-color" style="background-color: #f44336;"> <span class="name light-strong">Red</span> <span class="shade light-strong">500</span> <span class="hex
|
|
85
|
-
<li class="color dark" style="background-color: #ffebee;"><span class="shade expanded">50</span><span class="hex">#ffebee</span> </li>
|
|
86
|
-
<li class="color dark" style="background-color: #ffcdd2;"><span class="shade">100</span><span class="hex">#ffcdd2</span> </li>
|
|
87
|
-
<li class="color dark" style="background-color: #ef9a9a"><span class="shade expanded">200</span><span class="hex">#ef9a9a</span> </li>
|
|
88
|
-
<li class="color dark" style="background-color: #e57373;"><span class="shade">300</span><span class="hex">#e57373</span> </li>
|
|
89
|
-
<li class="color" style="background-color: #ef5350;"><span class="shade expanded">400</span><span class="hex">#ef5350</span> </li>
|
|
90
|
-
<li class="color" style="background-color: #f44336;"><span class="shade">500</span><span class="hex">#f44336</span> </li>
|
|
91
|
-
<li class="color" style="background-color: #e53935;"><span class="shade expanded">600</span><span class="hex">#e53935</span> </li>
|
|
92
|
-
<li class="color" style="background-color: #d32f2f;"><span class="shade">700</span><span class="hex">#d32f2f</span> </li>
|
|
93
|
-
<li class="color" style="background-color: #c62828;"><span class="shade expanded">800</span><span class="hex">#c62828</span> </li>
|
|
94
|
-
<li class="color" style="background-color: #b71c1c;"><span class="shade expanded">900</span><span class="hex">#b71c1c</span> </li>
|
|
95
|
-
<li class="color dark divide" style="background-color: #ff8a80;"><span class="shade accent">A100</span><span class="hex">#ff8a80</span> </li>
|
|
96
|
-
<li class="color light-strong" style="background-color: #ff5252;"><span class="shade accent expanded">A200</span><span class="hex">#ff5252</span> </li>
|
|
97
|
-
<li class="color" style="background-color: #ff1744;"><span class="shade accent expanded">A400</span><span class="hex">#ff1744</span> </li>
|
|
98
|
-
<li class="color" style="background-color: #d50000;"><span class="shade accent">A700</span><span class="hex">#d50000</span> </li>
|
|
84
|
+
<li class="color main-color" style="background-color: #f44336;"> <span class="name light-strong">Red</span> <span class="shade light-strong">500</span> <span class="hex"><a id="F44336" class="mdColorValue md-white" title="Red" href="#void">#f44336</a></span> </li>
|
|
85
|
+
<li class="color dark" style="background-color: #ffebee;"><span class="shade expanded">50</span><span class="hex"><a id="ffebee" class="mdColorValue" title="Red 50" href="#void">#ffebee</a></span> </li>
|
|
86
|
+
<li class="color dark" style="background-color: #ffcdd2;"><span class="shade">100</span><span class="hex"><a id="ffcdd2" class="mdColorValue" title="Red 100" href="#void">#ffcdd2</a></span> </li>
|
|
87
|
+
<li class="color dark" style="background-color: #ef9a9a"><span class="shade expanded">200</span><span class="hex"><a id="ef9a9a" class="mdColorValue" title="Red 200" href="#void">#ef9a9a</a></span> </li>
|
|
88
|
+
<li class="color dark" style="background-color: #e57373;"><span class="shade">300</span><span class="hex"><a id="e57373" class="mdColorValue md-white" title="Red 300" href="#void">#e57373</a></span> </li>
|
|
89
|
+
<li class="color" style="background-color: #ef5350;"><span class="shade expanded">400</span><span class="hex"><a id="ef5350" class="mdColorValue md-white" title="Red 400" href="#void">#ef5350</a></span> </li>
|
|
90
|
+
<li class="color" style="background-color: #f44336;"><span class="shade">500</span><span class="hex"><a id="f44336" class="mdColorValue md-white" title="Red 500" href="#void">#f44336</a></span> </li>
|
|
91
|
+
<li class="color" style="background-color: #e53935;"><span class="shade expanded">600</span><span class="hex"><a id="e53935" class="mdColorValue md-white" title="Red 600" href="#void">#e53935</a></span> </li>
|
|
92
|
+
<li class="color" style="background-color: #d32f2f;"><span class="shade">700</span><span class="hex"><a id="d32f2f" class="mdColorValue md-white" title="Red 700" href="#void">#d32f2f</a></span> </li>
|
|
93
|
+
<li class="color" style="background-color: #c62828;"><span class="shade expanded">800</span><span class="hex"><a id="c62828" class="mdColorValue md-white" title="Red 800" href="#void">#c62828</a></span> </li>
|
|
94
|
+
<li class="color" style="background-color: #b71c1c;"><span class="shade expanded">900</span><span class="hex"><a id="b71c1c" class="mdColorValue md-white" title="Red 900" href="#void">#b71c1c</a></span> </li>
|
|
95
|
+
<li class="color dark divide" style="background-color: #ff8a80;"><span class="shade accent">A100</span><span class="hex"><a id="ff8a80" class="mdColorValue" title="Red A100" href="#void">#ff8a80</a></span> </li>
|
|
96
|
+
<li class="color light-strong" style="background-color: #ff5252;"><span class="shade accent expanded">A200</span><span class="hex"><a id="ff5252" class="mdColorValue md-white" title="Red A200" href="#void">#ff5252</a></span> </li>
|
|
97
|
+
<li class="color" style="background-color: #ff1744;"><span class="shade accent expanded">A400</span><span class="hex"><a id="ff1744" class="mdColorValue md-white" title="Red A400" href="#void">#ff1744</a></span> </li>
|
|
98
|
+
<li class="color" style="background-color: #d50000;"><span class="shade accent">A700</span><span class="hex"><a id="d50000" class="mdColorValue md-white" title="Red A700" href="#void">#d50000</a></span> </li>
|
|
99
99
|
</ul>
|
|
100
100
|
</div>
|
|
101
101
|
<div class="color-group col-lg-6">
|
|
102
102
|
<ul>
|
|
103
|
-
<li class="color main-color" style="background-color: #E91E63;"> <span class="name light-strong">Pink</span> <span class="shade light-strong">500</span> <span class="hex light-strong">#e91e63</span> </li>
|
|
104
|
-
<li class="color dark" style="background-color: #fce4ec;"><span class="shade expanded">50</span><span class="hex">#fce4ec</span> </li>
|
|
105
|
-
<li class="color dark" style="background-color: #f8bbd0;"><span class="shade">100</span><span class="hex">#f8bbd0</span> </li>
|
|
106
|
-
<li class="color dark" style="background-color: #f48fb1;"><span class="shade expanded">200</span><span class="hex">#f48fb1</span> </li>
|
|
107
|
-
<li class="color light-strong" style="background-color: #f06292;"><span class="shade">300</span><span class="hex">#f06292</span> </li>
|
|
108
|
-
<li class="color " style="background-color: #ec407a;"><span class="shade expanded">400</span><span class="hex">#ec407a</span> </li>
|
|
109
|
-
<li class="color" style="background-color: #e91e63;"><span class="shade">500</span><span class="hex">#e91e63</span> </li>
|
|
110
|
-
<li class="color" style="background-color: #d81b60;"><span class="shade expanded">600</span><span class="hex">#d81b60</span> </li>
|
|
111
|
-
<li class="color" style="background-color: #c2185b;"><span class="shade">700</span><span class="hex">#c2185b</span> </li>
|
|
112
|
-
<li class="color" style="background-color: #ad1457;"><span class="shade">800</span><span class="hex">#ad1457</span> </li>
|
|
113
|
-
<li class="color" style="background-color: #880e4f;"><span class="shade">900</span><span class="hex">#880e4f</span> </li>
|
|
114
|
-
<li class="color dark divide" style="background-color: #ff80ab;"><span class="shade accent">A100</span><span class="hex">#ff80ab</span> </li>
|
|
115
|
-
<li class="color light-strong" style="background-color: #ff4081;"><span class="shade accent expanded">A200</span><span class="hex">#ff4081</span> </li>
|
|
116
|
-
<li class="color" style="background-color: #f50057;"><span class="shade accent expanded">A400</span><span class="hex">#f50057</span> </li>
|
|
117
|
-
<li class="color" style="background-color: #c51162;"><span class="shade accent">A700</span><span class="hex">#c51162</span> </li>
|
|
103
|
+
<li class="color main-color" style="background-color: #E91E63;"> <span class="name light-strong">Pink</span> <span class="shade light-strong">500</span> <span class="hex light-strong"><a id="e91e63" class="mdColorValue md-white" title="Pink" href="#void">#e91e63</a></span> </li>
|
|
104
|
+
<li class="color dark" style="background-color: #fce4ec;"><span class="shade expanded">50</span><span class="hex"><a id="fce4ec" class="mdColorValue" title="Pink 50" href="#void">#fce4ec</a></span> </li>
|
|
105
|
+
<li class="color dark" style="background-color: #f8bbd0;"><span class="shade">100</span><span class="hex"><a id="f8bbd0" class="mdColorValue" title="Pink 100" href="#void">#f8bbd0</a></span> </li>
|
|
106
|
+
<li class="color dark" style="background-color: #f48fb1;"><span class="shade expanded">200</span><span class="hex"><a id="f48fb1" class="mdColorValue" title="Pink 200" href="#void">#f48fb1</a></span> </li>
|
|
107
|
+
<li class="color light-strong" style="background-color: #f06292;"><span class="shade">300</span><span class="hex"><a id="f06292" class="mdColorValue md-white" title="Pink 300" href="#void">#f06292</a></span> </li>
|
|
108
|
+
<li class="color " style="background-color: #ec407a;"><span class="shade expanded">400</span><span class="hex"><a id="ec407a" class="mdColorValue md-white" title="Pink 400" href="#void">#ec407a</a></span> </li>
|
|
109
|
+
<li class="color" style="background-color: #e91e63;"><span class="shade">500</span><span class="hex"><a id="e91e63" class="mdColorValue md-white" title="Pink 500" href="#void">#e91e63</a></span> </li>
|
|
110
|
+
<li class="color" style="background-color: #d81b60;"><span class="shade expanded">600</span><span class="hex"><a id="d81b60" class="mdColorValue md-white" title="Pink 600" href="#void">#d81b60</a></span> </li>
|
|
111
|
+
<li class="color" style="background-color: #c2185b;"><span class="shade">700</span><span class="hex"><a id="c2185b" class="mdColorValue md-white" title="Pink 700" href="#void">#c2185b</a></span> </li>
|
|
112
|
+
<li class="color" style="background-color: #ad1457;"><span class="shade">800</span><span class="hex"><a id="ad1457" class="mdColorValue md-white" title="Pink 800" href="#void">#ad1457</a></span> </li>
|
|
113
|
+
<li class="color" style="background-color: #880e4f;"><span class="shade">900</span><span class="hex"><a id="880e4f" class="mdColorValue md-white" title="Pink 900" href="#void">#880e4f</a></span> </li>
|
|
114
|
+
<li class="color dark divide" style="background-color: #ff80ab;"><span class="shade accent">A100</span><span class="hex"><a id="ff80ab" class="mdColorValue" title="Pink A100" href="#void">#ff80ab</a></span> </li>
|
|
115
|
+
<li class="color light-strong" style="background-color: #ff4081;"><span class="shade accent expanded">A200</span><span class="hex"><a id="ff4081" class="mdColorValue md-white" title="Pink A200" href="#void">#ff4081</a></span> </li>
|
|
116
|
+
<li class="color" style="background-color: #f50057;"><span class="shade accent expanded">A400</span><span class="hex"><a id="f50057" class="mdColorValue md-white" title="Pink A400" href="#void">#f50057</a></span> </li>
|
|
117
|
+
<li class="color" style="background-color: #c51162;"><span class="shade accent">A700</span><span class="hex"><a id="c51162" class="mdColorValue md-white" title="Pink A700" href="#void">#c51162</a></span> </li>
|
|
118
118
|
</ul>
|
|
119
119
|
</div>
|
|
120
120
|
</div>
|
|
@@ -127,40 +127,40 @@ better reading or orientation.
|
|
|
127
127
|
<div class="color-palette col-lg-12">
|
|
128
128
|
<div class="color-group col-lg-6">
|
|
129
129
|
<ul>
|
|
130
|
-
<li class="color main-color" style="background-color: #9c27b0;"> <span class="name">Purple</span> <span class="shade">500</span> <span class="hex">#9c27b0</span> </li>
|
|
131
|
-
<li class="color dark" style="background-color: #f3e5f5;"><span class="shade expanded">50</span><span class="hex">#f3e5f5</span> </li>
|
|
132
|
-
<li class="color dark" style="background-color: #e1bee7;"><span class="shade">100</span><span class="hex">#e1bee7</span> </li>
|
|
133
|
-
<li class="color dark" style="background-color: #ce93d8;"><span class="shade expanded">200</span><span class="hex">#ce93d8</span> </li>
|
|
134
|
-
<li class="color light-strong" style="background-color: #ba68c8;"><span class="shade">300</span><span class="hex">#ba68c8</span> </li>
|
|
135
|
-
<li class="color light-strong" style="background-color: #ab47bc;"><span class="shade expanded">400</span><span class="hex">#ab47bc</span> </li>
|
|
136
|
-
<li class="color" style="background-color: #9c27b0;"><span class="shade">500</span><span class="hex">#9c27b0</span> </li>
|
|
137
|
-
<li class="color" style="background-color: #8e24aa;"><span class="shade expanded">600</span><span class="hex">#8e24aa</span> </li>
|
|
138
|
-
<li class="color" style="background-color: #7b1fa2;"><span class="shade">700</span><span class="hex">#7b1fa2</span> </li>
|
|
139
|
-
<li class="color" style="background-color: #6a1b9a;"><span class="shade expanded">800</span><span class="hex">#6a1b9a</span> </li>
|
|
140
|
-
<li class="color" style="background-color: #4a148c;"><span class="shade expanded">900</span><span class="hex">#4a148c</span> </li>
|
|
141
|
-
|
|
142
|
-
<li class="color light-strong" style="background-color: #e040fb;"><span class="shade accent expanded">A200</span><span class="hex">#e040fb</span> </li>
|
|
143
|
-
<li class="color" style="background-color: #d500f9;"><span class="shade accent expanded">A400</span><span class="hex">#d500f9</span> </li>
|
|
144
|
-
<li class="color" style="background-color: #aa00ff;"><span class="shade accent">A700</span><span class="hex">#aa00ff</span> </li>
|
|
130
|
+
<li class="color main-color" style="background-color: #9c27b0;"> <span class="name">Purple</span> <span class="shade">500</span> <span class="hex"><a id="9c27b0" class="mdColorValue md-white" title="Purple" href="#void">#9c27b0</a></span> </li>
|
|
131
|
+
<li class="color dark" style="background-color: #f3e5f5;"><span class="shade expanded">50</span><span class="hex"><a id="f3e5f5" class="mdColorValue" title="Purple 50" href="#void">#f3e5f5</a></span> </li>
|
|
132
|
+
<li class="color dark" style="background-color: #e1bee7;"><span class="shade">100</span><span class="hex"><a id="e1bee7" class="mdColorValue" title="Purple 100" href="#void">#e1bee7</a></span> </li>
|
|
133
|
+
<li class="color dark" style="background-color: #ce93d8;"><span class="shade expanded">200</span><span class="hex"><a id="ce93d8" class="mdColorValue" title="Purple 200" href="#void">#ce93d8</a></span> </li>
|
|
134
|
+
<li class="color light-strong" style="background-color: #ba68c8;"><span class="shade">300</span><span class="hex"><a id="ba68c8" class="mdColorValue md-white" title="Purple 300" href="#void">#ba68c8</a></span> </li>
|
|
135
|
+
<li class="color light-strong" style="background-color: #ab47bc;"><span class="shade expanded">400</span><span class="hex"><a id="ab47bc" class="mdColorValue md-white" title="Purple 400" href="#void">#ab47bc</a></span> </li>
|
|
136
|
+
<li class="color" style="background-color: #9c27b0;"><span class="shade">500</span><span class="hex"><a id="9c27b0" class="mdColorValue md-white" title="Purple 500" href="#void">#9c27b0</a></span> </li>
|
|
137
|
+
<li class="color" style="background-color: #8e24aa;"><span class="shade expanded">600</span><span class="hex"><a id="8e24aa" class="mdColorValue md-white" title="Purple 600" href="#void">#8e24aa</a></span> </li>
|
|
138
|
+
<li class="color" style="background-color: #7b1fa2;"><span class="shade">700</span><span class="hex"><a id="7b1fa2" class="mdColorValue md-white" title="Purple 700" href="#void">#7b1fa2</a></span> </li>
|
|
139
|
+
<li class="color" style="background-color: #6a1b9a;"><span class="shade expanded">800</span><span class="hex"><a id="6a1b9a" class="mdColorValue md-white" title="Purple 800" href="#void">#6a1b9a</a></span> </li>
|
|
140
|
+
<li class="color" style="background-color: #4a148c;"><span class="shade expanded">900</span><span class="hex"><a id="4a148c" class="mdColorValue md-white" title="Purple 900" href="#void">#4a148c</a></span> </li>
|
|
141
|
+
<li class="color dark divide" style="background-color: #ea80fc;"><span class="shade accent">A100</span><span class="hex"><a id="ea80fc" class="mdColorValue" title="Purple A100" href="#void">#ea80fc</a></span> </li>
|
|
142
|
+
<li class="color light-strong" style="background-color: #e040fb;"><span class="shade accent expanded">A200</span><span class="hex"><a id="e040fb" class="mdColorValue md-white" title="Purple A200" href="#void">#e040fb</a></span> </li>
|
|
143
|
+
<li class="color" style="background-color: #d500f9;"><span class="shade accent expanded">A400</span><span class="hex"><a id="d500f9" class="mdColorValue md-white" title="Purple A400" href="#void">#d500f9</a></span> </li>
|
|
144
|
+
<li class="color" style="background-color: #aa00ff;"><span class="shade accent">A700</span><span class="hex"><a id="aa00ff" class="mdColorValue md-white" title="Purple A700" href="#void">#aa00ff</a></span> </li>
|
|
145
145
|
</ul>
|
|
146
146
|
</div>
|
|
147
147
|
<div class="color-group col-lg-6">
|
|
148
148
|
<ul>
|
|
149
|
-
<li class="color main-color" style="background-color: #673ab7;"> <span class="name">Deep Purple</span> <span class="shade">500</span> <span class="hex">#673ab7</span> </li>
|
|
150
|
-
<li class="color dark" style="background-color: #ede7f6;"><span class="shade expanded">50</span><span class="hex">#ede7f6</span> </li>
|
|
151
|
-
<li class="color dark" style="background-color: #d1c4e9;"><span class="shade">100</span><span class="hex">#d1c4e9</span> </li>
|
|
152
|
-
<li class="color dark" style="background-color: #b39ddb;"><span class="shade expanded">200</span><span class="hex">#b39ddb</span> </li>
|
|
153
|
-
<li class="color" style="background-color: #9575cd;"><span class="shade">300</span><span class="hex">#9575cd</span> </li>
|
|
154
|
-
<li class="color" style="background-color: #7e57c2;"><span class="shade expanded">400</span><span class="hex">#7e57c2</span> </li>
|
|
155
|
-
<li class="color" style="background-color: #673ab7;"><span class="shade">500</span><span class="hex">#673ab7</span> </li>
|
|
156
|
-
<li class="color" style="background-color: #5e35b1;"><span class="shade expanded">600</span><span class="hex">#5e35b1</span> </li>
|
|
157
|
-
<li class="color" style="background-color: #512da8;"><span class="shade">700</span><span class="hex">#512da8</span> </li>
|
|
158
|
-
<li class="color" style="background-color: #4527a0;"><span class="shade expanded">800</span><span class="hex">#4527a0</span> </li>
|
|
159
|
-
<li class="color" style="background-color: #311b92;"><span class="shade expanded">900</span><span class="hex">#311b92</span> </li>
|
|
160
|
-
<li class="color dark divide" style="background-color: #b388ff;"><span class="shade accent">A100</span><span class="hex">#b388ff</span> </li>
|
|
161
|
-
<li class="color light-strong" style="background-color: #7c4dff;"><span class="shade accent expanded">A200</span><span class="hex">#7c4dff</span> </li>
|
|
162
|
-
<li class="color" style="background-color: #651fff;"><span class="shade accent expanded">A400</span><span class="hex">#651fff</span> </li>
|
|
163
|
-
<li class="color" style="background-color: #6200ea;"><span class="shade accent">A700</span><span class="hex">#6200ea</span> </li>
|
|
149
|
+
<li class="color main-color" style="background-color: #673ab7;"> <span class="name">Deep Purple</span> <span class="shade">500</span> <span class="hex"><a id="673ab7" class="mdColorValue md-white" title="Deep Purple" href="#void">#673ab7</a></span> </li>
|
|
150
|
+
<li class="color dark" style="background-color: #ede7f6;"><span class="shade expanded">50</span><span class="hex"><a id="ede7f6" class="mdColorValue" title="Deep Purple 50" href="#void">#ede7f6</a></span> </li>
|
|
151
|
+
<li class="color dark" style="background-color: #d1c4e9;"><span class="shade">100</span><span class="hex"><a id="d1c4e9" class="mdColorValue" title="Deep Purple 100" href="#void">#d1c4e9</a></span> </li>
|
|
152
|
+
<li class="color dark" style="background-color: #b39ddb;"><span class="shade expanded">200</span><span class="hex"><a id="b39ddb" class="mdColorValue" title="Deep Purple 200" href="#void">#b39ddb</a></span> </li>
|
|
153
|
+
<li class="color" style="background-color: #9575cd;"><span class="shade">300</span><span class="hex"><a id="9575cd" class="mdColorValue md-white" title="Deep Purple 300" href="#void">#9575cd</a></span> </li>
|
|
154
|
+
<li class="color" style="background-color: #7e57c2;"><span class="shade expanded">400</span><span class="hex"><a id="7e57c2" class="mdColorValue md-white" title="Deep Purple 400" href="#void">#7e57c2</a></span> </li>
|
|
155
|
+
<li class="color" style="background-color: #673ab7;"><span class="shade">500</span><span class="hex"><a id="673ab7" class="mdColorValue md-white" title="Deep Purple 500" href="#void">#673ab7</a></span> </li>
|
|
156
|
+
<li class="color" style="background-color: #5e35b1;"><span class="shade expanded">600</span><span class="hex"><a id="5e35b1" class="mdColorValue md-white" title="Deep Purple 600" href="#void">#5e35b1</a></span> </li>
|
|
157
|
+
<li class="color" style="background-color: #512da8;"><span class="shade">700</span><span class="hex"><a id="512da8" class="mdColorValue md-white" title="Deep Purple 700" href="#void">#512da8</a></span> </li>
|
|
158
|
+
<li class="color" style="background-color: #4527a0;"><span class="shade expanded">800</span><span class="hex"><a id="4527a0" class="mdColorValue md-white" title="Deep Purple 800" href="#void">#4527a0</a></span> </li>
|
|
159
|
+
<li class="color" style="background-color: #311b92;"><span class="shade expanded">900</span><span class="hex"><a id="311b92" class="mdColorValue md-white" title="Deep Purple 900" href="#void">#311b92</a></span> </li>
|
|
160
|
+
<li class="color dark divide" style="background-color: #b388ff;"><span class="shade accent">A100</span><span class="hex"><a id="b388ff" class="mdColorValue" title="Deep Purple A100" href="#void">#b388ff</a></span> </li>
|
|
161
|
+
<li class="color light-strong" style="background-color: #7c4dff;"><span class="shade accent expanded">A200</span><span class="hex"><a id="7c4dff" class="mdColorValue md-white" title="Deep Purple A200" href="#void">#7c4dff</a></span> </li>
|
|
162
|
+
<li class="color" style="background-color: #651fff;"><span class="shade accent expanded">A400</span><span class="hex"><a id="651fff" class="mdColorValue md-white" title="Deep Purple A400" href="#void">#651fff</a></span> </li>
|
|
163
|
+
<li class="color" style="background-color: #6200ea;"><span class="shade accent">A700</span><span class="hex"><a id="6200ea" class="mdColorValue md-white" title="Deep Purple A700" href="#void">#6200ea</a></span> </li>
|
|
164
164
|
</ul>
|
|
165
165
|
</div>
|
|
166
166
|
</div>
|
|
@@ -173,40 +173,40 @@ better reading or orientation.
|
|
|
173
173
|
<div class="color-palette col-lg-12">
|
|
174
174
|
<div class="color-group col-lg-6">
|
|
175
175
|
<ul>
|
|
176
|
-
<li class="color main-color" style="background-color: #3f51b5;"> <span class="name">Indigo</span> <span class="shade">500</span> <span class="hex">#3f51b5</span> </li>
|
|
177
|
-
<li class="color dark" style="background-color: #e8eaf6;"><span class="shade expanded">50</span><span class="hex">#e8eaf6</span> </li>
|
|
178
|
-
<li class="color dark" style="background-color: #c5cae9;"><span class="shade">100</span><span class="hex">#c5cae9</span> </li>
|
|
179
|
-
<li class="color dark" style="background-color: #9fa8da;"><span class="shade expanded">200</span><span class="hex">#9fa8da</span> </li>
|
|
180
|
-
<li class="color" style="background-color: #7986cb;"><span class="shade">300</span><span class="hex">#7986cb</span> </li>
|
|
181
|
-
<li class="color" style="background-color: #5c6bc0;"><span class="shade expanded">400</span><span class="hex">#5c6bc0</span> </li>
|
|
182
|
-
<li class="color" style="background-color: #3f51b5;"><span class="shade">500</span><span class="hex">#3f51b5</span> </li>
|
|
183
|
-
<li class="color" style="background-color: #3949ab;"><span class="shade expanded">600</span><span class="hex">#3949ab</span> </li>
|
|
184
|
-
<li class="color" style="background-color: #303f9f;"><span class="shade">700</span><span class="hex">#303f9f</span> </li>
|
|
185
|
-
<li class="color" style="background-color: #283593;"><span class="shade expanded">800</span><span class="hex">#283593</span> </li>
|
|
186
|
-
<li class="color" style="background-color: #1a237e;"><span class="shade expanded">900</span><span class="hex">#1a237e</span> </li>
|
|
187
|
-
<li class="color dark divide" style="background-color: #8c9eff;"><span class="shade accent">A100</span><span class="hex">#8c9eff</span> </li>
|
|
188
|
-
<li class="color" style="background-color: #536dfe;"><span class="shade accent expanded">A200</span><span class="hex">#536dfe</span> </li>
|
|
189
|
-
<li class="color" style="background-color: #3d5afe;"><span class="shade accent expanded">A400</span><span class="hex">#3d5afe</span> </li>
|
|
190
|
-
<li class="color" style="background-color: #304ffe;"><span class="shade accent">A700</span><span class="hex">#304ffe</span> </li>
|
|
176
|
+
<li class="color main-color" style="background-color: #3f51b5;"> <span class="name">Indigo</span> <span class="shade">500</span> <span class="hex"><a id="3f51b5" class="mdColorValue md-white" title="Indigo" href="#void">#3f51b5</a></span> </li>
|
|
177
|
+
<li class="color dark" style="background-color: #e8eaf6;"><span class="shade expanded">50</span><span class="hex"><a id="e8eaf6" class="mdColorValue" title="Indigo 50" href="#void">#e8eaf6</a></span> </li>
|
|
178
|
+
<li class="color dark" style="background-color: #c5cae9;"><span class="shade">100</span><span class="hex"><a id="c5cae9" class="mdColorValue" title="Indigo 100" href="#void">#c5cae9</a></span> </li>
|
|
179
|
+
<li class="color dark" style="background-color: #9fa8da;"><span class="shade expanded">200</span><span class="hex"><a id="9fa8da" class="mdColorValue" title="Indigo 200" href="#void">#9fa8da</a></span> </li>
|
|
180
|
+
<li class="color" style="background-color: #7986cb;"><span class="shade">300</span><span class="hex"><a id="7986cb" class="mdColorValue md-white" title="Indigo 300" href="#void">#7986cb</a></span> </li>
|
|
181
|
+
<li class="color" style="background-color: #5c6bc0;"><span class="shade expanded">400</span><span class="hex"><a id="5c6bc0" class="mdColorValue md-white" title="Indigo 400" href="#void">#5c6bc0</a></span> </li>
|
|
182
|
+
<li class="color" style="background-color: #3f51b5;"><span class="shade">500</span><span class="hex"><a id="3f51b5" class="mdColorValue md-white" title="Indigo 500" href="#void">#3f51b5</a></span> </li>
|
|
183
|
+
<li class="color" style="background-color: #3949ab;"><span class="shade expanded">600</span><span class="hex"><a id="3949ab" class="mdColorValue md-white" title="Indigo 600" href="#void">#3949ab</a></span> </li>
|
|
184
|
+
<li class="color" style="background-color: #303f9f;"><span class="shade">700</span><span class="hex"><a id="303f9f" class="mdColorValue md-white" title="Indigo 700" href="#void">#303f9f</a></span> </li>
|
|
185
|
+
<li class="color" style="background-color: #283593;"><span class="shade expanded">800</span><span class="hex"><a id="283593" class="mdColorValue md-white" title="Indigo 800" href="#void">#283593</a></span> </li>
|
|
186
|
+
<li class="color" style="background-color: #1a237e;"><span class="shade expanded">900</span><span class="hex"><a id="1a237e" class="mdColorValue md-white" title="Indigo 900" href="#void">#1a237e</a></span> </li>
|
|
187
|
+
<li class="color dark divide" style="background-color: #8c9eff;"><span class="shade accent">A100</span><span class="hex"><a id="8c9eff" class="mdColorValue" title="Indigo A100" href="#void">#8c9eff</a></span> </li>
|
|
188
|
+
<li class="color" style="background-color: #536dfe;"><span class="shade accent expanded">A200</span><span class="hex"><a id="536dfe" class="mdColorValue md-white" title="Indigo A200" href="#void">#536dfe</a></span> </li>
|
|
189
|
+
<li class="color" style="background-color: #3d5afe;"><span class="shade accent expanded">A400</span><span class="hex"><a id="3d5afe" class="mdColorValue md-white" title="Indigo A400" href="#void">#3d5afe</a></span> </li>
|
|
190
|
+
<li class="color" style="background-color: #304ffe;"><span class="shade accent">A700</span><span class="hex"><a id="304ffe" class="mdColorValue md-white" title="Indigo A700" href="#void">#304ffe</a></span> </li>
|
|
191
191
|
</ul>
|
|
192
192
|
</div>
|
|
193
193
|
<div class="color-group col-lg-6">
|
|
194
194
|
<ul>
|
|
195
|
-
<li class="color main-color" style="background-color: #2196F3;"> <span class="name light-strong">Blue</span> <span class="shade light-strong">500</span> <span class="hex light-strong">#2196f3</span> </li>
|
|
196
|
-
<li class="color dark" style="background-color: #e3f2fd;"><span class="shade expanded">50</span><span class="hex">#e3f2fd</span> </li>
|
|
197
|
-
<li class="color dark" style="background-color: #bbdefb;"><span class="shade">100</span><span class="hex">#bbdefb</span> </li>
|
|
198
|
-
<li class="color dark" style="background-color: #90caf9;"><span class="shade expanded">200</span><span class="hex">#90caf9</span> </li>
|
|
199
|
-
<li class="color dark" style="background-color: #64b5f6;"><span class="shade">300</span><span class="hex">#64b5f6</span> </li>
|
|
200
|
-
<li class="color dark" style="background-color: #42a5f5;"><span class="shade expanded">400</span><span class="hex">#42a5f5</span> </li>
|
|
201
|
-
<li class="color light-strong" style="background-color: #2196f3;"><span class="shade">500</span><span class="hex">#2196f3</span> </li>
|
|
202
|
-
<li class="color" style="background-color: #1e88e5;"><span class="shade expanded">600</span><span class="hex">#1e88e5</span> </li>
|
|
203
|
-
<li class="color" style="background-color: #1976d2;"><span class="shade">700</span><span class="hex">#1976d2</span> </li>
|
|
204
|
-
<li class="color" style="background-color: #1565c0;"><span class="shade expanded">800</span><span class="hex">#1565c0</span> </li>
|
|
205
|
-
<li class="color" style="background-color: #0d47a1;"><span class="shade expanded">900</span><span class="hex">#0d47a1</span> </li>
|
|
206
|
-
<li class="color dark divide" style="background-color: #82b1ff;"><span class="shade accent">A100</span><span class="hex">#82b1ff</span> </li>
|
|
207
|
-
<li class="color light-strong" style="background-color: #448aff;"><span class="shade accent expanded">A200</span><span class="hex">#448aff</span> </li>
|
|
208
|
-
<li class="color" style="background-color: #2979ff;"><span class="shade accent expanded">A400</span><span class="hex">#2979ff</span> </li>
|
|
209
|
-
<li class="color" style="background-color: #2962ff;"><span class="shade accent">A700</span><span class="hex">#2962ff</span> </li>
|
|
195
|
+
<li class="color main-color" style="background-color: #2196F3;"> <span class="name light-strong">Blue</span> <span class="shade light-strong">500</span> <span class="hex light-strong"><a id="2196f3" class="mdColorValue md-white" title="Blue" href="#void">#2196f3</a></span> </li>
|
|
196
|
+
<li class="color dark" style="background-color: #e3f2fd;"><span class="shade expanded">50</span><span class="hex"><a id="e3f2fd" class="mdColorValue" title="Blue 50" href="#void">#e3f2fd</a></span> </li>
|
|
197
|
+
<li class="color dark" style="background-color: #bbdefb;"><span class="shade">100</span><span class="hex"><a id="bbdefb" class="mdColorValue" title="Blue 100" href="#void">#bbdefb</a></span> </li>
|
|
198
|
+
<li class="color dark" style="background-color: #90caf9;"><span class="shade expanded">200</span><span class="hex"><a id="90caf9" class="mdColorValue" title="Blue 200" href="#void">#90caf9</a></span> </li>
|
|
199
|
+
<li class="color dark" style="background-color: #64b5f6;"><span class="shade">300</span><span class="hex"><a id="64b5f6" class="mdColorValue md-white" title="Blue 300" href="#void">#64b5f6</a></span> </li>
|
|
200
|
+
<li class="color dark" style="background-color: #42a5f5;"><span class="shade expanded">400</span><span class="hex"><a id="42a5f5" class="mdColorValue md-white" title="Blue 400" href="#void">#42a5f5</a></span> </li>
|
|
201
|
+
<li class="color light-strong" style="background-color: #2196f3;"><span class="shade">500</span><span class="hex"><a id="2196f3" class="mdColorValue md-white" title="Blue 500" href="#void">#2196f3</a></span> </li>
|
|
202
|
+
<li class="color" style="background-color: #1e88e5;"><span class="shade expanded">600</span><span class="hex"><a id="1e88e5" class="mdColorValue md-white" title="Blue 600" href="#void">#1e88e5</a></span> </li>
|
|
203
|
+
<li class="color" style="background-color: #1976d2;"><span class="shade">700</span><span class="hex"><a id="1976d2" class="mdColorValue md-white" title="Blue 700" href="#void">#1976d2</a></span> </li>
|
|
204
|
+
<li class="color" style="background-color: #1565c0;"><span class="shade expanded">800</span><span class="hex"><a id="1565c0" class="mdColorValue md-white" title="Blue 800" href="#void">#1565c0</a></span> </li>
|
|
205
|
+
<li class="color" style="background-color: #0d47a1;"><span class="shade expanded">900</span><span class="hex"><a id="0d47a1" class="mdColorValue md-white" title="Blue 900" href="#void">#0d47a1</a></span> </li>
|
|
206
|
+
<li class="color dark divide" style="background-color: #82b1ff;"><span class="shade accent">A100</span><span class="hex"><a id="82b1ff" class="mdColorValue" title="Blue A100" href="#void">#82b1ff</a></span> </li>
|
|
207
|
+
<li class="color light-strong" style="background-color: #448aff;"><span class="shade accent expanded">A200</span><span class="hex"><a id="448aff" class="mdColorValue md-white" title="Blue A200" href="#void">#448aff</a></span> </li>
|
|
208
|
+
<li class="color" style="background-color: #2979ff;"><span class="shade accent expanded">A400</span><span class="hex"><a id="2979ff" class="mdColorValue md-white" title="Blue A400" href="#void">#2979ff</a></span> </li>
|
|
209
|
+
<li class="color" style="background-color: #2962ff;"><span class="shade accent">A700</span><span class="hex"><a id="2962ff" class="mdColorValue md-white" title="Blue A700" href="#void">#2962ff</a></span> </li>
|
|
210
210
|
</ul>
|
|
211
211
|
</div>
|
|
212
212
|
</div>
|
|
@@ -219,40 +219,40 @@ better reading or orientation.
|
|
|
219
219
|
<div class="color-palette col-lg-12">
|
|
220
220
|
<div class="color-group col-lg-6">
|
|
221
221
|
<ul>
|
|
222
|
-
<li class="color main-color" style="background-color: #03a9f4;"> <span class="name dark">Light Blue</span> <span class="shade dark">500</span> <span class="hex dark">#03a9f4</span> </li>
|
|
223
|
-
<li class="color dark" style="background-color: #e1f5fe;"><span class="shade expanded">50</span><span class="hex">#e1f5fe</span> </li>
|
|
224
|
-
<li class="color dark" style="background-color: #b3e5fc;"><span class="shade">100</span><span class="hex">#b3e5fc</span> </li>
|
|
225
|
-
<li class="color dark" style="background-color: #81d4fa;"><span class="shade expanded">200</span><span class="hex">#81d4fa</span> </li>
|
|
226
|
-
<li class="color dark" style="background-color: #4fc3f7;"><span class="shade">300</span><span class="hex">#4fc3f7</span> </li>
|
|
227
|
-
<li class="color dark" style="background-color: #29b6f6;"><span class="shade expanded">400</span><span class="hex">#29b6f6</span> </li>
|
|
228
|
-
<li class="color dark" style="background-color: #03a9f4;"><span class="shade">500</span><span class="hex">#03a9f4</span> </li>
|
|
229
|
-
<li class="color light-strong" style="background-color: #039be5;"><span class="shade expanded">600</span><span class="hex">#039be5</span> </li>
|
|
230
|
-
<li class="color" style="background-color: #0288d1;"><span class="shade">700</span><span class="hex">#0288d1</span> </li>
|
|
231
|
-
<li class="color" style="background-color: #0277bd;"><span class="shade expanded">800</span><span class="hex">#0277bd</span> </li>
|
|
232
|
-
<li class="color" style="background-color: #01579b;"><span class="shade expanded">900</span><span class="hex">#01579b</span> </li>
|
|
233
|
-
<li class="color dark divide" style="background-color: #80d8ff;"><span class="shade accent">A100</span><span class="hex">#80d8ff</span> </li>
|
|
234
|
-
<li class="color dark" style="background-color: #40c4ff;"><span class="shade accent expanded">A200</span><span class="hex">#40c4ff</span> </li>
|
|
235
|
-
<li class="color dark" style="background-color: #00b0ff;"><span class="shade accent expanded">A400</span><span class="hex">#00b0ff</span> </li>
|
|
236
|
-
<li class="color light-strong" style="background-color: #0091ea;"><span class="shade accent">A700</span><span class="hex">#0091ea</span> </li>
|
|
222
|
+
<li class="color main-color" style="background-color: #03a9f4;"> <span class="name dark">Light Blue</span> <span class="shade dark">500</span> <span class="hex dark"><a id="03a9f4" class="mdColorValue md-white" title="Light Blue" href="#void">#03a9f4</a></span> </li>
|
|
223
|
+
<li class="color dark" style="background-color: #e1f5fe;"><span class="shade expanded">50</span><span class="hex"><a id="e1f5fe" class="mdColorValue" title="Light Blue 50" href="#void">#e1f5fe</a></span> </li>
|
|
224
|
+
<li class="color dark" style="background-color: #b3e5fc;"><span class="shade">100</span><span class="hex"><a id="b3e5fc" class="mdColorValue" title="Light Blue 100" href="#void">#b3e5fc</a></span> </li>
|
|
225
|
+
<li class="color dark" style="background-color: #81d4fa;"><span class="shade expanded">200</span><span class="hex"><a id="81d4fa" class="mdColorValue" title="Light Blue 200" href="#void">#81d4fa</a></span> </li>
|
|
226
|
+
<li class="color dark" style="background-color: #4fc3f7;"><span class="shade">300</span><span class="hex"><a id="4fc3f7" class="mdColorValue md-white" title="Light Blue 300" href="#void">#4fc3f7</a></span> </li>
|
|
227
|
+
<li class="color dark" style="background-color: #29b6f6;"><span class="shade expanded">400</span><span class="hex"><a id="29b6f6" class="mdColorValue md-white" title="Light Blue 400" href="#void">#29b6f6</a></span> </li>
|
|
228
|
+
<li class="color dark" style="background-color: #03a9f4;"><span class="shade">500</span><span class="hex"><a id="val" class="mdColorValue md-white" title="Light Blue 500" href="#void">#03a9f4</a></span> </li>
|
|
229
|
+
<li class="color light-strong" style="background-color: #039be5;"><span class="shade expanded">600</span><span class="hex"><a id="039be5" class="mdColorValue md-white" title="Light Blue 600" href="#void">#039be5</a></span> </li>
|
|
230
|
+
<li class="color" style="background-color: #0288d1;"><span class="shade">700</span><span class="hex"><a id="0288d1" class="mdColorValue md-white" title="Light Blue 700" href="#void">#0288d1</a></span> </li>
|
|
231
|
+
<li class="color" style="background-color: #0277bd;"><span class="shade expanded">800</span><span class="hex"><a id="0277bd" class="mdColorValue md-white" title="Light Blue 800" href="#void">#0277bd</a></span> </li>
|
|
232
|
+
<li class="color" style="background-color: #01579b;"><span class="shade expanded">900</span><span class="hex"><a id="01579b" class="mdColorValue md-white" title="Light Blue 900" href="#void">#01579b</a></span> </li>
|
|
233
|
+
<li class="color dark divide" style="background-color: #80d8ff;"><span class="shade accent">A100</span><span class="hex"><a id="80d8ff" class="mdColorValue" title="Light Blue A100" href="#void">#80d8ff</a></span> </li>
|
|
234
|
+
<li class="color dark" style="background-color: #40c4ff;"><span class="shade accent expanded">A200</span><span class="hex"><a id="40c4ff" class="mdColorValue md-white" title="Light Blue A200" href="#void">#40c4ff</a></span> </li>
|
|
235
|
+
<li class="color dark" style="background-color: #00b0ff;"><span class="shade accent expanded">A400</span><span class="hex"><a id="00b0ff" class="mdColorValue md-white" title="Light Blue A400" href="#void">#00b0ff</a></span> </li>
|
|
236
|
+
<li class="color light-strong" style="background-color: #0091ea;"><span class="shade accent">A700</span><span class="hex"><a id="0091ea" class="mdColorValue md-white" title="Light Blue A700" href="#void">#0091ea</a></span> </li>
|
|
237
237
|
</ul>
|
|
238
238
|
</div>
|
|
239
239
|
<div class="color-group col-lg-6">
|
|
240
240
|
<ul>
|
|
241
|
-
<li class="color main-color" style="background-color: #00bcd4;"> <span class="name dark">Cyan</span> <span class="shade dark">500</span> <span class="hex dark">#00bcd4</span> </li>
|
|
242
|
-
<li class="color dark" style="background-color: #e0f7fa;"><span class="shade expanded">50</span><span class="hex">#e0f7fa</span> </li>
|
|
243
|
-
<li class="color dark" style="background-color: #b2ebf2;"><span class="shade">100</span><span class="hex">#b2ebf2</span> </li>
|
|
244
|
-
<li class="color dark" style="background-color: #80deea;"><span class="shade expanded">200</span><span class="hex">#80deea</span> </li>
|
|
245
|
-
<li class="color dark" style="background-color: #4dd0e1;"><span class="shade">300</span><span class="hex">#4dd0e1</span> </li>
|
|
246
|
-
<li class="color dark" style="background-color: #26c6da;"><span class="shade expanded">400</span><span class="hex">#26c6da</span> </li>
|
|
247
|
-
<li class="color dark" style="background-color: #00bcd4;"><span class="shade">500</span><span class="hex">#00bcd4</span> </li>
|
|
248
|
-
<li class="color dark" style="background-color: #00acc1;"><span class="shade expanded">600</span><span class="hex">#00acc1</span> </li>
|
|
249
|
-
<li class="color" style="background-color: #0097a7;"><span class="shade">700</span><span class="hex">#0097a7</span> </li>
|
|
250
|
-
<li class="color" style="background-color: #00838f;"><span class="shade expanded">800</span><span class="hex">#00838f</span> </li>
|
|
251
|
-
<li class="color" style="background-color: #006064;"><span class="shade expanded">900</span><span class="hex">#006064</span> </li>
|
|
252
|
-
<li class="color dark divide" style="background-color: #84ffff;"><span class="shade accent">A100</span><span class="hex">#84ffff</span> </li>
|
|
253
|
-
<li class="color dark" style="background-color: #18ffff;"><span class="shade accent expanded">A200</span><span class="hex">#18ffff</span> </li>
|
|
254
|
-
<li class="color dark" style="background-color: #00e5ff;"><span class="shade accent expanded">A400</span><span class="hex">#00e5ff</span> </li>
|
|
255
|
-
<li class="color dark" style="background-color: #00b8d4;"><span class="shade accent">A700</span><span class="hex">#00b8d4</span> </li>
|
|
241
|
+
<li class="color main-color" style="background-color: #00bcd4;"> <span class="name dark">Cyan</span> <span class="shade dark">500</span> <span class="hex dark"><a id="00bcd4" class="mdColorValue md-white" title="Cyan" href="#void">#00bcd4</a></span> </li>
|
|
242
|
+
<li class="color dark" style="background-color: #e0f7fa;"><span class="shade expanded">50</span><span class="hex"><a id="e0f7fa" class="mdColorValue" title="Cyan 50" href="#void">#e0f7fa</a></span> </li>
|
|
243
|
+
<li class="color dark" style="background-color: #b2ebf2;"><span class="shade">100</span><span class="hex"><a id="b2ebf2" class="mdColorValue" title="Cyan 100" href="#void">#b2ebf2</a></span> </li>
|
|
244
|
+
<li class="color dark" style="background-color: #80deea;"><span class="shade expanded">200</span><span class="hex"><a id="80deea" class="mdColorValue" title="Cyan 200" href="#void">#80deea</a></span> </li>
|
|
245
|
+
<li class="color dark" style="background-color: #4dd0e1;"><span class="shade">300</span><span class="hex"><a id="4dd0e1" class="mdColorValue md-white" title="Cyan 300" href="#void">#4dd0e1</a></span> </li>
|
|
246
|
+
<li class="color dark" style="background-color: #26c6da;"><span class="shade expanded">400</span><span class="hex"><a id="26c6da" class="mdColorValue md-white" title="Cyan 400" href="#void">#26c6da</a></span> </li>
|
|
247
|
+
<li class="color dark" style="background-color: #00bcd4;"><span class="shade">500</span><span class="hex"><a id="00bcd4" class="mdColorValue md-white" title="Cyan 500" href="#void">#00bcd4</a></span> </li>
|
|
248
|
+
<li class="color dark" style="background-color: #00acc1;"><span class="shade expanded">600</span><span class="hex"><a id="00acc1" class="mdColorValue md-white" title="Cyan 600" href="#void">#00acc1</a></span> </li>
|
|
249
|
+
<li class="color" style="background-color: #0097a7;"><span class="shade">700</span><span class="hex"><a id="0097a7" class="mdColorValue md-white" title="Cyan 700" href="#void">#0097a7</a></span> </li>
|
|
250
|
+
<li class="color" style="background-color: #00838f;"><span class="shade expanded">800</span><span class="hex"><a id="00838f" class="mdColorValue md-white" title="Cyan 800" href="#void">#00838f</a></span> </li>
|
|
251
|
+
<li class="color" style="background-color: #006064;"><span class="shade expanded">900</span><span class="hex"><a id="006064" class="mdColorValue md-white" title="Cyan 900" href="#void">#006064</a></span> </li>
|
|
252
|
+
<li class="color dark divide" style="background-color: #84ffff;"><span class="shade accent">A100</span><span class="hex"><a id="84ffff" class="mdColorValue" title="Cyan A100" href="#void">#84ffff</a></span> </li>
|
|
253
|
+
<li class="color dark" style="background-color: #18ffff;"><span class="shade accent expanded">A200</span><span class="hex"><a id="18ffff" class="mdColorValue md-white" title="Cyan A200" href="#void">#18ffff</a></span> </li>
|
|
254
|
+
<li class="color dark" style="background-color: #00e5ff;"><span class="shade accent expanded">A400</span><span class="hex"><a id="00e5ff" class="mdColorValue md-white" title="Cyan A400" href="#void">#00e5ff</a></span> </li>
|
|
255
|
+
<li class="color dark" style="background-color: #00b8d4;"><span class="shade accent">A700</span><span class="hex"><a id="00b8d4" class="mdColorValue md-white" title="Cyan A700" href="#void">#00b8d4</a></span> </li>
|
|
256
256
|
</ul>
|
|
257
257
|
</div>
|
|
258
258
|
</div>
|
|
@@ -265,40 +265,40 @@ better reading or orientation.
|
|
|
265
265
|
<div class="color-palette col-lg-12">
|
|
266
266
|
<div class="color-group col-lg-6">
|
|
267
267
|
<ul>
|
|
268
|
-
<li class="color main-color" style="background-color: #009688;"> <span class="name light-strong">Teal</span> <span class="shade light-strong">500</span> <span class="hex light-strong">#009688</span> </li>
|
|
269
|
-
<li class="color dark" style="background-color: #e0f2f1;"><span class="shade expanded">50</span><span class="hex">#e0f2f1</span> </li>
|
|
270
|
-
<li class="color dark" style="background-color: #b2dfdb;"><span class="shade">100</span><span class="hex">#b2dfdb</span> </li>
|
|
271
|
-
<li class="color dark" style="background-color: #80cbc4;"><span class="shade expanded">200</span><span class="hex">#80cbc4</span> </li>
|
|
272
|
-
<li class="color dark" style="background-color: #4db6ac;"><span class="shade">300</span><span class="hex">#4db6ac</span> </li>
|
|
273
|
-
<li class="color dark" style="background-color: #26a69a;"><span class="shade expanded">400</span><span class="hex">#26a69a</span> </li>
|
|
274
|
-
<li class="color light-strong" style="background-color: #009688;"><span class="shade">500</span><span class="hex">#009688</span> </li>
|
|
275
|
-
<li class="color light-strong" style="background-color: #00897b;"><span class="shade expanded">600</span><span class="hex">#00897b</span> </li>
|
|
276
|
-
<li class="color light-strong" style="background-color: #00796b;"><span class="shade">700</span><span class="hex">#00796b</span> </li>
|
|
277
|
-
<li class="color" style="background-color: #00695c;"><span class="shade expanded">800</span><span class="hex">#00695c</span> </li>
|
|
278
|
-
<li class="color" style="background-color: #004d40;"><span class="shade expanded">900</span><span class="hex">#004d40</span> </li>
|
|
279
|
-
<li class="color dark divide" style="background-color: #a7ffeb;"><span class="shade accent">A100</span><span class="hex">#a7ffeb</span> </li>
|
|
280
|
-
|
|
281
|
-
<li class="color dark" style="background-color: #1de9b6;"><span class="shade accent expanded">A400</span><span class="hex">#1de9b6</span> </li>
|
|
282
|
-
<li class="color dark" style="background-color: #00bfa5;"><span class="shade accent">A700</span><span class="hex">#00bfa5</span> </li>
|
|
268
|
+
<li class="color main-color" style="background-color: #009688;"> <span class="name light-strong">Teal</span> <span class="shade light-strong">500</span> <span class="hex light-strong"><a id="009688" class="mdColorValue md-white" title="Teal" href="#void">#009688</a></span> </li>
|
|
269
|
+
<li class="color dark" style="background-color: #e0f2f1;"><span class="shade expanded">50</span><span class="hex"><a id="e0f2f1" class="mdColorValue" title="Teal 50" href="#void">#e0f2f1</a></span> </li>
|
|
270
|
+
<li class="color dark" style="background-color: #b2dfdb;"><span class="shade">100</span><span class="hex"><a id="b2dfdb" class="mdColorValue" title="Teal 100" href="#void">#b2dfdb</a></span> </li>
|
|
271
|
+
<li class="color dark" style="background-color: #80cbc4;"><span class="shade expanded">200</span><span class="hex"><a id="80cbc4" class="mdColorValue" title="Teal 200" href="#void">#80cbc4</a></span> </li>
|
|
272
|
+
<li class="color dark" style="background-color: #4db6ac;"><span class="shade">300</span><span class="hex"><a id="4db6ac" class="mdColorValue md-white" title="Teal 300" href="#void">#4db6ac</a></span> </li>
|
|
273
|
+
<li class="color dark" style="background-color: #26a69a;"><span class="shade expanded">400</span><span class="hex"><a id="26a69a" class="mdColorValue md-white" title="Teal 400" href="#void">#26a69a</a></span> </li>
|
|
274
|
+
<li class="color light-strong" style="background-color: #009688;"><span class="shade">500</span><span class="hex"><a id="009688" class="mdColorValue md-white" title="Teal 500" href="#void">#009688</a></span> </li>
|
|
275
|
+
<li class="color light-strong" style="background-color: #00897b;"><span class="shade expanded">600</span><span class="hex"><a id="00897b" class="mdColorValue md-white" title="Teal 600" href="#void">#00897b</a></span> </li>
|
|
276
|
+
<li class="color light-strong" style="background-color: #00796b;"><span class="shade">700</span><span class="hex"><a id="00796b" class="mdColorValue md-white" title="Teal 700" href="#void">#00796b</a></span> </li>
|
|
277
|
+
<li class="color" style="background-color: #00695c;"><span class="shade expanded">800</span><span class="hex"><a id="00695c" class="mdColorValue md-white" title="Teal 800" href="#void">#00695c</a></span> </li>
|
|
278
|
+
<li class="color" style="background-color: #004d40;"><span class="shade expanded">900</span><span class="hex"><a id="004d40" class="mdColorValue md-white" title="Teal 900" href="#void">#004d40</a></span> </li>
|
|
279
|
+
<li class="color dark divide" style="background-color: #a7ffeb;"><span class="shade accent">A100</span><span class="hex"><a id="a7ffeb" class="mdColorValue" title="Teal A100" href="#void">#a7ffeb</a></span> </li>
|
|
280
|
+
<li class="color dark" style="background-color: #64ffda;"><span class="shade accent expanded">A200</span><span class="hex"><a id="64ffda" class="mdColorValue md-white" title="Teal A200" href="#void">#64ffda</a></span> </li>
|
|
281
|
+
<li class="color dark" style="background-color: #1de9b6;"><span class="shade accent expanded">A400</span><span class="hex"><a id="1de9b6" class="mdColorValue md-white" title="Teal A400" href="#void">#1de9b6</a></span> </li>
|
|
282
|
+
<li class="color dark" style="background-color: #00bfa5;"><span class="shade accent">A700</span><span class="hex"><a id="00bfa5" class="mdColorValue md-white" title="Teal A700" href="#void">#00bfa5</a></span> </li>
|
|
283
283
|
</ul>
|
|
284
284
|
</div>
|
|
285
285
|
<div class="color-group col-lg-6">
|
|
286
286
|
<ul>
|
|
287
|
-
<li class="color main-color" style="background-color: #4caf50;"> <span class="name dark">Green</span> <span class="shade dark">500</span> <span class="hex dark">#4caf50</span> </li>
|
|
288
|
-
<li class="color dark" style="background-color: #e8f5e9;"><span class="shade expanded">50</span><span class="hex">#e8f5e9</span> </li>
|
|
289
|
-
<li class="color dark" style="background-color: #c8e6c9;"><span class="shade">100</span><span class="hex">#c8e6c9</span> </li>
|
|
290
|
-
<li class="color dark" style="background-color: #a5d6a7;"><span class="shade expanded">200</span><span class="hex">#a5d6a7</span> </li>
|
|
291
|
-
<li class="color dark" style="background-color: #81c784;"><span class="shade">300</span><span class="hex">#81c784</span> </li>
|
|
292
|
-
<li class="color dark" style="background-color: #66bb6a;"><span class="shade expanded">400</span><span class="hex">#66bb6a</span> </li>
|
|
293
|
-
<li class="color dark" style="background-color: #4caf50;"><span class="shade">500</span><span class="hex">#4caf50</span> </li>
|
|
294
|
-
<li class="color light-strong" style="background-color: #43a047;"><span class="shade expanded">600</span><span class="hex">#43a047</span> </li>
|
|
295
|
-
<li class="color" style="background-color: #388e3c;"><span class="shade">700</span><span class="hex">#388e3c</span> </li>
|
|
296
|
-
<li class="color" style="background-color: #2e7d32;"><span class="shade expanded">800</span><span class="hex">#2e7d32</span> </li>
|
|
297
|
-
<li class="color" style="background-color: #1b5e20;"><span class="shade expanded">900</span><span class="hex">#1b5e20</span> </li>
|
|
298
|
-
<li class="color dark divide" style="background-color: #b9f6ca;"><span class="shade accent">A100</span><span class="hex">#b9f6ca</span> </li>
|
|
299
|
-
<li class="color dark" style="background-color: #69f0ae;"><span class="shade accent expanded">A200</span><span class="hex">#69f0ae</span> </li>
|
|
300
|
-
<li class="color dark" style="background-color: #00e676;"><span class="shade accent expanded">A400</span><span class="hex">#00e676</span> </li>
|
|
301
|
-
<li class="color dark" style="background-color: #00c853;"><span class="shade accent">A700</span><span class="hex">#00c853</span> </li>
|
|
287
|
+
<li class="color main-color" style="background-color: #4caf50;"> <span class="name dark">Green</span> <span class="shade dark">500</span> <span class="hex dark"><a id="4caf50" class="mdColorValue md-white" title="Green" href="#void">#4caf50</a></span> </li>
|
|
288
|
+
<li class="color dark" style="background-color: #e8f5e9;"><span class="shade expanded">50</span><span class="hex"><a id="e8f5e9" class="mdColorValue" title="Green 50" href="#void">#e8f5e9</a></span> </li>
|
|
289
|
+
<li class="color dark" style="background-color: #c8e6c9;"><span class="shade">100</span><span class="hex"><a id="c8e6c9" class="mdColorValue" title="Green 100" href="#void">#c8e6c9</a></span> </li>
|
|
290
|
+
<li class="color dark" style="background-color: #a5d6a7;"><span class="shade expanded">200</span><span class="hex"><a id="a5d6a7" class="mdColorValue" title="Green 200" href="#void">#a5d6a7</a></span> </li>
|
|
291
|
+
<li class="color dark" style="background-color: #81c784;"><span class="shade">300</span><span class="hex"><a id="81c784" class="mdColorValue md-white" title="Green 300" href="#void">#81c784</a></span> </li>
|
|
292
|
+
<li class="color dark" style="background-color: #66bb6a;"><span class="shade expanded">400</span><span class="hex"><a id="66bb6a" class="mdColorValue md-white" title="Green 400" href="#void">#66bb6a</a></span> </li>
|
|
293
|
+
<li class="color dark" style="background-color: #4caf50;"><span class="shade">500</span><span class="hex"><a id="4caf50" class="mdColorValue md-white" title="Green 500" href="#void">#4caf50</a></span> </li>
|
|
294
|
+
<li class="color light-strong" style="background-color: #43a047;"><span class="shade expanded">600</span><span class="hex"><a id="43a047" class="mdColorValue md-white" title="Green 600" href="#void">#43a047</a></span> </li>
|
|
295
|
+
<li class="color" style="background-color: #388e3c;"><span class="shade">700</span><span class="hex"><a id="388e3c" class="mdColorValue md-white" title="Green 700" href="#void">#388e3c</a></span> </li>
|
|
296
|
+
<li class="color" style="background-color: #2e7d32;"><span class="shade expanded">800</span><span class="hex"><a id="2e7d32" class="mdColorValue md-white" title="Green 800" href="#void">#2e7d32</a></span> </li>
|
|
297
|
+
<li class="color" style="background-color: #1b5e20;"><span class="shade expanded">900</span><span class="hex"><a id="1b5e20" class="mdColorValue md-white" title="Green 900" href="#void">#1b5e20</a></span> </li>
|
|
298
|
+
<li class="color dark divide" style="background-color: #b9f6ca;"><span class="shade accent">A100</span><span class="hex"><a id="b9f6ca" class="mdColorValue" title="Green A100" href="#void">#b9f6ca</a></span> </li>
|
|
299
|
+
<li class="color dark" style="background-color: #69f0ae;"><span class="shade accent expanded">A200</span><span class="hex"><a id="69f0ae" class="mdColorValue md-white" title="Green A200" href="#void">#69f0ae</a></span> </li>
|
|
300
|
+
<li class="color dark" style="background-color: #00e676;"><span class="shade accent expanded">A400</span><span class="hex"><a id="00e676" class="mdColorValue md-white" title="Green A400" href="#void">#00e676</a></span> </li>
|
|
301
|
+
<li class="color dark" style="background-color: #00c853;"><span class="shade accent">A700</span><span class="hex"><a id="00c853" class="mdColorValue md-white" title="Green A700" href="#void">#00c853</a></span> </li>
|
|
302
302
|
</ul>
|
|
303
303
|
</div>
|
|
304
304
|
</div>
|
|
@@ -311,40 +311,40 @@ better reading or orientation.
|
|
|
311
311
|
<div class="color-palette col-lg-12">
|
|
312
312
|
<div class="color-group col-lg-6">
|
|
313
313
|
<ul>
|
|
314
|
-
<li class="color main-color" style="background-color: #8bc34a;"> <span class="name dark">Light Green</span> <span class="shade dark">500</span> <span class="hex dark">#8bc34a</span> </li>
|
|
315
|
-
<li class="color dark" style="background-color: #f1f8e9;"><span class="shade expanded">50</span><span class="hex">#f1f8e9</span> </li>
|
|
316
|
-
<li class="color dark" style="background-color: #dcedc8;"><span class="shade">100</span><span class="hex">#dcedc8</span> </li>
|
|
317
|
-
<li class="color dark" style="background-color: #c5e1a5;"><span class="shade expanded">200</span><span class="hex">#c5e1a5</span> </li>
|
|
318
|
-
<li class="color dark" style="background-color: #aed581;"><span class="shade">300</span><span class="hex">#aed581</span> </li>
|
|
319
|
-
<li class="color dark" style="background-color: #9ccc65;"><span class="shade expanded">400</span><span class="hex">#9ccc65</span> </li>
|
|
320
|
-
<li class="color dark" style="background-color: #8bc34a;"><span class="shade">500</span><span class="hex">#8bc34a</span> </li>
|
|
321
|
-
<li class="color dark" style="background-color: #7cb342;"><span class="shade expanded">600</span><span class="hex">#7cb342</span> </li>
|
|
322
|
-
<li class="color light-strong" style="background-color: #689f38;"><span class="shade">700</span><span class="hex">#689f38</span> </li>
|
|
323
|
-
<li class="color" style="background-color: #558b2f;"><span class="shade expanded">800</span><span class="hex">#558b2f</span> </li>
|
|
324
|
-
<li class="color" style="background-color: #33691e;"><span class="shade expanded">900</span><span class="hex">#33691e</span> </li>
|
|
325
|
-
<li class="color dark divide" style="background-color: #ccff90;"><span class="shade accent">A100</span><span class="hex">#ccff90</span> </li>
|
|
326
|
-
<li class="color dark" style="background-color: #b2ff59;"><span class="shade accent expanded">A200</span><span class="hex">#b2ff59</span> </li>
|
|
327
|
-
<li class="color dark" style="background-color: #76ff03;"><span class="shade accent expanded">A400</span><span class="hex">#76ff03</span> </li>
|
|
328
|
-
<li class="color dark" style="background-color: #64dd17;"><span class="shade accent">A700</span><span class="hex">#64dd17</span> </li>
|
|
314
|
+
<li class="color main-color" style="background-color: #8bc34a;"> <span class="name dark">Light Green</span> <span class="shade dark">500</span> <span class="hex dark"><a id="8bc34a" class="mdColorValue md-white" title="Light Green" href="#void">#8bc34a</a></span> </li>
|
|
315
|
+
<li class="color dark" style="background-color: #f1f8e9;"><span class="shade expanded">50</span><span class="hex"><a id="f1f8e9" class="mdColorValue" title="Light Green 50" href="#void">#f1f8e9</a></span> </li>
|
|
316
|
+
<li class="color dark" style="background-color: #dcedc8;"><span class="shade">100</span><span class="hex"><a id="dcedc8" class="mdColorValue" title="Light Green 100" href="#void">#dcedc8</a></span> </li>
|
|
317
|
+
<li class="color dark" style="background-color: #c5e1a5;"><span class="shade expanded">200</span><span class="hex"><a id="c5e1a5" class="mdColorValue" title="Light Green 200" href="#void">#c5e1a5</a></span> </li>
|
|
318
|
+
<li class="color dark" style="background-color: #aed581;"><span class="shade">300</span><span class="hex"><a id="aed581" class="mdColorValue md-white" title="Light Green 300" href="#void">#aed581</a></span> </li>
|
|
319
|
+
<li class="color dark" style="background-color: #9ccc65;"><span class="shade expanded">400</span><span class="hex"><a id="9ccc65" class="mdColorValue md-white" title="Light Green 400" href="#void">#9ccc65</a></span> </li>
|
|
320
|
+
<li class="color dark" style="background-color: #8bc34a;"><span class="shade">500</span><span class="hex"><a id="8bc34a" class="mdColorValue md-white" title="Light Green 500" href="#void">#8bc34a</a></span> </li>
|
|
321
|
+
<li class="color dark" style="background-color: #7cb342;"><span class="shade expanded">600</span><span class="hex"><a id="7cb342" class="mdColorValue md-white" title="Light Green 600" href="#void">#7cb342</a></span> </li>
|
|
322
|
+
<li class="color light-strong" style="background-color: #689f38;"><span class="shade">700</span><span class="hex"><a id="689f38" class="mdColorValue md-white" title="Light Green 700" href="#void">#689f38</a></span> </li>
|
|
323
|
+
<li class="color" style="background-color: #558b2f;"><span class="shade expanded">800</span><span class="hex"><a id="558b2f" class="mdColorValue md-white" title="Light Green 800" href="#void">#558b2f</a></span> </li>
|
|
324
|
+
<li class="color" style="background-color: #33691e;"><span class="shade expanded">900</span><span class="hex"><a id="33691e" class="mdColorValue md-white" title="Light Green 900" href="#void">#33691e</a></span> </li>
|
|
325
|
+
<li class="color dark divide" style="background-color: #ccff90;"><span class="shade accent">A100</span><span class="hex"><a id="ccff90" class="mdColorValue" title="Light Green A100" href="#void">#ccff90</a></span> </li>
|
|
326
|
+
<li class="color dark" style="background-color: #b2ff59;"><span class="shade accent expanded">A200</span><span class="hex"><a id="b2ff59" class="mdColorValue" title="Light Green A200" href="#void">#b2ff59</a></span> </li>
|
|
327
|
+
<li class="color dark" style="background-color: #76ff03;"><span class="shade accent expanded">A400</span><span class="hex"><a id="76ff03" class="mdColorValue" title="Light Green A400" href="#void">#76ff03</a></span> </li>
|
|
328
|
+
<li class="color dark" style="background-color: #64dd17;"><span class="shade accent">A700</span><span class="hex"><a id="64dd17" class="mdColorValue" title="Light Green A700" href="#void">#64dd17</a></span> </li>
|
|
329
329
|
</ul>
|
|
330
330
|
</div>
|
|
331
331
|
<div class="color-group col-lg-6">
|
|
332
332
|
<ul>
|
|
333
|
-
<li class="color main-color" style="background-color: #cddc39;"> <span class="name dark">Lime</span> <span class="shade dark">500</span> <span class="hex dark">#cddc39</span> </li>
|
|
334
|
-
<li class="color dark" style="background-color: #f9fbe7;"><span class="shade expanded">50</span><span class="hex">#f9fbe7</span> </li>
|
|
335
|
-
<li class="color dark" style="background-color: #f0f4c3;"><span class="shade">100</span><span class="hex">#f0f4c3</span> </li>
|
|
336
|
-
<li class="color dark" style="background-color: #e6ee9c;"><span class="shade expanded">200</span><span class="hex">#e6ee9c</span> </li>
|
|
337
|
-
<li class="color dark" style="background-color: #dce775;"><span class="shade">300</span><span class="hex">#dce775</span> </li>
|
|
338
|
-
<li class="color dark" style="background-color: #d4e157;"><span class="shade expanded">400</span><span class="hex">#d4e157</span> </li>
|
|
339
|
-
<li class="color dark" style="background-color: #cddc39;"><span class="shade">500</span><span class="hex">#cddc39</span> </li>
|
|
340
|
-
<li class="color dark" style="background-color: #c0ca33;"><span class="shade expanded">600</span><span class="hex">#c0ca33</span> </li>
|
|
341
|
-
<li class="color dark" style="background-color: #afb42b;"><span class="shade">700</span><span class="hex">#afb42b</span> </li>
|
|
342
|
-
<li class="color dark" style="background-color: #9e9d24;"><span class="shade expanded">800</span><span class="hex">#9e9d24</span> </li>
|
|
343
|
-
<li class="color" style="background-color: #827717;"><span class="shade expanded">900</span><span class="hex">#827717</span> </li>
|
|
344
|
-
<li class="color dark divide" style="background-color: #f4ff81;"><span class="shade accent">A100</span><span class="hex">#f4ff81</span> </li>
|
|
345
|
-
<li class="color dark" style="background-color: #eeff41;"><span class="shade accent expanded">A200</span><span class="hex">#eeff41</span> </li>
|
|
346
|
-
<li class="color dark" style="background-color: #c6ff00;"><span class="shade accent expanded">A400</span><span class="hex">#c6ff00</span> </li>
|
|
347
|
-
<li class="color dark" style="background-color: #aeea00;"><span class="shade accent">A700</span><span class="hex">#aeea00</span> </li>
|
|
333
|
+
<li class="color main-color" style="background-color: #cddc39;"> <span class="name dark">Lime</span> <span class="shade dark">500</span> <span class="hex dark"><a id="cddc39" class="mdColorValue md-white" title="Lime" href="#void">#cddc39</a></span> </li>
|
|
334
|
+
<li class="color dark" style="background-color: #f9fbe7;"><span class="shade expanded">50</span><span class="hex"><a id="f9fbe7" class="mdColorValue" title="Lime 50" href="#void">#f9fbe7</a></span> </li>
|
|
335
|
+
<li class="color dark" style="background-color: #f0f4c3;"><span class="shade">100</span><span class="hex"><a id="f0f4c3" class="mdColorValue" title="Lime 100" href="#void">#f0f4c3</a></span> </li>
|
|
336
|
+
<li class="color dark" style="background-color: #e6ee9c;"><span class="shade expanded">200</span><span class="hex"><a id="e6ee9c" class="mdColorValue" title="Lime 200" href="#void">#e6ee9c</a></span> </li>
|
|
337
|
+
<li class="color dark" style="background-color: #dce775;"><span class="shade">300</span><span class="hex"><a id="dce775" class="mdColorValue md-white" title="Lime 300" href="#void">#dce775</a></span> </li>
|
|
338
|
+
<li class="color dark" style="background-color: #d4e157;"><span class="shade expanded">400</span><span class="hex"><a id="d4e157" class="mdColorValue md-white" title="Lime 400" href="#void">#d4e157</a></span> </li>
|
|
339
|
+
<li class="color dark" style="background-color: #cddc39;"><span class="shade">500</span><span class="hex"><a id="cddc39" class="mdColorValue md-white" title="Lime 500" href="#void">#cddc39</a></span> </li>
|
|
340
|
+
<li class="color dark" style="background-color: #c0ca33;"><span class="shade expanded">600</span><span class="hex"><a id="c0ca33" class="mdColorValue md-white" title="Lime 600" href="#void">#c0ca33</a></span> </li>
|
|
341
|
+
<li class="color dark" style="background-color: #afb42b;"><span class="shade">700</span><span class="hex"><a id="afb42b" class="mdColorValue md-white" title="Lime 700" href="#void">#afb42b</a></span> </li>
|
|
342
|
+
<li class="color dark" style="background-color: #9e9d24;"><span class="shade expanded">800</span><span class="hex"><a id="9e9d24" class="mdColorValue md-white" title="Lime 800" href="#void">#9e9d24</a></span> </li>
|
|
343
|
+
<li class="color" style="background-color: #827717;"><span class="shade expanded">900</span><span class="hex"><a id="827717" class="mdColorValue md-white" title="Lime 900" href="#void">#827717</a></span> </li>
|
|
344
|
+
<li class="color dark divide" style="background-color: #f4ff81;"><span class="shade accent">A100</span><span class="hex"><a id="f4ff81" class="mdColorValue" title="Lime A100" href="#void">#f4ff81</a></span> </li>
|
|
345
|
+
<li class="color dark" style="background-color: #eeff41;"><span class="shade accent expanded">A200</span><span class="hex"><a id="eeff41" class="mdColorValue" title="Lime A200" href="#void">#eeff41</a></span> </li>
|
|
346
|
+
<li class="color dark" style="background-color: #c6ff00;"><span class="shade accent expanded">A400</span><span class="hex"><a id="c6ff00" class="mdColorValue" title="Lime A400" href="#void">#c6ff00</a></span> </li>
|
|
347
|
+
<li class="color dark" style="background-color: #aeea00;"><span class="shade accent">A700</span><span class="hex"><a id="aeea00" class="mdColorValue" title="Lime A700" href="#void">#aeea00</a></span> </li>
|
|
348
348
|
</ul>
|
|
349
349
|
</div>
|
|
350
350
|
</div>
|
|
@@ -357,40 +357,40 @@ better reading or orientation.
|
|
|
357
357
|
<div class="color-palette col-lg-12">
|
|
358
358
|
<div class="color-group col-lg-6">
|
|
359
359
|
<ul>
|
|
360
|
-
<li class="color main-color" style="background-color: #ffeb3b;"> <span class="name dark">Yellow</span> <span class="shade dark">500</span> <span class="hex dark">#ffeb3b</span> </li>
|
|
361
|
-
<li class="color dark" style="background-color: #fffde7;"><span class="shade expanded">50</span><span class="hex">#fffde7</span> </li>
|
|
362
|
-
<li class="color dark" style="background-color: #fff9c4;"><span class="shade">100</span><span class="hex">#fff9c4</span> </li>
|
|
363
|
-
<li class="color dark" style="background-color: #fff59d;"><span class="shade expanded">200</span><span class="hex">#fff59d</span> </li>
|
|
364
|
-
<li class="color dark" style="background-color: #fff176;"><span class="shade">300</span><span class="hex">#fff176</span> </li>
|
|
365
|
-
<li class="color dark" style="background-color: #ffee58;"><span class="shade expanded">400</span><span class="hex">#ffee58</span> </li>
|
|
366
|
-
<li class="color dark" style="background-color: #ffeb3b;"><span class="shade">500</span><span class="hex">#ffeb3b</span> </li>
|
|
367
|
-
<li class="color dark" style="background-color: #fdd835;"><span class="shade expanded">600</span><span class="hex">#fdd835</span> </li>
|
|
368
|
-
<li class="color dark" style="background-color: #fbc02d;"><span class="shade">700</span><span class="hex">#fbc02d</span> </li>
|
|
369
|
-
<li class="color dark" style="background-color: #f9a825;"><span class="shade expanded">800</span><span class="hex">#f9a825</span> </li>
|
|
370
|
-
<li class="color dark" style="background-color: #f57f17;"><span class="shade expanded">900</span><span class="hex">#f57f17</span> </li>
|
|
371
|
-
<li class="color dark divide" style="background-color: #ffff8d;"><span class="shade accent">A100</span><span class="hex">#ffff8d</span> </li>
|
|
372
|
-
<li class="color dark" style="background-color: #ffff00;"><span class="shade accent expanded">A200</span><span class="hex">#ffff00</span> </li>
|
|
373
|
-
<li class="color dark" style="background-color: #ffea00;"><span class="shade accent expanded">A400</span><span class="hex">#ffea00</span> </li>
|
|
374
|
-
<li class="color dark" style="background-color: #ffd600;"><span class="shade accent">A700</span><span class="hex">#ffd600</span> </li>
|
|
360
|
+
<li class="color main-color" style="background-color: #ffeb3b;"> <span class="name dark">Yellow</span> <span class="shade dark">500</span> <span class="hex dark"><a id="ffeb3b" class="mdColorValue" title="Yellow" href="#void">#ffeb3b</a></span> </li>
|
|
361
|
+
<li class="color dark" style="background-color: #fffde7;"><span class="shade expanded">50</span><span class="hex"><a id="fffde7" class="mdColorValue" title="Yellow 50" href="#fffde7">#fffde7</a></span> </li>
|
|
362
|
+
<li class="color dark" style="background-color: #fff9c4;"><span class="shade">100</span><span class="hex"><a id="fff9c4" class="mdColorValue" title="Yellow 100" href="#void">#fff9c4</a></span> </li>
|
|
363
|
+
<li class="color dark" style="background-color: #fff59d;"><span class="shade expanded">200</span><span class="hex"><a id="fff59d" class="mdColorValue" title="Yellow 200" href="#void">#fff59d</a></span> </li>
|
|
364
|
+
<li class="color dark" style="background-color: #fff176;"><span class="shade">300</span><span class="hex"><a id="fff176" class="mdColorValue" title="Yellow 300" href="#void">#fff176</a></span> </li>
|
|
365
|
+
<li class="color dark" style="background-color: #ffee58;"><span class="shade expanded">400</span><span class="hex"><a id="ffee58" class="mdColorValue" title="Yellow 400" href="#void">#ffee58</a></span> </li>
|
|
366
|
+
<li class="color dark" style="background-color: #ffeb3b;"><span class="shade">500</span><span class="hex"><a id="ffeb3b" class="mdColorValue" title="Yellow 500" href="#void">#ffeb3b</a></span> </li>
|
|
367
|
+
<li class="color dark" style="background-color: #fdd835;"><span class="shade expanded">600</span><span class="hex"><a id="fdd835" class="mdColorValue" title="Yellow 600" href="#void">#fdd835</a></span> </li>
|
|
368
|
+
<li class="color dark" style="background-color: #fbc02d;"><span class="shade">700</span><span class="hex"><a id="fbc02d" class="mdColorValue" title="Yellow 700" href="#void">#fbc02d</a></span> </li>
|
|
369
|
+
<li class="color dark" style="background-color: #f9a825;"><span class="shade expanded">800</span><span class="hex"><a id="f9a825" class="mdColorValue" title="Yellow 800" href="#void">#f9a825</a></span> </li>
|
|
370
|
+
<li class="color dark" style="background-color: #f57f17;"><span class="shade expanded">900</span><span class="hex"><a id="f57f17" class="mdColorValue" title="Yellow 900" href="#void">#f57f17</a></span> </li>
|
|
371
|
+
<li class="color dark divide" style="background-color: #ffff8d;"><span class="shade accent">A100</span><span class="hex"><a id="ffff8d" class="mdColorValue" title="Yellow A100" href="#void">#ffff8d</a></span> </li>
|
|
372
|
+
<li class="color dark" style="background-color: #ffff00;"><span class="shade accent expanded">A200</span><span class="hex"><a id="ffff00" class="mdColorValue" title="Yellow A200" href="#void">#ffff00</a></span> </li>
|
|
373
|
+
<li class="color dark" style="background-color: #ffea00;"><span class="shade accent expanded">A400</span><span class="hex"><a id="ffea00" class="mdColorValue" title="Yellow A400" href="#void">#ffea00</a></span> </li>
|
|
374
|
+
<li class="color dark" style="background-color: #ffd600;"><span class="shade accent">A700</span><span class="hex"><a id="ffd600" class="mdColorValue" title="Yellow A700" href="#void">#ffd600</a></span> </li>
|
|
375
375
|
</ul>
|
|
376
376
|
</div>
|
|
377
377
|
<div class="color-group col-lg-6">
|
|
378
378
|
<ul>
|
|
379
|
-
<li class="color main-color" style="background-color: #ffc107;"> <span class="name dark">Amber</span> <span class="shade dark">500</span> <span class="hex dark">#ffc107</span> </li>
|
|
380
|
-
<li class="color dark" style="background-color: #fff8e1;"><span class="shade expanded">50</span><span class="hex">#fff8e1</span> </li>
|
|
381
|
-
<li class="color dark" style="background-color: #ffecb3;"><span class="shade">100</span><span class="hex">#ffecb3</span> </li>
|
|
382
|
-
<li class="color dark" style="background-color: #ffe082;"><span class="shade expanded">200</span><span class="hex">#ffe082</span> </li>
|
|
383
|
-
<li class="color dark" style="background-color: #ffd54f;"><span class="shade">300</span><span class="hex">#ffd54f</span> </li>
|
|
384
|
-
<li class="color dark" style="background-color: #ffca28;"><span class="shade expanded">400</span><span class="hex">#ffca28</span> </li>
|
|
385
|
-
<li class="color dark" style="background-color: #ffc107;"><span class="shade">500</span><span class="hex">#ffc107</span> </li>
|
|
386
|
-
<li class="color dark" style="background-color: #ffb300;"><span class="shade expanded">600</span><span class="hex">#ffb300</span> </li>
|
|
387
|
-
<li class="color dark" style="background-color: #ffa000;"><span class="shade">700</span><span class="hex">#ffa000</span> </li>
|
|
388
|
-
<li class="color dark" style="background-color: #ff8f00;"><span class="shade expanded">800</span><span class="hex">#ff8f00</span> </li>
|
|
389
|
-
<li class="color dark" style="background-color: #ff6f00;"><span class="shade expanded">900</span><span class="hex">#ff6f00</span> </li>
|
|
390
|
-
<li class="color dark divide" style="background-color: #ffe57f;"><span class="shade accent">A100</span><span class="hex">#ffe57f</span> </li>
|
|
391
|
-
<li class="color dark" style="background-color: #ffd740;"><span class="shade accent expanded">A200</span><span class="hex">#ffd740</span> </li>
|
|
392
|
-
<li class="color dark" style="background-color: #ffc400;"><span class="shade accent expanded">A400</span><span class="hex">#ffc400</span> </li>
|
|
393
|
-
<li class="color dark" style="background-color: #ffab00;"><span class="shade accent">A700</span><span class="hex">#ffab00</span> </li>
|
|
379
|
+
<li class="color main-color" style="background-color: #ffc107;"> <span class="name dark">Amber</span> <span class="shade dark">500</span> <span class="hex dark"><a id="ffc107" class="mdColorValue" title="Amber" href="#void">#ffc107</a></span> </li>
|
|
380
|
+
<li class="color dark" style="background-color: #fff8e1;"><span class="shade expanded">50</span><span class="hex"><a id="fff8e1" class="mdColorValue" title="Amber 50" href="#void">#fff8e1</a></span> </li>
|
|
381
|
+
<li class="color dark" style="background-color: #ffecb3;"><span class="shade">100</span><span class="hex"><a id="ffecb3" class="mdColorValue" title="Amber 100" href="#void">#ffecb3</a></span> </li>
|
|
382
|
+
<li class="color dark" style="background-color: #ffe082;"><span class="shade expanded">200</span><span class="hex"><a id="ffe082" class="mdColorValue" title="Amber 200" href="#void">#ffe082</a></span> </li>
|
|
383
|
+
<li class="color dark" style="background-color: #ffd54f;"><span class="shade">300</span><span class="hex"><a id="ffd54f" class="mdColorValue" title="Amber 300" href="#void">#ffd54f</a></span> </li>
|
|
384
|
+
<li class="color dark" style="background-color: #ffca28;"><span class="shade expanded">400</span><span class="hex"><a id="ffca28" class="mdColorValue" title="Amber 400" href="#void">#ffca28</a></span> </li>
|
|
385
|
+
<li class="color dark" style="background-color: #ffc107;"><span class="shade">500</span><span class="hex"><a id="ffc107" class="mdColorValue" title="Amber 500" href="#void">#ffc107</a></span> </li>
|
|
386
|
+
<li class="color dark" style="background-color: #ffb300;"><span class="shade expanded">600</span><span class="hex"><a id="ffb300" class="mdColorValue" title="Amber 600" href="#void">#ffb300</a></span> </li>
|
|
387
|
+
<li class="color dark" style="background-color: #ffa000;"><span class="shade">700</span><span class="hex"><a id="ffa000" class="mdColorValue" title="Amber 700" href="#void">#ffa000</a></span> </li>
|
|
388
|
+
<li class="color dark" style="background-color: #ff8f00;"><span class="shade expanded">800</span><span class="hex"><a id="ff8f00" class="mdColorValue" title="Amber 800" href="#void">#ff8f00</a></span> </li>
|
|
389
|
+
<li class="color dark" style="background-color: #ff6f00;"><span class="shade expanded">900</span><span class="hex"><a id="ff6f00" class="mdColorValue" title="Amber 900" href="#void">#ff6f00</a></span> </li>
|
|
390
|
+
<li class="color dark divide" style="background-color: #ffe57f;"><span class="shade accent">A100</span><span class="hex"><a id="ffe57f" class="mdColorValue" title="Amber A100" href="#void">#ffe57f</a></span> </li>
|
|
391
|
+
<li class="color dark" style="background-color: #ffd740;"><span class="shade accent expanded">A200</span><span class="hex"><a id="ffd740" class="mdColorValue" title="Amber A200" href="#void">#ffd740</a></span> </li>
|
|
392
|
+
<li class="color dark" style="background-color: #ffc400;"><span class="shade accent expanded">A400</span><span class="hex"><a id="ffc400" class="mdColorValue" title="Amber A400" href="#void">#ffc400</a></span> </li>
|
|
393
|
+
<li class="color dark" style="background-color: #ffab00;"><span class="shade accent">A700</span><span class="hex"><a id="ffab00" class="mdColorValue" title="Amber A700" href="#void">#ffab00</a></span> </li>
|
|
394
394
|
</ul>
|
|
395
395
|
</div>
|
|
396
396
|
</div>
|
|
@@ -403,40 +403,40 @@ better reading or orientation.
|
|
|
403
403
|
<div class="color-palette col-lg-12">
|
|
404
404
|
<div class="color-group col-lg-6">
|
|
405
405
|
<ul>
|
|
406
|
-
<li class="color main-color" style="background-color: #ff9800;"> <span class="name dark-when-small">Orange</span> <span class="shade dark-when-small">500</span> <span class="hex dark-when-small">#ff9800</span> </li>
|
|
407
|
-
<li class="color dark" style="background-color: #fff3e0;"><span class="shade expanded">50</span><span class="hex">#fff3e0</span> </li>
|
|
408
|
-
<li class="color dark" style="background-color: #ffe0b2;"><span class="shade">100</span><span class="hex">#ffe0b2</span> </li>
|
|
409
|
-
<li class="color dark" style="background-color: #ffcc80;"><span class="shade expanded">200</span><span class="hex">#ffcc80</span> </li>
|
|
410
|
-
<li class="color dark" style="background-color: #ffb74d;"><span class="shade">300</span><span class="hex">#ffb74d</span> </li>
|
|
411
|
-
<li class="color dark" style="background-color: #ffa726;"><span class="shade expanded">400</span><span class="hex">#ffa726</span> </li>
|
|
412
|
-
<li class="color dark" style="background-color: #ff9800;"><span class="shade">500</span><span class="hex">#ff9800</span> </li>
|
|
413
|
-
<li class="color dark" style="background-color: #fb8c00;"><span class="shade expanded">600</span><span class="hex">#fb8c00</span> </li>
|
|
414
|
-
<li class="color dark" style="background-color: #f57c00;"><span class="shade">700</span><span class="hex">#f57c00</span> </li>
|
|
415
|
-
<li class="color light-strong" style="background-color: #ef6c00;"><span class="shade expanded">800</span><span class="hex">#ef6c00</span> </li>
|
|
416
|
-
<li class="color" style="background-color: #e65100;"><span class="shade expanded">900</span><span class="hex">#e65100</span> </li>
|
|
417
|
-
<li class="color dark divide" style="background-color: #ffd180;"><span class="shade accent">A100</span><span class="hex">#ffd180</span> </li>
|
|
418
|
-
<li class="color dark" style="background-color: #ffab40;"><span class="shade accent expanded">A200</span><span class="hex">#ffab40</span> </li>
|
|
419
|
-
<li class="color dark" style="background-color: #ff9100;"><span class="shade accent expanded">A400</span><span class="hex">#ff9100</span> </li>
|
|
420
|
-
<li class="color dark" style="background-color: #ff6d00;"><span class="shade accent">A700</span><span class="hex">#ff6d00</span> </li>
|
|
406
|
+
<li class="color main-color" style="background-color: #ff9800;"> <span class="name dark-when-small">Orange</span> <span class="shade dark-when-small">500</span> <span class="hex dark-when-small"><a id="ff9800" class="mdColorValue md-white" title="Orange" href="#void">#ff9800</a></span> </li>
|
|
407
|
+
<li class="color dark" style="background-color: #fff3e0;"><span class="shade expanded">50</span><span class="hex"><a id="fff3e0" class="mdColorValue" title="Orange 50" href="#void">#fff3e0</a></span> </li>
|
|
408
|
+
<li class="color dark" style="background-color: #ffe0b2;"><span class="shade">100</span><span class="hex"><a id="ffe0b2" class="mdColorValue" title="Orange 100" href="#void">#ffe0b2</a></span> </li>
|
|
409
|
+
<li class="color dark" style="background-color: #ffcc80;"><span class="shade expanded">200</span><span class="hex"><a id="ffcc80" class="mdColorValue" title="Orange 200" href="#void">#ffcc80</a></span> </li>
|
|
410
|
+
<li class="color dark" style="background-color: #ffb74d;"><span class="shade">300</span><span class="hex"><a id="ffb74d" class="mdColorValue md-white" title="Orange 300" href="#void">#ffb74d</a></span> </li>
|
|
411
|
+
<li class="color dark" style="background-color: #ffa726;"><span class="shade expanded">400</span><span class="hex"><a id="ffa726" class="mdColorValue md-white" title="Orange 400" href="#void">#ffa726</a></span> </li>
|
|
412
|
+
<li class="color dark" style="background-color: #ff9800;"><span class="shade">500</span><span class="hex"><a id="ff9800" class="mdColorValue md-white" title="Orange 500" href="#void">#ff9800</a></span> </li>
|
|
413
|
+
<li class="color dark" style="background-color: #fb8c00;"><span class="shade expanded">600</span><span class="hex"><a id="fb8c00" class="mdColorValue md-white" title="Orange 600" href="#void">#fb8c00</a></span> </li>
|
|
414
|
+
<li class="color dark" style="background-color: #f57c00;"><span class="shade">700</span><span class="hex"><a id="f57c00" class="mdColorValue md-white" title="Orange 700" href="#void">#f57c00</a></span> </li>
|
|
415
|
+
<li class="color light-strong" style="background-color: #ef6c00;"><span class="shade expanded">800</span><span class="hex"><a id="ef6c00" class="mdColorValue md-white" title="Orange 800" href="#void">#ef6c00</a></span> </li>
|
|
416
|
+
<li class="color" style="background-color: #e65100;"><span class="shade expanded">900</span><span class="hex"><a id="e65100" class="mdColorValue md-white" title="Orange 900" href="#void">#e65100</a></span> </li>
|
|
417
|
+
<li class="color dark divide" style="background-color: #ffd180;"><span class="shade accent">A100</span><span class="hex"><a id="ffd180" class="mdColorValue" title="Orange A100" href="#void">#ffd180</a></span> </li>
|
|
418
|
+
<li class="color dark" style="background-color: #ffab40;"><span class="shade accent expanded">A200</span><span class="hex"><a id="ffab40" class="mdColorValue md-white" title="Orange A200" href="#void">#ffab40</a></span> </li>
|
|
419
|
+
<li class="color dark" style="background-color: #ff9100;"><span class="shade accent expanded">A400</span><span class="hex"><a id="ff9100" class="mdColorValue md-white" title="Orange A400" href="#void">#ff9100</a></span> </li>
|
|
420
|
+
<li class="color dark" style="background-color: #ff6d00;"><span class="shade accent">A700</span><span class="hex"><a id="ff6d00" class="mdColorValue md-white" title="Orange A700" href="#void">#ff6d00</a></span> </li>
|
|
421
421
|
</ul>
|
|
422
422
|
</div>
|
|
423
423
|
<div class="color-group col-lg-6">
|
|
424
424
|
<ul>
|
|
425
|
-
<li class="color main-color" style="background-color: #ff5722;"> <span class="name light-strong">Deep Orange</span> <span class="shade light-strong">500</span> <span class="hex light-strong">#ff5722</span> </li>
|
|
426
|
-
<li class="color dark" style="background-color: #fbe9e7;"><span class="shade expanded">50</span><span class="hex">#fbe9e7</span> </li>
|
|
427
|
-
<li class="color dark" style="background-color: #ffccbc;"><span class="shade">100</span><span class="hex">#ffccbc</span> </li>
|
|
428
|
-
<li class="color dark" style="background-color: #ffab91;"><span class="shade expanded">200</span><span class="hex">#ffab91</span> </li>
|
|
429
|
-
<li class="color dark" style="background-color: #ff8a65;"><span class="shade">300</span><span class="hex">#ff8a65</span> </li>
|
|
430
|
-
<li class="color dark" style="background-color: #ff7043;"><span class="shade expanded">400</span><span class="hex">#ff7043</span> </li>
|
|
431
|
-
<li class="color light-strong" style="background-color: #ff5722;"><span class="shade">500</span><span class="hex">#ff5722</span> </li>
|
|
432
|
-
<li class="color" style="background-color: #f4511e;"><span class="shade expanded">600</span><span class="hex">#f4511e</span> </li>
|
|
433
|
-
<li class="color" style="background-color: #e64a19;"><span class="shade">700</span><span class="hex">#e64a19</span> </li>
|
|
434
|
-
<li class="color" style="background-color: #d84315;"><span class="shade expanded">800</span><span class="hex">#d84315</span> </li>
|
|
435
|
-
<li class="color" style="background-color: #bf360c;"><span class="shade expanded">900</span><span class="hex">#bf360c</span> </li>
|
|
436
|
-
<li class="color dark divide" style="background-color: #ff9e80;"><span class="shade accent">A100</span><span class="hex">#ff9e80</span> </li>
|
|
437
|
-
<li class="color dark" style="background-color: #ff6e40;"><span class="shade accent expanded">A200</span><span class="hex">#ff6e40</span> </li>
|
|
438
|
-
<li class="color" style="background-color: #ff3d00;"><span class="shade accent expanded">A400</span><span class="hex">#ff3d00</span> </li>
|
|
439
|
-
<li class="color" style="background-color: #dd2c00;"><span class="shade accent">A700</span><span class="hex">#dd2c00</span> </li>
|
|
425
|
+
<li class="color main-color" style="background-color: #ff5722;"> <span class="name light-strong">Deep Orange</span> <span class="shade light-strong">500</span> <span class="hex light-strong"><a id="ff5722" class="mdColorValue md-white" title="Deep Orange" href="#void">#ff5722</a></span> </li>
|
|
426
|
+
<li class="color dark" style="background-color: #fbe9e7;"><span class="shade expanded">50</span><span class="hex"><a id="fbe9e7" class="mdColorValue" title="Deep Orange 50" href="#void">#fbe9e7</a></span> </li>
|
|
427
|
+
<li class="color dark" style="background-color: #ffccbc;"><span class="shade">100</span><span class="hex"><a id="ffccbc" class="mdColorValue" title="Deep Orange 100" href="#void">#ffccbc</a></span> </li>
|
|
428
|
+
<li class="color dark" style="background-color: #ffab91;"><span class="shade expanded">200</span><span class="hex"><a id="ffab91" class="mdColorValue" title="Deep Orange 200" href="#void">#ffab91</a></span> </li>
|
|
429
|
+
<li class="color dark" style="background-color: #ff8a65;"><span class="shade">300</span><span class="hex"><a id="ff8a65" class="mdColorValue md-white" title="Deep Orange 300" href="#void">#ff8a65</a></span> </li>
|
|
430
|
+
<li class="color dark" style="background-color: #ff7043;"><span class="shade expanded">400</span><span class="hex"><a id="ff7043" class="mdColorValue md-white" title="Deep Orange 400" href="#void">#ff7043</a></span> </li>
|
|
431
|
+
<li class="color light-strong" style="background-color: #ff5722;"><span class="shade">500</span><span class="hex"><a id="ff5722" class="mdColorValue md-white" title="Deep Orange 500" href="#void">#ff5722</a></span> </li>
|
|
432
|
+
<li class="color" style="background-color: #f4511e;"><span class="shade expanded">600</span><span class="hex"><a id="f4511e" class="mdColorValue md-white" title="Deep Orange 600" href="#void">#f4511e</a></span> </li>
|
|
433
|
+
<li class="color" style="background-color: #e64a19;"><span class="shade">700</span><span class="hex"><a id="e64a19" class="mdColorValue md-white" title="Deep Orange 700" href="#void">#e64a19</a></span> </li>
|
|
434
|
+
<li class="color" style="background-color: #d84315;"><span class="shade expanded">800</span><span class="hex"><a id="d84315" class="mdColorValue md-white" title="Deep Orange 800" href="#void">#d84315</a></span> </li>
|
|
435
|
+
<li class="color" style="background-color: #bf360c;"><span class="shade expanded">900</span><span class="hex"><a id="bf360c" class="mdColorValue md-white" title="Deep Orange 900" href="#void">#bf360c</a></span> </li>
|
|
436
|
+
<li class="color dark divide" style="background-color: #ff9e80;"><span class="shade accent">A100</span><span class="hex"><a id="ff9e80" class="mdColorValue" title="Deep Orange A100" href="#void">#ff9e80</a></span> </li>
|
|
437
|
+
<li class="color dark" style="background-color: #ff6e40;"><span class="shade accent expanded">A200</span><span class="hex"><a id="ff6e40" class="mdColorValue md-white" title="Deep Orange A200" href="#void">#ff6e40</a></span> </li>
|
|
438
|
+
<li class="color" style="background-color: #ff3d00;"><span class="shade accent expanded">A400</span><span class="hex"><a id="ff3d00" class="mdColorValue md-white" title="Deep Orange A400" href="#void">#ff3d00</a></span> </li>
|
|
439
|
+
<li class="color" style="background-color: #dd2c00;"><span class="shade accent">A700</span><span class="hex"><a id="dd2c00" class="mdColorValue md-white" title="Deep Orange A700" href="#void">#dd2c00</a></span> </li>
|
|
440
440
|
</ul>
|
|
441
441
|
</div>
|
|
442
442
|
</div>
|
|
@@ -449,32 +449,32 @@ better reading or orientation.
|
|
|
449
449
|
<div class="color-palette col-lg-12">
|
|
450
450
|
<div class="color-group col-lg-6">
|
|
451
451
|
<ul>
|
|
452
|
-
<li class="color main-color" style="background-color: #795548;"> <span class="name">Brown</span> <span class="shade">500</span> <span class="hex">#795548</span> </li>
|
|
453
|
-
<li class="color dark" style="background-color: #efebe9;"><span class="shade expanded">50</span><span class="hex">#efebe9</span> </li>
|
|
454
|
-
<li class="color dark" style="background-color: #d7ccc8;"><span class="shade">100</span><span class="hex">#d7ccc8</span> </li>
|
|
455
|
-
<li class="color dark" style="background-color: #bcaaa4;"><span class="shade expanded">200</span><span class="hex">#bcaaa4</span> </li>
|
|
456
|
-
<li class="color light-strong" style="background-color: #a1887f;"><span class="shade">300</span><span class="hex">#a1887f</span> </li>
|
|
457
|
-
<li class="color" style="background-color: #8d6e63;"><span class="shade expanded">400</span><span class="hex">#8d6e63</span> </li>
|
|
458
|
-
<li class="color" style="background-color: #795548;"><span class="shade">500</span><span class="hex">#795548</span> </li>
|
|
459
|
-
<li class="color" style="background-color: #6d4c41;"><span class="shade expanded">600</span><span class="hex">#6d4c41</span> </li>
|
|
460
|
-
<li class="color" style="background-color: #5d4037;"><span class="shade">700</span><span class="hex">#5d4037</span> </li>
|
|
461
|
-
<li class="color" style="background-color: #4e342e;"><span class="shade expanded">800</span><span class="hex">#4e342e</span> </li>
|
|
462
|
-
<li class="color" style="background-color: #3e2723;"><span class="shade expanded">900</span><span class="hex">#3e2723</span> </li>
|
|
452
|
+
<li class="color main-color" style="background-color: #795548;"> <span class="name">Brown</span> <span class="shade">500</span> <span class="hex"><a id="795548" class="mdColorValue md-white" title="Brown" href="#void">#795548</a></span> </li>
|
|
453
|
+
<li class="color dark" style="background-color: #efebe9;"><span class="shade expanded">50</span><span class="hex"><a id="efebe9" class="mdColorValue" title="Brown" href="#void">#efebe9</a></span> </li>
|
|
454
|
+
<li class="color dark" style="background-color: #d7ccc8;"><span class="shade">100</span><span class="hex"><a id="d7ccc8" class="mdColorValue" title="Brown" href="#void">#d7ccc8</a></span> </li>
|
|
455
|
+
<li class="color dark" style="background-color: #bcaaa4;"><span class="shade expanded">200</span><span class="hex"><a id="bcaaa4" class="mdColorValue" title="Brown" href="#void">#bcaaa4</a></span> </li>
|
|
456
|
+
<li class="color light-strong" style="background-color: #a1887f;"><span class="shade">300</span><span class="hex"><a id="a1887f" class="mdColorValue md-white" title="Brown" href="#void">#a1887f</a></span> </li>
|
|
457
|
+
<li class="color" style="background-color: #8d6e63;"><span class="shade expanded">400</span><span class="hex"><a id="8d6e63" class="mdColorValue md-white" title="Brown" href="#void">#8d6e63</a></span> </li>
|
|
458
|
+
<li class="color" style="background-color: #795548;"><span class="shade">500</span><span class="hex"><a id="795548" class="mdColorValue md-white" title="Brown" href="#void">#795548</a></span> </li>
|
|
459
|
+
<li class="color" style="background-color: #6d4c41;"><span class="shade expanded">600</span><span class="hex"><a id="6d4c41" class="mdColorValue md-white" title="Brown" href="#void">#6d4c41</a></span> </li>
|
|
460
|
+
<li class="color" style="background-color: #5d4037;"><span class="shade">700</span><span class="hex"><a id="5d4037" class="mdColorValue md-white" title="Brown" href="#void">#5d4037</a></span> </li>
|
|
461
|
+
<li class="color" style="background-color: #4e342e;"><span class="shade expanded">800</span><span class="hex"><a id="4e342e" class="mdColorValue md-white" title="Brown" href="#void">#4e342e</a></span> </li>
|
|
462
|
+
<li class="color" style="background-color: #3e2723;"><span class="shade expanded">900</span><span class="hex"><a id="3e2723" class="mdColorValue md-white" title="Brown" href="#void">#3e2723</a></span> </li>
|
|
463
463
|
</ul>
|
|
464
464
|
</div>
|
|
465
465
|
<div class="color-group col-lg-6">
|
|
466
466
|
<ul>
|
|
467
|
-
<li class="color main-color" style="background-color: #9e9e9e;"> <span class="name dark-when-small">Grey</span> <span class="shade dark-when-small">500</span> <span class="hex dark-when-small">#9e9e9e</span> </li>
|
|
468
|
-
<li class="color dark" style="background-color: #fafafa;"><span class="shade expanded">50</span><span class="hex">#fafafa</span> </li>
|
|
469
|
-
<li class="color dark" style="background-color: #f5f5f5;"><span class="shade">100</span><span class="hex">#f5f5f5</span> </li>
|
|
470
|
-
<li class="color dark" style="background-color: #eeeeee;"><span class="shade expanded">200</span><span class="hex">#eeeeee</span> </li>
|
|
471
|
-
<li class="color dark" style="background-color: #e0e0e0;"><span class="shade">300</span><span class="hex">#e0e0e0</span> </li>
|
|
472
|
-
<li class="color dark" style="background-color: #bdbdbd;"><span class="shade expanded">400</span><span class="hex">#bdbdbd</span> </li>
|
|
473
|
-
<li class="color dark" style="background-color: #9e9e9e;"><span class="shade">500</span><span class="hex">#9e9e9e</span> </li>
|
|
474
|
-
<li class="color" style="background-color: #757575;"><span class="shade expanded">600</span><span class="hex">#757575</span> </li>
|
|
475
|
-
<li class="color" style="background-color: #616161;"><span class="shade">700</span><span class="hex">#616161</span> </li>
|
|
476
|
-
<li class="color" style="background-color: #424242;"><span class="shade expanded">800</span><span class="hex">#424242</span> </li>
|
|
477
|
-
|
|
467
|
+
<li class="color main-color" style="background-color: #9e9e9e;"> <span class="name dark-when-small">Grey</span> <span class="shade dark-when-small">500</span> <span class="hex dark-when-small"><a id="9e9e9e" class="mdColorValue md-white" title="Grey" href="#void">#9e9e9e</a></span> </li>
|
|
468
|
+
<li class="color dark" style="background-color: #fafafa;"><span class="shade expanded">50</span><span class="hex"><a id="fafafa" class="mdColorValue" title="Grey" href="#void">#fafafa</a></span> </li>
|
|
469
|
+
<li class="color dark" style="background-color: #f5f5f5;"><span class="shade">100</span><span class="hex"><a id="f5f5f5" class="mdColorValue" title="Grey" href="#void">#f5f5f5</a></span> </li>
|
|
470
|
+
<li class="color dark" style="background-color: #eeeeee;"><span class="shade expanded">200</span><span class="hex"><a id="eeeeee" class="mdColorValue" title="Grey" href="#void">#eeeeee</a></span> </li>
|
|
471
|
+
<li class="color dark" style="background-color: #e0e0e0;"><span class="shade">300</span><span class="hex"><a id="e0e0e0" class="mdColorValue" title="Grey" href="#void">#e0e0e0</a></span> </li>
|
|
472
|
+
<li class="color dark" style="background-color: #bdbdbd;"><span class="shade expanded">400</span><span class="hex"><a id="bdbdbd" class="mdColorValue" title="Grey" href="#void">#bdbdbd</a></span> </li>
|
|
473
|
+
<li class="color dark" style="background-color: #9e9e9e;"><span class="shade">500</span><span class="hex"><a id="9e9e9e" class="mdColorValue md-white" title="Grey" href="#void">#9e9e9e</a></span> </li>
|
|
474
|
+
<li class="color" style="background-color: #757575;"><span class="shade expanded">600</span><span class="hex"><a id="757575" class="mdColorValue md-white" title="Grey" href="#void">#757575</a></span> </li>
|
|
475
|
+
<li class="color" style="background-color: #616161;"><span class="shade">700</span><span class="hex"><a id="616161" class="mdColorValue md-white" title="Grey" href="#void">#616161</a></span> </li>
|
|
476
|
+
<li class="color" style="background-color: #424242;"><span class="shade expanded">800</span><span class="hex"><a id="424242" class="mdColorValue md-white" title="Grey" href="#void">#424242</a></span> </li>
|
|
477
|
+
<li class="color" style="background-color: #212121;"><span class="shade expanded">900</span><span class="hex"><a id="212121" class="mdColorValue md-white" title="Grey" href="#void">#212121</a></span> </li>
|
|
478
478
|
</ul>
|
|
479
479
|
</div>
|
|
480
480
|
</div>
|
|
@@ -487,25 +487,88 @@ better reading or orientation.
|
|
|
487
487
|
<div class="color-palette col-lg-12">
|
|
488
488
|
<div class="color-group col-lg-6">
|
|
489
489
|
<ul>
|
|
490
|
-
<li class="color main-color" style="background-color: #607d8b;"> <span class="name light-strong">Blue Grey</span> <span class="shade light-strong">500</span> <span class="hex light-strong">#607d8b</span> </li>
|
|
491
|
-
<li class="color dark" style="background-color: #eceff1;"><span class="shade expanded">50</span><span class="hex">#eceff1</span> </li>
|
|
492
|
-
<li class="color dark" style="background-color: #cfd8dc;"><span class="shade">100</span><span class="hex">#cfd8dc</span> </li>
|
|
493
|
-
<li class="color dark" style="background-color: #b0bec5;"><span class="shade expanded">200</span><span class="hex">#b0bec5</span> </li>
|
|
494
|
-
<li class="color dark" style="background-color: #90a4ae;"><span class="shade">300</span><span class="hex">#90a4ae</span> </li>
|
|
495
|
-
<li class="color light-strong" style="background-color: #78909c;"><span class="shade expanded">400</span><span class="hex">#78909c</span> </li>
|
|
496
|
-
<li class="color" style="background-color: #607d8b;"><span class="shade">500</span><span class="hex">#607d8b</span> </li>
|
|
497
|
-
<li class="color" style="background-color: #546e7a;"><span class="shade expanded">600</span><span class="hex">#546e7a</span> </li>
|
|
498
|
-
<li class="color" style="background-color: #455a64;"><span class="shade">700</span><span class="hex">#455a64</span> </li>
|
|
499
|
-
<li class="color" style="background-color: #37474f;"><span class="shade expanded">800</span><span class="hex">#37474f</span> </li>
|
|
500
|
-
<li class="color" style="background-color: #263238;"><span class="shade expanded">900</span><span class="hex">#263238</span> </li>
|
|
490
|
+
<li class="color main-color" style="background-color: #607d8b;"> <span class="name light-strong">Blue Grey</span> <span class="shade light-strong">500</span> <span class="hex light-strong"><a id="607d8b" class="mdColorValue md-white" title="Blue Grey" href="#void">#607d8b</a></span> </li>
|
|
491
|
+
<li class="color dark" style="background-color: #eceff1;"><span class="shade expanded">50</span><span class="hex"><a id="eceff1" class="mdColorValue" title="Blue Grey" href="#void">#eceff1</a></span> </li>
|
|
492
|
+
<li class="color dark" style="background-color: #cfd8dc;"><span class="shade">100</span><span class="hex"><a id="cfd8dc" class="mdColorValue" title="Blue Grey" href="#void">#cfd8dc</a></span> </li>
|
|
493
|
+
<li class="color dark" style="background-color: #b0bec5;"><span class="shade expanded">200</span><span class="hex"><a id="b0bec5" class="mdColorValue" title="Blue Grey" href="#void">#b0bec5</a></span> </li>
|
|
494
|
+
<li class="color dark" style="background-color: #90a4ae;"><span class="shade">300</span><span class="hex"><a id="90a4ae" class="mdColorValue" title="Blue Grey" href="#void">#90a4ae</a></span> </li>
|
|
495
|
+
<li class="color light-strong" style="background-color: #78909c;"><span class="shade expanded">400</span><span class="hex"><a id="78909c" class="mdColorValue md-white" title="Blue Grey" href="#void">#78909c</a></span> </li>
|
|
496
|
+
<li class="color" style="background-color: #607d8b;"><span class="shade">500</span><span class="hex"><a id="607d8b" class="mdColorValue md-white" title="Blue Grey" href="#void">#607d8b</a></span> </li>
|
|
497
|
+
<li class="color" style="background-color: #546e7a;"><span class="shade expanded">600</span><span class="hex"><a id="546e7a" class="mdColorValue md-white" title="Blue Grey" href="#void">#546e7a</a></span> </li>
|
|
498
|
+
<li class="color" style="background-color: #455a64;"><span class="shade">700</span><span class="hex"><a id="455a64" class="mdColorValue md-white" title="Blue Grey" href="#void">#455a64</a></span> </li>
|
|
499
|
+
<li class="color" style="background-color: #37474f;"><span class="shade expanded">800</span><span class="hex"><a id="37474f" class="mdColorValue md-white" title="Blue Grey" href="#void">#37474f</a></span> </li>
|
|
500
|
+
<li class="color" style="background-color: #263238;"><span class="shade expanded">900</span><span class="hex"><a id="263238" class="mdColorValue md-white" title="Blue Grey" href="#void">#263238</a></span> </li>
|
|
501
501
|
</ul>
|
|
502
502
|
</div>
|
|
503
503
|
<div class="color-group col-lg-6">
|
|
504
504
|
<ul>
|
|
505
|
-
<li class="color" style="background-color: #000000;"><span class="shade accent">Black</span><span class="hex">#000000</span> </li>
|
|
506
|
-
<li class="color dark" style="background-color: #ffffff;"><span class="shade accent expanded">White</span><span class="hex">#ffffff</span> </li>
|
|
505
|
+
<li class="color" style="background-color: #000000;"><span class="shade accent">Black</span><span class="hex"><a id="000000" class="mdColorValue md-white" title="Black" href="#void">#000000</a></span> </li>
|
|
506
|
+
<li class="color dark" style="background-color: #ffffff;"><span class="shade accent expanded">White</span><span class="hex"><a id="ffffff" class="mdColorValue" title="Black" href="#void">#ffffff</a></span> </li>
|
|
507
507
|
</ul>
|
|
508
508
|
</div>
|
|
509
509
|
</div>
|
|
510
510
|
</div>
|
|
511
|
+
|
|
512
|
+
<script>
|
|
513
|
+
|
|
514
|
+
$(document).on('click', '.mdColorValue', function () {
|
|
515
|
+
copyText(this.id)
|
|
516
|
+
});
|
|
517
|
+
|
|
518
|
+
function copyText(id) {
|
|
519
|
+
var copyText = id.toUpperCase();
|
|
520
|
+
var copyFrom = document.createElement('textarea');
|
|
521
|
+
// var language = 'de';
|
|
522
|
+
var language = '{{site.language}}';
|
|
523
|
+
|
|
524
|
+
if (language == 'en') {
|
|
525
|
+
responseText = 'Copied to Clipboard';
|
|
526
|
+
} else if (language == 'de') {
|
|
527
|
+
responseText = 'Kopiert zur Zwischenablage';
|
|
528
|
+
} else {
|
|
529
|
+
responseText = 'Copied to Clipboard';
|
|
530
|
+
}
|
|
531
|
+
|
|
532
|
+
copyFrom.setAttribute("style", "position:fixed;opacity:0;top:100px;left:100px;");
|
|
533
|
+
copyFrom.value = copyText;
|
|
534
|
+
document.body.appendChild(copyFrom);
|
|
535
|
+
copyFrom.select();
|
|
536
|
+
document.execCommand('copy');
|
|
537
|
+
var copied = document.createElement('div');
|
|
538
|
+
copied.setAttribute('class', 'copied');
|
|
539
|
+
copied.appendChild(document.createTextNode(responseText));
|
|
540
|
+
document.body.appendChild(copied);
|
|
541
|
+
|
|
542
|
+
setTimeout(function () {
|
|
543
|
+
document.body.removeChild(copyFrom);
|
|
544
|
+
document.body.removeChild(copied);
|
|
545
|
+
}, 1500);
|
|
546
|
+
|
|
547
|
+
} // END copyText
|
|
548
|
+
|
|
549
|
+
</script>
|
|
550
|
+
|
|
551
|
+
<style>
|
|
552
|
+
.mdColorValue:hover {
|
|
553
|
+
color: rgba(0, 0, 0, 0.9) !important;
|
|
554
|
+
font-weight: 600 !important;
|
|
555
|
+
text-decoration: none !important;
|
|
556
|
+
}
|
|
557
|
+
|
|
558
|
+
div.copied {
|
|
559
|
+
position: fixed;
|
|
560
|
+
top: 100px;
|
|
561
|
+
left: 50%;
|
|
562
|
+
width: 300px;
|
|
563
|
+
text-align: center;
|
|
564
|
+
color: #FAFAFA;
|
|
565
|
+
background-color: #2196F3;
|
|
566
|
+
border: 1px solid #0D47A1;
|
|
567
|
+
padding: 10px 15px;
|
|
568
|
+
border-radius: 4px;
|
|
569
|
+
margin-left: -100px;
|
|
570
|
+
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
|
|
571
|
+
}
|
|
572
|
+
</style>
|
|
573
|
+
|
|
511
574
|
++++
|