From 9eb776af90ef2d425b1667777a70224c637224f0 Mon Sep 17 00:00:00 2001
From: Coen van der Kamp <coen@fourdigits.nl>
Date: Wed, 26 Sep 2018 22:53:48 +0200
Subject: [PATCH] Restore backgrounds, input highlight and tabs. Use a darker
 gray for text.

---
 .../admin/static_src/wagtailadmin/scss/_variables.scss    | 8 ++++----
 .../static_src/wagtailadmin/scss/components/_listing.scss | 6 +++---
 .../static_src/wagtailadmin/scss/components/_tabs.scss    | 4 ++--
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/wagtail/admin/static_src/wagtailadmin/scss/_variables.scss b/wagtail/admin/static_src/wagtailadmin/scss/_variables.scss
index 92f6fd365..9efc942e7 100644
--- a/wagtail/admin/static_src/wagtailadmin/scss/_variables.scss
+++ b/wagtail/admin/static_src/wagtailadmin/scss/_variables.scss
@@ -39,7 +39,7 @@ $color-white: #fff;
 $color-black: #000;
 
 // darker to lighter
-$color-grey-1: darken($color-white, 90);
+$color-grey-1: darken($color-white, 80);
 $color-grey-2: darken($color-white, 70);
 
 $color-grey-3: darken($color-white, 15);
@@ -53,7 +53,7 @@ $color-header-bg: $color-teal;
 
 $color-fieldset-hover: $color-grey-5;
 $color-input-border: $color-grey-4;
-$color-input-focus: lighten(saturate($color-teal, 12), 50);
+$color-input-focus: lighten(desaturate($color-teal, 40), 72);
 $color-input-focus-border: lighten(saturate($color-teal, 12), 10);
 $color-input-error-bg: lighten(saturate($color-red, 28), 45);
 
@@ -68,8 +68,8 @@ $color-button-warning-hover: darken($color-orange, 20%);
 $color-link: $color-teal;
 $color-link-hover: $color-teal-dark;
 
-$color-text-base: $color-grey-2;
-$color-text-input: $color-grey-1;
+$color-text-base: darken($color-white, 85);
+$color-text-input: darken($color-white, 90);
 
 // Color states
 $color-state-live: #59b524;
diff --git a/wagtail/admin/static_src/wagtailadmin/scss/components/_listing.scss b/wagtail/admin/static_src/wagtailadmin/scss/components/_listing.scss
index ec146b625..515d21700 100644
--- a/wagtail/admin/static_src/wagtailadmin/scss/components/_listing.scss
+++ b/wagtail/admin/static_src/wagtailadmin/scss/components/_listing.scss
@@ -193,7 +193,7 @@ ul.listing {
             margin: 0;
             font-size: 1.15em;
             font-weight: 600;
-            color: darken($color-text-base, 10);
+            color: $color-text-base;
             line-height: 1.5em;
 
             a {
@@ -375,7 +375,7 @@ ul.listing {
         .button {
             background-color: $color-white;
             color: $color-teal;
-            border-color: $color-teal;
+            border-color: rgba(0, 0, 0, 0.25);
 
             &:hover {
                 color: $color-white;
@@ -472,7 +472,7 @@ table.listing {
         .button {
             background-color: transparent;
             color: $color-white;
-            border-color: $color-teal-darker;
+            border-color: rgba(0, 0, 0, 0.25);
 
             &:hover {
                 color: $color-white;
diff --git a/wagtail/admin/static_src/wagtailadmin/scss/components/_tabs.scss b/wagtail/admin/static_src/wagtailadmin/scss/components/_tabs.scss
index 499538f43..66dfca5ac 100644
--- a/wagtail/admin/static_src/wagtailadmin/scss/components/_tabs.scss
+++ b/wagtail/admin/static_src/wagtailadmin/scss/components/_tabs.scss
@@ -18,7 +18,7 @@
 
     a {
         @include transition(border-color 0.2s ease);
-        background-color: lighten($color-teal-darker, 3%);
+        background-color: $color-teal-darker;
         outline: none;
         text-transform: uppercase;
         font-weight: 700;
@@ -27,7 +27,7 @@
         display: block;
         padding: 0.7em;
         color: $color-white;
-        border-top: 0.3em solid lighten($color-teal-darker, 3%);
+        border-top: 0.3em solid $color-teal-darker;
         max-height: 1.2em;
         overflow: hidden;