archive/healthchecks_healthchecks
0
0
Fork 0
mirror of https://github.com/healthchecks/healthchecks.git synced 2025-04-08 06:30:05 +00:00
Code Issues Projects Releases Wiki Activity

Fix dark mode bugs

Browse source
This commit is contained in:
Pēteris Caune 2021-06-21 15:57:50 +03:00
parent c75d17618c
commit 1c02d1ff87
No known key found for this signature in database
GPG key ID: E28D7679E9A9EDE2
11 changed files with 24 additions and 35 deletions

1
static/css/base.css
View file

@ -4,7 +4,6 @@ html {
}
body {
color: var(--text-color);
/* Margin bottom by footer height */
margin-bottom: 84px;
}

4
static/css/bootstrap-colors.css vendored
View file

@ -38,7 +38,3 @@
.panel-success {
border-color: var(--alert-success-border);
}
.help-block {
color: var(--text-muted);
}

4
static/css/bootstrap.css vendored
View file

@ -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 {

3
static/css/selectize.dark.css
View file

@ -1,3 +0,0 @@
.selectize-input input {
color: var(--input-color);
}

21
static/css/selectize.hc.css
View file

@ -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;

2
static/css/variables.css
View file

@ -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;

2
stuff/bootstrap/forms.less
View file

@ -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);
}

2
stuff/bootstrap/variables.less
View file

@ -28,7 +28,7 @@
//** Background color for `<body>`.
@body-bg: var(--body-bg);
//** Global text color on `<body>`.
@text-color: @gray-dark;
@text-color: var(--text-color);
//** Global textual link color.
@link-color: var(--link-color);

3
stuff/selectize/selectize.hc.less
View file

@ -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;

16
stuff/selectize/selectize.less
View file

@ -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;

1
templates/base.html
View file

@ -22,7 +22,6 @@
<link rel="stylesheet" href="{% static 'css/bootstrap.css' %}" type="text/css">
<link rel="stylesheet" href="{% static 'css/bootstrap-select.min.css' %}" type="text/css">
<link rel="stylesheet" href="{% static 'css/selectize.hc.css' %}" type="text/css">
<link rel="stylesheet" href="{% static 'css/selectize.dark.css' %}" type="text/css">
<link rel="stylesheet" href="{% static 'css/variables.css' %}" type="text/css">
<link rel="stylesheet" href="{% static 'css/bootstrap-colors.css' %}" type="text/css">