Skip to content

Commit 03b3566

Browse files
hellcphellcp
committed
Make sure that the grays are ordered by luminocity
Signed-off-by: Stasia Michalska <[email protected]>
1 parent 4e13f52 commit 03b3566

21 files changed

+83
-85
lines changed

‎source/_sass/base/_variables.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ $base-border-radius: em(3);
3434
$base-background-color: #fff;
3535

3636
// Font Colors
37-
$base-font-color: $gray-03;
37+
$base-font-color: $gray-08;
3838
$base-accent-color: $lightblue;
3939

4040
// Link Colors
@@ -44,7 +44,7 @@ $base-button-color: $base-link-color;
4444
$hover-button-color: $hover-link-color;
4545

4646
// Border color
47-
$base-border-color: $gray-03;
47+
$base-border-color: $gray-08;
4848

4949
// Flash Colors
5050
$alert-color: $yellow;

‎source/_sass/colors.scss‎

Lines changed: 10 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -55,17 +55,15 @@ $bigbox--darkgreen: color.adjust($bigbox--green, $lightness: -20%, $space: hsl);
5555
$bigbox--dark-blue: color.adjust($darkerlightblue, $lightness: -20%, $space: hsl);
5656

5757
$gray-01: #f4f4f4;
58-
$gray-02: #444;
59-
$gray-03: #484848;
60-
$gray-04: #eee;
61-
$gray-05: #e5e4e4;
62-
$gray-06: #d6d6d6;
63-
$gray-07: #272822;
64-
$gray-08: #ddd;
65-
$gray-09: #bebebe;
66-
$gray-10: #d9d9d9;
67-
$gray-11: #666;
68-
$gray-12: #ccc;
58+
$gray-02: #eee;
59+
$gray-03: #e5e4e4;
60+
$gray-04: #d9d9d9;
61+
$gray-05: #bebebe;
62+
$gray-06: ;
63+
$gray-07: #666;
64+
$gray-08: #444;
65+
$gray-09: #272822;
66+
$gray-10: #12130f;
6967

7068
$bigbox--blue: $lightblue;
7169
$bigbox--green: #22a048;
@@ -76,7 +74,7 @@ $color-community: $purple;
7674
$color-more: $green;
7775
$color-getting-started: $dark-red;
7876
$color-sdk: $lightblue;
79-
$color-appstore: $gray-03;
77+
$color-appstore: $gray-08;
8078
$color-other: $dark-grey;
8179
$color-blog: $orange-02;
8280
$color-examples: #2c67ce;

‎source/_sass/elements/bigbox.scss‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -98,15 +98,15 @@
9898
}
9999

100100
.bigbox--lightgray {
101-
background-color: $gray-04;
101+
background-color: $gray-02;
102102
}
103103

104104
.bigbox--gray {
105-
background-color: $gray-05;
105+
background-color: $gray-03;
106106
}
107107

108108
.bigbox--darkgray {
109-
background-color: $gray-02;
109+
background-color: $gray-08;
110110
color: $white;
111111
}
112112

@@ -170,7 +170,7 @@
170170
}
171171

172172
.bigbox__guides-building {
173-
background-color: $gray-02;
173+
background-color: $gray-08;
174174
color: $breakfast-room-white;
175175
background-image: url('/assets/images/landing-page/back_for_more_bg.png');
176176
}
@@ -182,7 +182,7 @@
182182
}
183183

184184
.bigbox__guides-interactive {
185-
background-color: $gray-02;
185+
background-color: $gray-08;
186186
color: $breakfast-room-white;
187187
background-image: url('/assets/images/landing-page/interactive_bg.png');
188188
}

‎source/_sass/elements/buttons.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -38,8 +38,8 @@ submit.btn {
3838
font-size: inherit;
3939
}
4040

41-
$btn-colors: $white $gray-02 $green $blue $red $purple $yellow $orange $lightblue $dark-red $orange-02 $android-green;
42-
$btn-names: 'white' gray-02 'green' 'blue' 'red' 'purple' 'yellow' 'orange' 'lightblue' 'dark-red' 'orange-02' 'android-green';
41+
$btn-colors: $white $dark-grey $green $blue $red $purple $yellow $orange $lightblue $dark-red $orange-02 $android-green;
42+
$btn-names: 'white' 'dark-grey' 'green' 'blue' 'red' 'purple' 'yellow' 'orange' 'lightblue' 'dark-red' 'orange-02' 'android-green';
4343

4444
@each $color in $btn-colors {
4545
$i: list.index($btn-colors, $color);

‎source/_sass/elements/form.scss‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -25,10 +25,10 @@
2525
select,
2626
textarea {
2727
background-color: white;
28-
border: 1px solid $gray-06;
28+
border: 1px solid $gray-04;
2929
border-left: none;
3030
border-radius: 0 5px 5px 0;
31-
color: $gray-02;
31+
color: $gray-08;
3232
display: table-cell;
3333
font-family: $sans-serif;
3434
font-size: 15px;
@@ -59,7 +59,7 @@
5959
.select-style {
6060
background-color: white;
6161
border-radius: 0 5px 5px 0;
62-
border: 1px solid $gray-06;
62+
border: 1px solid $gray-04;
6363
border-left-width: 0;
6464
color: color.adjust(#444, $alpha: -0.5);
6565
display: table-cell;
@@ -92,7 +92,7 @@
9292

9393
label {
9494
background-color: #fff;
95-
border: 1px solid $gray-06;
95+
border: 1px solid $gray-04;
9696
border-right: none;
9797
border-radius: 5px 0 0 5px;
9898
color: #111;

‎source/_sass/elements/gray-box.scss‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@
1515
*/
1616

1717
.gray-box {
18-
background-color: $gray-04;
18+
background-color: $gray-02;
1919
border-radius: $base-border-radius;
2020
margin-bottom: 1em;
2121
overflow-x: hidden;
@@ -38,15 +38,15 @@
3838
}
3939

4040
h3 {
41-
color: $gray-02;
41+
color: $gray-08;
4242
font-size: 1.3em;
4343
font-weight: 600;
4444
text-transform: uppercase;
4545

4646
a,
4747
a:hover,
4848
a:active {
49-
color: $gray-02;
49+
color: $gray-08;
5050
}
5151

5252
a:hover,

‎source/_sass/elements/highlight.scss‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@
1515
*/
1616

1717
.highlight {
18-
background-color: $gray-07;
18+
background-color: $gray-09;
1919
border-radius: $base-border-radius;
2020
color: #f8f8f2;
2121
font: 13px/1.3em $monospace;

‎source/_sass/elements/markdown.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -26,10 +26,10 @@
2626
@extend %default-ol;
2727
}
2828

29-
$table-border-color: $gray-06;
29+
$table-border-color: $gray-04;
3030
$table-border: 1px solid $table-border-color;
3131
$table-background: $white;
32-
$table-header-background: $gray-02;
32+
$table-header-background: $gray-08;
3333
$table-header-color: $white;
3434
$table-hover-color: color.adjust($table-background, $lightness: -5%, $space: hsl);
3535
$table-stripe-color: color.adjust($table-background, $lightness: -4%, $space: hsl);

‎source/_sass/elements/mobile-nav.scss‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
$hamburger-width: $header-height;
2121

2222
.mobile-nav {
23-
background-color: $gray-03;
23+
background-color: $gray-08;
2424
bottom: 0;
2525
left: 0;
2626
overflow-y: auto;
@@ -45,21 +45,21 @@ $hamburger-width: $header-height;
4545
text-transform: uppercase;
4646

4747
&:hover {
48-
background-color: color.adjust($gray-03, $lightness: 10%, $space: hsl);
48+
background-color: color.adjust($gray-08, $lightness: 10%, $space: hsl);
4949
}
5050
}
5151

5252
.mainmenu__item.active a {
53-
background-color: $gray-06;
54-
color: $gray-03;
53+
background-color: $gray-04;
54+
color: $gray-08;
5555
}
5656
}
5757

5858
.mobile-nav__hamburger {
5959
display: none;
6060

6161
@include bp-max (xs) {
62-
border-bottom: 1px solid $gray-10;
62+
border-bottom: 1px solid $gray-04;
6363
display: block;
6464
position: fixed;
6565
background-color: $white;
@@ -70,11 +70,11 @@ $hamburger-width: $header-height;
7070
padding: math.div($base-font-size, 1.5) 0;
7171
font-size: $base-font-size * 2;
7272
text-align: center;
73-
color: $gray-03;
73+
color: $gray-08;
7474

7575
&:hover,
7676
&:active {
77-
color: $gray-03;
77+
color: $gray-08;
7878
}
7979
}
8080
}

‎source/_sass/elements/pagination.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -22,9 +22,9 @@
2222
}
2323

2424
a {
25-
border: 1px solid $gray-08;
25+
border: 1px solid $gray-04;
2626
border-radius: $base-border-radius;
27-
color: $gray-02;
27+
color: $gray-08;
2828
display: block;
2929
padding: 0.5rem 1rem;
3030

0 commit comments

Comments
 (0)