scratchfoundation/scratch-www
1
0
Fork 0
mirror of https://github.com/scratchfoundation/scratch-www.git synced 2025-02-17 00:21:20 -05:00
Code Issues Projects Releases Packages Wiki Activity Actions 2

Replace last remaining HEX colors in _colors.scss

Browse source 
There were a few colors used in the logged-out Welcome message. Replaced them with new 3.0 colors.
This commit is contained in:
carljbowman 2018-07-17 09:26:46 -04:00
parent 9d87d8700c
commit ef9b726f63
5 changed files with 21 additions and 26 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
src/_colors.scss
View file

@ -43,10 +43,5 @@ $type-white: hsla(0, 100, 100, 1); //#FFF
$link-blue: $ui-blue;
/* Component colors */
$splash-green: #9c0;
$splash-pink: #c2479d;
$splash-blue: #199ed7;
/* Down Deep */
$dd-darkblue: hsla(195, 72.4, 17.1, 1);

18
src/components/intro/intro.scss
View file

@ -94,37 +94,37 @@
&.sprite-1 {
.circle {
background-color: $splash-green;
background-color: $ui-aqua;
}
.text {
top: 60px;
left: 50px;
color: $splash-green;
color: $ui-aqua;
}
}
&.sprite-2 {
.circle {
background-color: $splash-pink;
background-color: $ui-purple;
}
.text {
top: 77px;
left: 50px;
color: $splash-pink;
color: $ui-purple;
}
}
&.sprite-3 {
.circle {
background-color: $splash-blue;
background-color: $ui-blue;
}
.text {
top: 37px;
left: 45px;
color: $splash-blue;
color: $ui-blue;
}
.subtext {
@ -145,19 +145,19 @@
&.sprite-1 {
.circle {
box-shadow: 0 0 10px 2px $splash-green;
box-shadow: 0 0 10px 2px $ui-aqua;
}
}
&.sprite-2 {
.circle {
box-shadow: 0 0 10px 2px $splash-pink;
box-shadow: 0 0 10px 2px $ui-purple;
}
}
&.sprite-3 {
.circle {
box-shadow: 0 0 10px 2px $splash-blue;
box-shadow: 0 0 10px 2px $ui-blue;
}
}
}

12
src/components/welcome/welcome.scss
View file

@ -37,31 +37,31 @@
&.blue {
#{$color-bars} {
background-color: $splash-blue;
background-color: $ui-blue;
}
a {
color: $splash-blue;
color: $ui-blue;
}
}
&.green {
#{$color-bars} {
background-color: $splash-green;
background-color: $ui-aqua;
}
a {
color: $splash-green;
color: $ui-aqua;
}
}
&.pink {
#{$color-bars} {
background-color: $splash-pink;
background-color: $ui-purple;
}
a {
color: $splash-pink;
color: $ui-purple;
}
}
}

6
src/views/components/components.jsx
View file

@ -57,9 +57,9 @@ const Components = () => (
<span className="type-gray">$type-gray</span>
<span className="type-white">$type-white</span>
<span className="link-blue">$link-blue</span>
<span className="splash-green">$splash-green</span>
<span className="splash-pink">$splash-pink</span>
<span className="splash-blue">$splash-blue</span>
<span className="splash-green">$ui-aqua</span>
<span className="splash-pink">$ui-purple</span>
<span className="splash-blue">$ui-blue</span>
</div>
</div>
</div>

6
src/views/components/components.scss
View file

@ -101,15 +101,15 @@
}
.splash-green {
background-color: $splash-green;
background-color: $ui-aqua;
}
.splash-pink {
background-color: $splash-pink;
background-color: $ui-purple;
}
.splash-blue {
background-color: $splash-blue;
background-color: $ui-blue;
}
}
}