From d8b18b9adfed677285bca8f6f5f20d0738b1a7fa Mon Sep 17 00:00:00 2001
From: Alexander Gudulin <alexandr.gudulin@gmail.com>
Date: Wed, 21 Oct 2015 21:27:53 +0300
Subject: [PATCH] Setup styles for dropdown (select) control

---
 .../preferences/stylesheets/preferences.less        |  6 +++---
 internal_packages/ui-dark/styles/ui-variables.less  | 13 +++++++------
 static/dropdowns.less                               |  8 ++++++++
 static/index.less                                   |  1 +
 static/variables/ui-variables.less                  |  6 ++++++
 5 files changed, 25 insertions(+), 9 deletions(-)
 create mode 100644 static/dropdowns.less

diff --git a/internal_packages/preferences/stylesheets/preferences.less b/internal_packages/preferences/stylesheets/preferences.less
index 0c8a612f9..a88a2eb75 100644
--- a/internal_packages/preferences/stylesheets/preferences.less
+++ b/internal_packages/preferences/stylesheets/preferences.less
@@ -152,9 +152,9 @@ body.platform-darwin {
   }
 
   .container-notifications {
-      width: 75%;
-      margin-left: 12.5%;
-      margin-right: 12.5%;
+      width: 80%;
+      margin-left: 10%;
+      margin-right: 10%;
   }
 
   .container-appearance {
diff --git a/internal_packages/ui-dark/styles/ui-variables.less b/internal_packages/ui-dark/styles/ui-variables.less
index 4ac3ea6e6..de239c8d1 100644
--- a/internal_packages/ui-dark/styles/ui-variables.less
+++ b/internal_packages/ui-dark/styles/ui-variables.less
@@ -10,11 +10,12 @@
 @background-secondary:   #2D2D2D;
 @background-tertiary:    #6d7987;
 
-@background-primary:     #313131;
-@background-color:       darken(#313131, 15%);
-@btn-default-bg-color:   #404040;
-@accent-primary:         lighten(#5AA8FA, 20%);
-@accent-primary-dark:    lighten(#3087E1, 20%);
+@background-primary:        #313131;
+@background-color:          darken(#313131, 15%);
+@btn-default-bg-color:      #404040;
+@dropdown-default-bg-color: #404040;
+@accent-primary:            lighten(#5AA8FA, 20%);
+@accent-primary-dark:       lighten(#3087E1, 20%);
 
 @text-color:                      #C2C2C2;
 @text-color-subtle:               fadeout(@text-color, 20%);
@@ -22,7 +23,7 @@
 @text-color-inverse:              white;
 @text-color-inverse-subtle:       fadeout(@text-color-inverse, 20%);
 @text-color-inverse-very-subtle:  fadeout(@text-color-inverse, 50%);
-@text-color-heading:              #FFF; 
+@text-color-heading:              #FFF;
 
 @border-primary-bg:     lighten(@background-primary, 10%);
 @border-secondary-bg:   lighten(@background-secondary, 10%);
diff --git a/static/dropdowns.less b/static/dropdowns.less
new file mode 100644
index 000000000..10cc10fba
--- /dev/null
+++ b/static/dropdowns.less
@@ -0,0 +1,8 @@
+@import "ui-variables";
+
+select {
+  // Set `border` property to allow styling for `select` controls
+  border: 1px solid @dropdown-default-border-color;
+  color: @dropdown-default-text-color;
+  background: @dropdown-default-bg-color;
+}
diff --git a/static/index.less b/static/index.less
index c4bb46bcb..48750e5e5 100644
--- a/static/index.less
+++ b/static/index.less
@@ -8,6 +8,7 @@
 @import "type";
 @import "inputs";
 @import "buttons";
+@import "dropdowns";
 @import "workspace";
 @import "resizable";
 @import "selection";
diff --git a/static/variables/ui-variables.less b/static/variables/ui-variables.less
index 8bcf72cda..25b8e12b8 100644
--- a/static/variables/ui-variables.less
+++ b/static/variables/ui-variables.less
@@ -191,6 +191,12 @@
 @btn-danger-bg-color:     @danger-color;
 @btn-danger-text-color:   @text-color-inverse;
 
+//=============================== Dropdowns ============================//
+
+@dropdown-default-bg-color:     @background-primary;
+@dropdown-default-text-color:   @text-color;
+@dropdown-default-border-color: fadeout(@border-color, 10%);
+
 //=============================== Inputs ===============================//
 
 //** `<input>` background color