From 7a48c07b74a42c03241b1db471fb59c94d6c91c8 Mon Sep 17 00:00:00 2001
From: Stefan Malzner <stefan@adlk.io>
Date: Fri, 16 Nov 2018 20:43:08 +0100
Subject: Polishing & increasing contrast

---
 src/styles/auth.scss   | 4 ++--
 src/styles/button.scss | 8 +++++---
 src/styles/colors.scss | 5 +++--
 src/styles/input.scss  | 6 +++---
 src/styles/layout.scss | 4 ++--
 src/styles/select.scss | 2 +-
 6 files changed, 16 insertions(+), 13 deletions(-)

(limited to 'src')

diff --git a/src/styles/auth.scss b/src/styles/auth.scss
index 34bfa1805..4cdf6ccd5 100644
--- a/src/styles/auth.scss
+++ b/src/styles/auth.scss
@@ -16,11 +16,11 @@
   .auth__links {
     background: $dark-theme-gray-dark;
 
-    a { color: $dark-theme-gray-lighter; }
+    a { color: $dark-theme-text-color; }
   }
 
   .legal {
-    color: $dark-theme-gray-lighter;
+    color: $dark-theme-text-color;
 
     a { color: $dark-theme-gray-lightest; }
   }
diff --git a/src/styles/button.scss b/src/styles/button.scss
index 83ddf3e3e..0053db4d0 100644
--- a/src/styles/button.scss
+++ b/src/styles/button.scss
@@ -3,14 +3,14 @@
 
 .theme__dark .franz-form__button {
   background: $theme-brand-primary;
-  color: $dark-theme-gray-smoke;
+  color: $dark-theme-text-color;
 
   &:hover { background: darken($theme-brand-primary, 5%); }
   &:active { background: lighten($theme-brand-primary, 5%); }
 
   &.franz-form__button--secondary {
     background: $dark-theme-gray-lighter;
-    color: $dark-theme-gray-smoke;
+    color: $dark-theme-text-color;
 
     &:hover { background: darken($dark-theme-gray-lightest, 5%); }
     &:active { background: lighten($dark-theme-gray-lightest, 5%); }
@@ -36,9 +36,11 @@
 
     &:hover {
       background: darken($theme-brand-primary, 5%);
-      color: $dark-theme-gray-smoke;
+      color: $dark-theme-text-color;
     }
   }
+
+  &:disabled { opacity: .5; }
 }
 
 .franz-form__button {
diff --git a/src/styles/colors.scss b/src/styles/colors.scss
index b669c6a88..4411a0e81 100644
--- a/src/styles/colors.scss
+++ b/src/styles/colors.scss
@@ -31,7 +31,8 @@ $dark-theme-gray-dark:       #383A3B;
 $dark-theme-gray:            #47494B;
 
 $dark-theme-gray-light:      #515355;
-$dark-theme-gray-lighter:    #686A6C;
-$dark-theme-gray-lightest:   #A0A2A3;
+$dark-theme-gray-lighter:    #8a8b8b;
+$dark-theme-gray-lightest:   #FFF;
 
 $dark-theme-gray-smoke:      #CED0D1;
+$dark-theme-text-color:      #FFF;
diff --git a/src/styles/input.scss b/src/styles/input.scss
index f3c713f13..687bcac64 100644
--- a/src/styles/input.scss
+++ b/src/styles/input.scss
@@ -2,7 +2,7 @@
 @import './mixins.scss';
 
 .theme__dark .franz-form {
-  .franz-form__label { color: $dark-theme-gray-lightest; }
+  .franz-form__label { color: $dark-theme-text-color; }
 
   .franz-form__input-wrapper {
     background: $dark-theme-gray-dark;
@@ -10,9 +10,9 @@
   }
 
   .franz-form__input {
-    color: $dark-theme-gray-lighter;
+    color: $dark-theme-gray-lightest;
 
-    &::placeholder { color: $dark-theme-gray-light; }
+    &::placeholder { color: $dark-theme-gray-lighter; }
   }
 
   .franz-form__input-prefix,
diff --git a/src/styles/layout.scss b/src/styles/layout.scss
index 373b29e7d..ebf468cf0 100644
--- a/src/styles/layout.scss
+++ b/src/styles/layout.scss
@@ -9,12 +9,12 @@ html { overflow: hidden; }
     color: $theme-text-color;
 
     .sidebar__add-service {
-      color: $dark-theme-gray-lightest;
+      color: $dark-theme-gray-lighter;
       background: $dark-theme-gray;
     }
 
     .sidebar__button {
-      color: $dark-theme-gray-lightest;
+      color: $dark-theme-gray-lighter;
       font-size: 22px;
 
       &:hover,
diff --git a/src/styles/select.scss b/src/styles/select.scss
index 36ac963bb..ed0fc0fc2 100644
--- a/src/styles/select.scss
+++ b/src/styles/select.scss
@@ -6,7 +6,7 @@ $toggle: "PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj
 .theme__dark .franz-form .franz-form__select {
   background-color: $dark-theme-gray-dark;
   border: 1px solid $dark-theme-gray-light;
-  color: $dark-theme-gray-light;
+  color: $dark-theme-gray-lightest;
 }
 
 .franz-form .franz-form__select {
-- 
cgit v1.2.3-70-g09d2