From ee1a6fa96f72a04d4bb691de51780fbb3c3a38a5 Mon Sep 17 00:00:00 2001
From: evazion <noizave@gmail.com>
Date: Thu, 19 Sep 2019 02:22:15 -0500
Subject: [PATCH] css: add <input> placeholder & quick search form styling.

---
 app/javascript/src/styles/base/020_base.scss      | 7 +++++++
 app/javascript/src/styles/base/040_colors.css     | 3 +++
 app/javascript/src/styles/common/simple_form.scss | 4 ++++
 3 files changed, 14 insertions(+)

diff --git a/app/javascript/src/styles/base/020_base.scss b/app/javascript/src/styles/base/020_base.scss
index c0e31b18b..fe29aa756 100644
--- a/app/javascript/src/styles/base/020_base.scss
+++ b/app/javascript/src/styles/base/020_base.scss
@@ -81,6 +81,13 @@ input[type="button"], input[type="submit"], button {
   }
 }
 
+/* placeholder text in <input type="text"> elements */
+::placeholder {
+  color: var(--form-input-placeholder-text-color);
+  font-size: 0.9em;
+  padding-left: 0.5em;
+}
+
 menu {
   margin: 0;
   padding: 0;
diff --git a/app/javascript/src/styles/base/040_colors.css b/app/javascript/src/styles/base/040_colors.css
index 48634ddf3..3b6a6bc22 100644
--- a/app/javascript/src/styles/base/040_colors.css
+++ b/app/javascript/src/styles/base/040_colors.css
@@ -29,6 +29,7 @@
   --form-input-text-color: var(--text-color);
   --form-input-background: var(--body-background-color);
   --form-input-border: 1px solid #CCC;
+  --form-input-placeholder-text-color: grey;
   --form-button-text-color: var(--form-input-text-color);
   --form-button-background: #EEE;
   --form-button-border: var(--form-input-border);
@@ -38,6 +39,8 @@
   --form-button-active-border: var(--form-button-border);
   --form-button-active-color: var(--form-button-text-color);
 
+  --quick-search-form-background: var(--body-background-color);
+
   --user-upgrade-gold-background-color: #FFF380;
   --user-upgrade-platinum-background-color: #EEE;
   --user-upgrade-table-row-hover-background-color: #FEF;
diff --git a/app/javascript/src/styles/common/simple_form.scss b/app/javascript/src/styles/common/simple_form.scss
index 0495ede3c..fd9b1d8bf 100644
--- a/app/javascript/src/styles/common/simple_form.scss
+++ b/app/javascript/src/styles/common/simple_form.scss
@@ -82,6 +82,10 @@ form.inline-form {
 
 form.quick-search-form {
   margin: 0;
+
+  input {
+    background: var(--quick-search-form-background);
+  }
 }
 
 form.one-line-form {