diff --git a/static/css/base.css b/static/css/base.css
index 2f521e5a..ced7f5a8 100644
--- a/static/css/base.css
+++ b/static/css/base.css
@@ -4,7 +4,6 @@ html {
}
body {
- color: var(--text-color);
/* Margin bottom by footer height */
margin-bottom: 84px;
}
diff --git a/static/css/bootstrap-colors.css b/static/css/bootstrap-colors.css
index 76022105..833f2b58 100644
--- a/static/css/bootstrap-colors.css
+++ b/static/css/bootstrap-colors.css
@@ -38,7 +38,3 @@
.panel-success {
border-color: var(--alert-success-border);
}
-
-.help-block {
- color: var(--text-muted);
-}
diff --git a/static/css/bootstrap.css b/static/css/bootstrap.css
index ed1ff071..f14a2576 100644
--- a/static/css/bootstrap.css
+++ b/static/css/bootstrap.css
@@ -271,7 +271,7 @@ body {
font-family: -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif;
font-size: 14px;
line-height: 1.42857143;
- color: #333333;
+ color: var(--text-color);
background-color: var(--body-bg);
}
input,
@@ -2180,7 +2180,7 @@ select[multiple].input-lg {
display: block;
margin-top: 5px;
margin-bottom: 10px;
- color: #737373;
+ color: var(--text-muted);
}
@media (min-width: 768px) {
.form-inline .form-group {
diff --git a/static/css/selectize.dark.css b/static/css/selectize.dark.css
deleted file mode 100644
index 94306d02..00000000
--- a/static/css/selectize.dark.css
+++ /dev/null
@@ -1,3 +0,0 @@
-.selectize-input input {
- color: var(--input-color);
-}
diff --git a/static/css/selectize.hc.css b/static/css/selectize.hc.css
index 7ab5ccce..0f532fe5 100644
--- a/static/css/selectize.hc.css
+++ b/static/css/selectize.hc.css
@@ -19,7 +19,7 @@
.selectize-dropdown,
.selectize-input,
.selectize-input input {
- color: #333333;
+ color: var(--text-color);
font-family: inherit;
font-size: inherit;
line-height: 20px;
@@ -77,8 +77,8 @@
cursor: pointer;
margin: 0 3px 3px 0;
padding: 2px 6px;
- background: #efefef;
- color: #333333;
+ background: var(--selectize-tag-bg);
+ color: var(--text-color);
border: 0 solid rgba(0, 0, 0, 0);
}
.selectize-control.multi .selectize-input > div.active {
@@ -86,12 +86,6 @@
color: #fff;
border: 0 solid rgba(0, 0, 0, 0);
}
-.selectize-control.multi .selectize-input.disabled > div,
-.selectize-control.multi .selectize-input.disabled > div.active {
- color: #808080;
- background: #ffffff;
- border: 0 solid rgba(77, 77, 77, 0);
-}
.selectize-input > input {
display: inline-block !important;
padding: 0 !important;
@@ -155,7 +149,8 @@
border-radius: 1px;
}
.selectize-dropdown .option,
-.selectize-dropdown .optgroup-header {
+.selectize-dropdown .optgroup-header,
+.selectize-dropdown .create {
padding: 3px 12px;
}
.selectize-dropdown .option,
@@ -183,7 +178,7 @@
color: var(--text-color);
}
.selectize-dropdown .create {
- color: rgba(51, 51, 51, 0.5);
+ color: var(--text-color);
}
.selectize-dropdown-content {
overflow-y: auto;
@@ -210,12 +205,12 @@
height: 0;
border-style: solid;
border-width: 5px 5px 0 5px;
- border-color: #333333 transparent transparent transparent;
+ border-color: var(--text-color) transparent transparent transparent;
}
.selectize-control.single .selectize-input.dropdown-active:after {
margin-top: -4px;
border-width: 0 5px 5px 5px;
- border-color: transparent transparent #333333 transparent;
+ border-color: transparent transparent var(--text-color) transparent;
}
.selectize-control.rtl.single .selectize-input:after {
left: 17px;
diff --git a/static/css/variables.css b/static/css/variables.css
index 08f68061..438c86ce 100644
--- a/static/css/variables.css
+++ b/static/css/variables.css
@@ -50,6 +50,7 @@
--plan-supporter-border: #FFE082;
--plan-supporter-color: #1d190f;
--pre-bg: #f5f5f5;
+ --selectize-tag-bg: #efefef;
--small-text-color: #111;
--state-info-bg: #d9edf7;
--state-info-border: #bce8f1;
@@ -122,6 +123,7 @@ body.dark {
--plan-supporter-border: #FFE082;
--plan-supporter-color: #fff0c4;
--pre-bg: #29292c;
+ --selectize-tag-bg: #6f6f7f;
--small-text-color: #f0f0f2;
--state-info-bg: #123051;
--state-info-border: #163c64;
diff --git a/stuff/bootstrap/forms.less b/stuff/bootstrap/forms.less
index 906e63af..c2862d5a 100644
--- a/stuff/bootstrap/forms.less
+++ b/stuff/bootstrap/forms.less
@@ -455,7 +455,7 @@ input[type="checkbox"] {
display: block; // account for any element using help-block
margin-top: 5px;
margin-bottom: 10px;
- color: lighten(@text-color, 25%); // lighten the text some for contrast
+ color: var(--text-muted);
}
diff --git a/stuff/bootstrap/variables.less b/stuff/bootstrap/variables.less
index 4dad1335..34f38fce 100755
--- a/stuff/bootstrap/variables.less
+++ b/stuff/bootstrap/variables.less
@@ -28,7 +28,7 @@
//** Background color for ``.
@body-bg: var(--body-bg);
//** Global text color on ``.
-@text-color: @gray-dark;
+@text-color: var(--text-color);
//** Global textual link color.
@link-color: var(--link-color);
diff --git a/stuff/selectize/selectize.hc.less b/stuff/selectize/selectize.hc.less
index c550caf0..5039dc02 100644
--- a/stuff/selectize/selectize.hc.less
+++ b/stuff/selectize/selectize.hc.less
@@ -29,7 +29,8 @@
@selectize-color-input-error: @state-danger-text;
@selectize-color-input-error-focus: darken(@selectize-color-input-error, 10%);
@selectize-color-disabled: @input-bg;
-@selectize-color-item: #efefef;
+@selectize-color-dropdown-item-create-text: @text-color;
+@selectize-color-item: var(--selectize-tag-bg);
@selectize-color-item-border: rgba(0,0,0,0);
@selectize-color-item-active: @component-active-bg;
@selectize-color-item-active-text: #fff;
diff --git a/stuff/selectize/selectize.less b/stuff/selectize/selectize.less
index ad1b10a2..b9b32e0c 100644
--- a/stuff/selectize/selectize.less
+++ b/stuff/selectize/selectize.less
@@ -22,7 +22,7 @@
@selectize-color-dropdown-border-top: #f0f0f0;
@selectize-color-dropdown-item-active: #f5fafd;
@selectize-color-dropdown-item-active-text: #495c68;
-@selectize-color-dropdown-item-create-text: rgba(red(@selectize-color-text), green(@selectize-color-text), blue(@selectize-color-text), 0.5);
+@selectize-color-dropdown-item-create-text: @selectize-color-text;
@selectize-color-dropdown-item-create-active-text: @selectize-color-dropdown-item-active-text;
@selectize-color-optgroup: @selectize-color-dropdown;
@selectize-color-optgroup-text: @selectize-color-text;
@@ -157,13 +157,13 @@
border: @selectize-width-item-border solid @selectize-color-item-active-border;
}
}
- .selectize-control.multi &.disabled > div {
- &, &.active {
- color: lighten(desaturate(@selectize-color-item-text, 100%), @selectize-lighten-disabled-item-text);
- background: lighten(desaturate(@selectize-color-item, 100%), @selectize-lighten-disabled-item);
- border: @selectize-width-item-border solid lighten(desaturate(@selectize-color-item-border, 100%), @selectize-lighten-disabled-item-border);
- }
- }
+ // .selectize-control.multi &.disabled > div {
+ // &, &.active {
+ // color: lighten(desaturate(@selectize-color-item-text, 100%), @selectize-lighten-disabled-item-text);
+ // background: lighten(desaturate(@selectize-color-item, 100%), @selectize-lighten-disabled-item);
+ // border: @selectize-width-item-border solid lighten(desaturate(@selectize-color-item-border, 100%), @selectize-lighten-disabled-item-border);
+ // }
+ // }
> input {
&::-ms-clear {
display: none;
diff --git a/templates/base.html b/templates/base.html
index d667cd3b..e9afb8b3 100644
--- a/templates/base.html
+++ b/templates/base.html
@@ -22,7 +22,6 @@
-