diff --git a/styles/css/v4.0.css b/styles/css/v4.0.css
index 71670a0872cdb2cfbbc0cb074acb0bde1139f33f..cc41077286cd16d3fbb20c617e735e4798098828 100644
--- a/styles/css/v4.0.css
+++ b/styles/css/v4.0.css
@@ -45,7 +45,7 @@
.wdn-band-neutral-seperator {
border-width: 2px 0 2px 0;
border-style: solid;
- border-color: rgba(74, 59, 19, 0.09999999999999998);
+ border-color: rgba(89, 88, 85, 0.09999999999999998);
}
.wdn-quote {
quotes: "\201C" "\201D";
@@ -158,10 +158,10 @@
}
.icon-chat {
background-image: url(images/icon-chat.svg);
- background-color: #008a2c;
- -webkit-box-shadow: 0 6px 0 rgba(0, 0, 0, 0.4), 0 6px 0 #008a2c;
- -moz-box-shadow: 0 6px 0 rgba(0, 0, 0, 0.4), 0 6px 0 #008a2c;
- box-shadow: 0 6px 0 rgba(0, 0, 0, 0.4), 0 6px 0 #008a2c;
+ background-color: #00892c;
+ -webkit-box-shadow: 0 6px 0 rgba(0, 0, 0, 0.4), 0 6px 0 #00892c;
+ -moz-box-shadow: 0 6px 0 rgba(0, 0, 0, 0.4), 0 6px 0 #00892c;
+ box-shadow: 0 6px 0 rgba(0, 0, 0, 0.4), 0 6px 0 #00892c;
}
.icon-doc {
background-image: url(images/icon-doc.svg);
@@ -179,10 +179,10 @@
}
.icon-heading {
background-image: url(images/icon-heading.svg);
- background-color: #008a2c;
- -webkit-box-shadow: 0 6px 0 rgba(0, 0, 0, 0.4), 0 6px 0 #008a2c;
- -moz-box-shadow: 0 6px 0 rgba(0, 0, 0, 0.4), 0 6px 0 #008a2c;
- box-shadow: 0 6px 0 rgba(0, 0, 0, 0.4), 0 6px 0 #008a2c;
+ background-color: #00892c;
+ -webkit-box-shadow: 0 6px 0 rgba(0, 0, 0, 0.4), 0 6px 0 #00892c;
+ -moz-box-shadow: 0 6px 0 rgba(0, 0, 0, 0.4), 0 6px 0 #00892c;
+ box-shadow: 0 6px 0 rgba(0, 0, 0, 0.4), 0 6px 0 #00892c;
}
.icon-image {
background-image: url(images/icon-image.svg);
@@ -200,10 +200,10 @@
}
.icon-band {
background-image: url(images/icon-band.svg);
- background-color: #008a2c;
- -webkit-box-shadow: 0 6px 0 rgba(0, 0, 0, 0.4), 0 6px 0 #008a2c;
- -moz-box-shadow: 0 6px 0 rgba(0, 0, 0, 0.4), 0 6px 0 #008a2c;
- box-shadow: 0 6px 0 rgba(0, 0, 0, 0.4), 0 6px 0 #008a2c;
+ background-color: #00892c;
+ -webkit-box-shadow: 0 6px 0 rgba(0, 0, 0, 0.4), 0 6px 0 #00892c;
+ -moz-box-shadow: 0 6px 0 rgba(0, 0, 0, 0.4), 0 6px 0 #00892c;
+ box-shadow: 0 6px 0 rgba(0, 0, 0, 0.4), 0 6px 0 #00892c;
}
.browser-band {
border-top: 100px solid #137cbd;
@@ -388,7 +388,7 @@ pre code {
.counter:before {
counter-increment: how-to;
content: counter(how-to);
- background: #008a2c;
+ background: #00892c;
border-radius: 50%;
width: 2em;
height: 2em;
@@ -410,6 +410,7 @@ pre code {
text-align: center;
text-shadow: 1px 1px 1px #cae7be;
margin-bottom: 1rem;
+ color: #41403d;
}
.color-details {
font-family: "Gotham SSm A", "Gotham SSm B", Verdana, "Verdana Ref", Geneva, Tahoma, "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", "DejaVu Sans", "Bitstream Vera Sans", "Liberation Sans", sans-serif;
@@ -433,7 +434,7 @@ pre code {
background-color: #4a3b13;
}
.color-holder.complement {
- background-color: #008a2c;
+ background-color: #00892c;
}
.color-holder.energetic {
background-color: #d4440b;
@@ -446,12 +447,14 @@ pre code {
}
.color-holder.light-triad {
background-color: #1b9ae8;
+ color: #000;
}
.color-holder.dark-complement {
background-color: #38764c;
}
.color-holder.light-complement {
- background-color: #00bd3c;
+ background-color: #00bc3c;
+ color: #000;
}
.color-holder.dark-neutral {
background-color: #453e2b;
@@ -461,6 +464,7 @@ pre code {
}
.color-holder.light-energetic {
background-color: #f35b1f;
+ color: #000;
}
.color-holder.dark-energetic {
background-color: #b34e26;
@@ -471,16 +475,17 @@ pre code {
height: 2em;
}
.color-code-wrapper {
- background-color: rgba(59, 56, 22, 0.050000000000000044);
+ background-color: rgba(0, 0, 0, 0.75);
padding: 1em;
margin-bottom: 2em;
+ color: #fff;
}
.color-code-wrapper .label {
text-transform: uppercase;
font-weight: bold;
font-size: 0.75em;
display: block;
- border-bottom: 2px solid rgba(59, 56, 22, 0.050000000000000044);
+ border-bottom: 2px solid rgba(248, 245, 236, 0.25);
}
@-webkit-keyframes stretch {
from {
diff --git a/styles/less/v4.0.less b/styles/less/v4.0.less
index b36e91c06228a6ff0f470b8ca0d629eda5530803..f7c097042dfcb5c13aacf3dbbe96ac3dfadc5c6d 100644
--- a/styles/less/v4.0.less
+++ b/styles/less/v4.0.less
@@ -349,6 +349,7 @@ pre {
text-align: center;
text-shadow: 1px 1px 1px lighten(rgb(111,191,77), 30%);
margin-bottom: 1rem;
+ color: #41403d;
}
.color-details {
@@ -391,6 +392,7 @@ pre {
&.light-triad {
background-color: @light-triad;
+ color: #000;
}
&.dark-complement {
@@ -399,6 +401,7 @@ pre {
&.light-complement {
background-color: @light-complement;
+ color: #000;
}
&.dark-neutral {
@@ -411,6 +414,7 @@ pre {
&.light-energetic {
background-color: @light-energetic;
+ color: #000;
}
&.dark-energetic {
@@ -425,9 +429,10 @@ pre {
}
.color-code-wrapper {
- background-color: @faded-neutral;
+ background-color: fadeout(#000, 25);
padding: 1em;
margin-bottom:2em;
+ color: #fff;
@media @bp2 {
}
@@ -437,7 +442,7 @@ pre {
font-weight: bold;
font-size: 0.75em;
display: block;
- border-bottom: 2px solid @faded-neutral;
+ border-bottom: 2px solid fadeout(@cream, 75);
}
}