From 94cd3515d56e7ef5c495ea5499b35e3030f970b4 Mon Sep 17 00:00:00 2001 From: Vitaly Zdanevich Date: Fri, 18 Jun 2021 13:54:11 +0300 Subject: [PATCH 1/7] Add first version of dark mode --- stylesheets/_shared.scss | 106 +++++++++++++++++++++++++++++++++++++++ 1 file changed, 106 insertions(+) diff --git a/stylesheets/_shared.scss b/stylesheets/_shared.scss index 553a4094d..c74e9cfb2 100644 --- a/stylesheets/_shared.scss +++ b/stylesheets/_shared.scss @@ -517,3 +517,109 @@ footer { margin-top: 6px; } } + +@media (prefers-color-scheme: dark) { + body { + background-color: #000; + color: #aaa; + } + + .home-link { + filter: invert(1) brightness(5); + } + + button.btn-default { + background-color: #555; + color: #fff; + border: none; + } + + .select2-selection { + background: #333 !important; + } + .select2-container--default .select2-selection--multiple { + border: none; + } + .select2-container--default .select2-selection--multiple .select2-selection__choice { + background: #55b !important; + color: #fff !important; + border: none; + } + + .top-nav { + border-bottom: none; + } + + .top-nav a { + color: #acf; + } + + .top-nav li.active a.interapp-link { + color: #fff; + font-weight: bold; + } + + hr, + .page-selector, + .summary-column, + .linear-legend--links { + border-color: #666; + } + + select.form-control, + input:not([type='radio']) { + background: #333 !important; + color: #fff; + border: none; + } + select.form-control { + appearance: none + } + + .table > tbody > tr > th, + .table > tbody > tr > td { + border-color: #444; + } + .table-hover > tbody > tr:hover { + background: #444; + } + + .topview-entry--rank-wrapper { + color: #000; + } + .topview-entry--label a { + font-weight: bold; + color: #eee; + text-shadow: 2px 2px 5px #000; + } + .topview-entry--edits, + .topview-entry--editors, + .topview-entry--views { + font-weight: bold; + } + + .select2-dropdown { + background: #333; + border: none; + } + .select2-container--default .select2-results__option[aria-selected='true'] { + background: #000; + } + + footer hr { + display: none; + } + + .modal-content { + background: #333; + } + .modal-header, + .modal-footer { + border-color: #444; + } + + :root { + scrollbar-color: #777 #000; + } + +} From 4610840b9af737f4c44a80a9151385a78b3a0246 Mon Sep 17 00:00:00 2001 From: Vitaly Zdanevich Date: Fri, 18 Jun 2021 14:00:06 +0300 Subject: [PATCH 2/7] Dark mode: fix legend colors to original --- stylesheets/_shared.scss | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/stylesheets/_shared.scss b/stylesheets/_shared.scss index c74e9cfb2..b825058c4 100644 --- a/stylesheets/_shared.scss +++ b/stylesheets/_shared.scss @@ -541,8 +541,7 @@ footer { border: none; } .select2-container--default .select2-selection--multiple .select2-selection__choice { - background: #55b !important; - color: #fff !important; + color: #000; border: none; } From 497349f179261eb487ab7e934c52ed72d630a583 Mon Sep 17 00:00:00 2001 From: Vitaly Zdanevich Date: Sat, 19 Jun 2021 05:04:43 +0300 Subject: [PATCH 3/7] improve dark style of numbers in table --- stylesheets/_shared.scss | 15 +++++++++++++-- 1 file changed, 13 insertions(+), 2 deletions(-) diff --git a/stylesheets/_shared.scss b/stylesheets/_shared.scss index b825058c4..aec430766 100644 --- a/stylesheets/_shared.scss +++ b/stylesheets/_shared.scss @@ -528,7 +528,8 @@ footer { filter: invert(1) brightness(5); } - button.btn-default { + .btn-default, + .input-group-addon { background-color: #555; color: #fff; border: none; @@ -586,16 +587,26 @@ footer { .topview-entry--rank-wrapper { color: #000; } - .topview-entry--label a { + .topview-entry--label a, + .topview-entry--editors { font-weight: bold; color: #eee; text-shadow: 2px 2px 5px #000; } + .topview-entry--edits a, + .topview-entry--views { + background: #000; + padding: 10px; + border-radius: 20px + } .topview-entry--edits, .topview-entry--editors, .topview-entry--views { font-weight: bold; } + .topview-entry a:hover { + color: lightblue; + } .select2-dropdown { background: #333; From f172be6465740f03f5605757d7c115eb77016848 Mon Sep 17 00:00:00 2001 From: Vitaly Zdanevich Date: Sat, 19 Jun 2021 05:08:21 +0300 Subject: [PATCH 4/7] dark mode: datepicker: fix color of inputs date --- stylesheets/_shared.scss | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/stylesheets/_shared.scss b/stylesheets/_shared.scss index aec430766..0301bdcb0 100644 --- a/stylesheets/_shared.scss +++ b/stylesheets/_shared.scss @@ -628,6 +628,10 @@ footer { border-color: #444; } + .daterangepicker .input-mini { + color: #fff; + } + :root { scrollbar-color: #777 #000; } From ca5b58b007a9ffe5e97a6e707de26e5c91414463 Mon Sep 17 00:00:00 2001 From: Vitaly Zdanevich Date: Sat, 19 Jun 2021 05:12:25 +0300 Subject: [PATCH 5/7] dark mode: fix line color in table --- stylesheets/_shared.scss | 1 + 1 file changed, 1 insertion(+) diff --git a/stylesheets/_shared.scss b/stylesheets/_shared.scss index 0301bdcb0..d033c4324 100644 --- a/stylesheets/_shared.scss +++ b/stylesheets/_shared.scss @@ -576,6 +576,7 @@ footer { appearance: none } + .table > thead > tr > th, .table > tbody > tr > th, .table > tbody > tr > td { border-color: #444; From 4b5cb27f7ddf3113f20bb20eb0f36af4bb32ae8d Mon Sep 17 00:00:00 2001 From: Vitaly Zdanevich Date: Sat, 19 Jun 2021 05:33:34 +0300 Subject: [PATCH 6/7] dark mode: FAQ page fix colors --- stylesheets/_shared.scss | 6 ++++-- 1 file changed, 4 insertions(+), 2 deletions(-) diff --git a/stylesheets/_shared.scss b/stylesheets/_shared.scss index d033c4324..9596794d1 100644 --- a/stylesheets/_shared.scss +++ b/stylesheets/_shared.scss @@ -519,7 +519,8 @@ footer { } @media (prefers-color-scheme: dark) { - body { + body, + .list-group-item { background-color: #000; color: #aaa; } @@ -578,7 +579,8 @@ footer { .table > thead > tr > th, .table > tbody > tr > th, - .table > tbody > tr > td { + .table > tbody > tr > td, + .list-group-item { border-color: #444; } .table-hover > tbody > tr:hover { From b4468b616c934952bcaa18113e925406928d1fcd Mon Sep 17 00:00:00 2001 From: Vitaly Zdanevich Date: Sat, 19 Jun 2021 05:43:54 +0300 Subject: [PATCH 7/7] dark mode: Topviews: month color fix --- stylesheets/_shared.scss | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/stylesheets/_shared.scss b/stylesheets/_shared.scss index 9596794d1..361d240f1 100644 --- a/stylesheets/_shared.scss +++ b/stylesheets/_shared.scss @@ -587,7 +587,8 @@ footer { background: #444; } - .topview-entry--rank-wrapper { + .topview-entry--rank-wrapper, + .month { color: #000; } .topview-entry--label a,