From e34deb5bff8093cea82556046713564431513b35 Mon Sep 17 00:00:00 2001 From: Michael Gnehr Date: Thu, 20 Jun 2019 15:56:45 +0200 Subject: [PATCH 1/6] set border colors globally on dark theme Signed-off-by: Michael Gnehr --- public/css/theme-arc-green.css | 6 ++++ public/less/themes/arc-green.less | 53 +++++++++++++++++++++++++++++++ 2 files changed, 59 insertions(+) diff --git a/public/css/theme-arc-green.css b/public/css/theme-arc-green.css index dd2b13542a4de..ebbc3bbe43559 100644 --- a/public/css/theme-arc-green.css +++ b/public/css/theme-arc-green.css @@ -12,6 +12,12 @@ .repository .ui.segment.sub-menu .list .item a{color:#dbdbdb} .ui.horizontal.segments>.segment{background-color:#383c4a} body{background:#383c4a;color:#9e9e9e} +*,body,html{scrollbar-width:thin;scrollbar-color:#2a2a2a #fff} +body ::-webkit-scrollbar,body::-webkit-scrollbar,html ::-webkit-scrollbar,html::-webkit-scrollbar{-webkit-appearance:none;width:10px;height:10px} +body ::-webkit-scrollbar-track,body::-webkit-scrollbar-track,html ::-webkit-scrollbar-track,html::-webkit-scrollbar-track{border-radius:0;background:rgba(255,255,255,.1)} +body ::-webkit-scrollbar-thumb,body::-webkit-scrollbar-thumb,html ::-webkit-scrollbar-thumb,html::-webkit-scrollbar-thumb{cursor:pointer;border-radius:5px;transition:color .2s ease;background:rgba(255,255,255,.25)} +body ::-webkit-scrollbar-thumb:window-inactive,body::-webkit-scrollbar-thumb:window-inactive,html ::-webkit-scrollbar-thumb:window-inactive,html::-webkit-scrollbar-thumb:window-inactive{background:rgba(255,255,255,.15)} +body ::-webkit-scrollbar-thumb:hover,body::-webkit-scrollbar-thumb:hover,html ::-webkit-scrollbar-thumb:hover,html::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.35)} a{color:#87ab63} a:hover{color:#a0cc75} .ui.card>.extra a:not(.ui):hover,.ui.cards>.card>.extra a:not(.ui):hover{color:#a0cc75} diff --git a/public/less/themes/arc-green.less b/public/less/themes/arc-green.less index 6d13bb2e5217e..73de2af095e81 100644 --- a/public/less/themes/arc-green.less +++ b/public/less/themes/arc-green.less @@ -85,6 +85,59 @@ body { color: #9e9e9e; } +/* firefox scroll bars */ + +html, +body, +* { + scrollbar-width: thin; + scrollbar-color: #2a2a2a #ffffff; +} + +/* webkit scrollbars */ + +html::-webkit-scrollbar, +body::-webkit-scrollbar, +html ::-webkit-scrollbar, +body ::-webkit-scrollbar { + -webkit-appearance: none; + width: 10px; + height: 10px; +} + +html::-webkit-scrollbar-track, +body::-webkit-scrollbar-track, +html ::-webkit-scrollbar-track, +body ::-webkit-scrollbar-track { + border-radius: 0; + background: rgba(255,255,255,0.1); +} + +html::-webkit-scrollbar-thumb, +body::-webkit-scrollbar-thumb, +html ::-webkit-scrollbar-thumb, +body ::-webkit-scrollbar-thumb { + cursor: pointer; + border-radius: 5px; + -webkit-transition: color 0.2s ease; + transition: color 0.2s ease; + background: rgba(255,255,255,0.25); +} + +html::-webkit-scrollbar-thumb:window-inactive, +body::-webkit-scrollbar-thumb:window-inactive, +html ::-webkit-scrollbar-thumb:window-inactive, +body ::-webkit-scrollbar-thumb:window-inactive { + background: rgba(255,255,255,0.15); +} + +html::-webkit-scrollbar-thumb:hover, +body::-webkit-scrollbar-thumb:hover, +html ::-webkit-scrollbar-thumb:hover, +body ::-webkit-scrollbar-thumb:hover { + background: rgba(255,255,255,0.35); +} + a { color: #87ab63; } From 4323760edc45b5478f50591e2b7c026a4e69010a Mon Sep 17 00:00:00 2001 From: Michael Gnehr Date: Thu, 20 Jun 2019 16:31:39 +0200 Subject: [PATCH 2/6] scrollbar color to green in dark mode Signed-off-by: Michael Gnehr --- public/css/theme-arc-green.css | 8 ++++---- public/less/themes/arc-green.less | 8 ++++---- 2 files changed, 8 insertions(+), 8 deletions(-) diff --git a/public/css/theme-arc-green.css b/public/css/theme-arc-green.css index ebbc3bbe43559..ce7c416da6b11 100644 --- a/public/css/theme-arc-green.css +++ b/public/css/theme-arc-green.css @@ -12,12 +12,12 @@ .repository .ui.segment.sub-menu .list .item a{color:#dbdbdb} .ui.horizontal.segments>.segment{background-color:#383c4a} body{background:#383c4a;color:#9e9e9e} -*,body,html{scrollbar-width:thin;scrollbar-color:#2a2a2a #fff} +*,body,html{scrollbar-width:thin;scrollbar-color:#87ab63 #fff} body ::-webkit-scrollbar,body::-webkit-scrollbar,html ::-webkit-scrollbar,html::-webkit-scrollbar{-webkit-appearance:none;width:10px;height:10px} body ::-webkit-scrollbar-track,body::-webkit-scrollbar-track,html ::-webkit-scrollbar-track,html::-webkit-scrollbar-track{border-radius:0;background:rgba(255,255,255,.1)} -body ::-webkit-scrollbar-thumb,body::-webkit-scrollbar-thumb,html ::-webkit-scrollbar-thumb,html::-webkit-scrollbar-thumb{cursor:pointer;border-radius:5px;transition:color .2s ease;background:rgba(255,255,255,.25)} -body ::-webkit-scrollbar-thumb:window-inactive,body::-webkit-scrollbar-thumb:window-inactive,html ::-webkit-scrollbar-thumb:window-inactive,html::-webkit-scrollbar-thumb:window-inactive{background:rgba(255,255,255,.15)} -body ::-webkit-scrollbar-thumb:hover,body::-webkit-scrollbar-thumb:hover,html ::-webkit-scrollbar-thumb:hover,html::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.35)} +body ::-webkit-scrollbar-thumb,body::-webkit-scrollbar-thumb,html ::-webkit-scrollbar-thumb,html::-webkit-scrollbar-thumb{cursor:pointer;border-radius:5px;transition:color .2s ease;background:#87ab63} +body ::-webkit-scrollbar-thumb:window-inactive,body::-webkit-scrollbar-thumb:window-inactive,html ::-webkit-scrollbar-thumb:window-inactive,html::-webkit-scrollbar-thumb:window-inactive{background:#87ab63} +body ::-webkit-scrollbar-thumb:hover,body::-webkit-scrollbar-thumb:hover,html ::-webkit-scrollbar-thumb:hover,html::-webkit-scrollbar-thumb:hover{background:#87ab63} a{color:#87ab63} a:hover{color:#a0cc75} .ui.card>.extra a:not(.ui):hover,.ui.cards>.card>.extra a:not(.ui):hover{color:#a0cc75} diff --git a/public/less/themes/arc-green.less b/public/less/themes/arc-green.less index 73de2af095e81..1340de4703742 100644 --- a/public/less/themes/arc-green.less +++ b/public/less/themes/arc-green.less @@ -91,7 +91,7 @@ html, body, * { scrollbar-width: thin; - scrollbar-color: #2a2a2a #ffffff; + scrollbar-color: #87ab63 #ffffff; } /* webkit scrollbars */ @@ -121,21 +121,21 @@ body ::-webkit-scrollbar-thumb { border-radius: 5px; -webkit-transition: color 0.2s ease; transition: color 0.2s ease; - background: rgba(255,255,255,0.25); + background: #87ab63; } html::-webkit-scrollbar-thumb:window-inactive, body::-webkit-scrollbar-thumb:window-inactive, html ::-webkit-scrollbar-thumb:window-inactive, body ::-webkit-scrollbar-thumb:window-inactive { - background: rgba(255,255,255,0.15); + background: #87ab63; } html::-webkit-scrollbar-thumb:hover, body::-webkit-scrollbar-thumb:hover, html ::-webkit-scrollbar-thumb:hover, body ::-webkit-scrollbar-thumb:hover { - background: rgba(255,255,255,0.35); + background: #87ab63; } a { From 80eaef9aae3709bc2344769e2588faeee9c01e3c Mon Sep 17 00:00:00 2001 From: Cherrg Date: Sat, 22 Jun 2019 02:59:39 +0200 Subject: [PATCH 3/6] Update public/less/themes/arc-green.less Co-Authored-By: Antoine GIRARD Signed-off-by: Michael Gnehr --- public/css/theme-arc-green.css | 2 +- public/less/themes/arc-green.less | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/public/css/theme-arc-green.css b/public/css/theme-arc-green.css index 0949fa10b5398..b3b314c0d3e39 100644 --- a/public/css/theme-arc-green.css +++ b/public/css/theme-arc-green.css @@ -12,7 +12,7 @@ .repository .ui.segment.sub-menu .list .item a{color:#dbdbdb} .ui.horizontal.segments>.segment{background-color:#383c4a} body{background:#383c4a;color:#9e9e9e} -*,body,html{scrollbar-width:thin;scrollbar-color:#87ab63 #fff} +*,body,html{scrollbar-width:thin;scrollbar-color:#87ab63 rgba(255,255,255,.1)} body ::-webkit-scrollbar,body::-webkit-scrollbar,html ::-webkit-scrollbar,html::-webkit-scrollbar{-webkit-appearance:none;width:10px;height:10px} body ::-webkit-scrollbar-track,body::-webkit-scrollbar-track,html ::-webkit-scrollbar-track,html::-webkit-scrollbar-track{border-radius:0;background:rgba(255,255,255,.1)} body ::-webkit-scrollbar-thumb,body::-webkit-scrollbar-thumb,html ::-webkit-scrollbar-thumb,html::-webkit-scrollbar-thumb{cursor:pointer;border-radius:5px;transition:color .2s ease;background:#87ab63} diff --git a/public/less/themes/arc-green.less b/public/less/themes/arc-green.less index 57607d055de11..049833f090f85 100644 --- a/public/less/themes/arc-green.less +++ b/public/less/themes/arc-green.less @@ -91,7 +91,7 @@ html, body, * { scrollbar-width: thin; - scrollbar-color: #87ab63 #ffffff; + scrollbar-color: #87ab63 rgba(255,255,255,0.1); } /* webkit scrollbars */ From 870442344d0cc8857463d40ae33d0dc3ca8d337b Mon Sep 17 00:00:00 2001 From: Michael Gnehr Date: Wed, 26 Jun 2019 03:22:17 +0200 Subject: [PATCH 4/6] cleanup css, remove duplicates Signed-off-by: Michael Gnehr --- public/css/theme-arc-green.css | 12 ++++++------ public/less/themes/arc-green.less | 32 ++++++++++--------------------- 2 files changed, 16 insertions(+), 28 deletions(-) diff --git a/public/css/theme-arc-green.css b/public/css/theme-arc-green.css index b3b314c0d3e39..957ee6a6fa7bc 100644 --- a/public/css/theme-arc-green.css +++ b/public/css/theme-arc-green.css @@ -12,12 +12,12 @@ .repository .ui.segment.sub-menu .list .item a{color:#dbdbdb} .ui.horizontal.segments>.segment{background-color:#383c4a} body{background:#383c4a;color:#9e9e9e} -*,body,html{scrollbar-width:thin;scrollbar-color:#87ab63 rgba(255,255,255,.1)} -body ::-webkit-scrollbar,body::-webkit-scrollbar,html ::-webkit-scrollbar,html::-webkit-scrollbar{-webkit-appearance:none;width:10px;height:10px} -body ::-webkit-scrollbar-track,body::-webkit-scrollbar-track,html ::-webkit-scrollbar-track,html::-webkit-scrollbar-track{border-radius:0;background:rgba(255,255,255,.1)} -body ::-webkit-scrollbar-thumb,body::-webkit-scrollbar-thumb,html ::-webkit-scrollbar-thumb,html::-webkit-scrollbar-thumb{cursor:pointer;border-radius:5px;transition:color .2s ease;background:#87ab63} -body ::-webkit-scrollbar-thumb:window-inactive,body::-webkit-scrollbar-thumb:window-inactive,html ::-webkit-scrollbar-thumb:window-inactive,html::-webkit-scrollbar-thumb:window-inactive{background:#87ab63} -body ::-webkit-scrollbar-thumb:hover,body::-webkit-scrollbar-thumb:hover,html ::-webkit-scrollbar-thumb:hover,html::-webkit-scrollbar-thumb:hover{background:#87ab63} +*{scrollbar-width:thin;scrollbar-color:#87ab63 rgba(255,255,255,.1)} +::-webkit-scrollbar,body ::-webkit-scrollbar{-webkit-appearance:none;width:10px;height:10px} +::-webkit-scrollbar-track,body ::-webkit-scrollbar-track{border-radius:0;background:rgba(255,255,255,.1)} +::-webkit-scrollbar-thumb,body ::-webkit-scrollbar-thumb{cursor:pointer;border-radius:5px;transition:color .2s ease;background:#87ab63} +::-webkit-scrollbar-thumb:window-inactive,body ::-webkit-scrollbar-thumb:window-inactive{background:#87ab63} +::-webkit-scrollbar-thumb:hover,body ::-webkit-scrollbar-thumb:hover{background:#87ab63} a{color:#87ab63} a:hover{color:#a0cc75} .ui.card>.extra a:not(.ui):hover,.ui.cards>.card>.extra a:not(.ui):hover{color:#a0cc75} diff --git a/public/less/themes/arc-green.less b/public/less/themes/arc-green.less index 049833f090f85..c32506f205b65 100644 --- a/public/less/themes/arc-green.less +++ b/public/less/themes/arc-green.less @@ -87,8 +87,6 @@ body { /* firefox scroll bars */ -html, -body, * { scrollbar-width: thin; scrollbar-color: #87ab63 rgba(255,255,255,0.1); @@ -96,27 +94,21 @@ body, /* webkit scrollbars */ -html::-webkit-scrollbar, -body::-webkit-scrollbar, -html ::-webkit-scrollbar, -body ::-webkit-scrollbar { +body ::-webkit-scrollbar, +::-webkit-scrollbar { -webkit-appearance: none; width: 10px; height: 10px; } -html::-webkit-scrollbar-track, -body::-webkit-scrollbar-track, -html ::-webkit-scrollbar-track, -body ::-webkit-scrollbar-track { +body ::-webkit-scrollbar-track, +::-webkit-scrollbar-track { border-radius: 0; background: rgba(255,255,255,0.1); } -html::-webkit-scrollbar-thumb, -body::-webkit-scrollbar-thumb, -html ::-webkit-scrollbar-thumb, -body ::-webkit-scrollbar-thumb { +body ::-webkit-scrollbar-thumb, +::-webkit-scrollbar-thumb { cursor: pointer; border-radius: 5px; -webkit-transition: color 0.2s ease; @@ -124,17 +116,13 @@ body ::-webkit-scrollbar-thumb { background: #87ab63; } -html::-webkit-scrollbar-thumb:window-inactive, -body::-webkit-scrollbar-thumb:window-inactive, -html ::-webkit-scrollbar-thumb:window-inactive, -body ::-webkit-scrollbar-thumb:window-inactive { +body ::-webkit-scrollbar-thumb:window-inactive, +::-webkit-scrollbar-thumb:window-inactive { background: #87ab63; } -html::-webkit-scrollbar-thumb:hover, -body::-webkit-scrollbar-thumb:hover, -html ::-webkit-scrollbar-thumb:hover, -body ::-webkit-scrollbar-thumb:hover { +body ::-webkit-scrollbar-thumb:hover, +::-webkit-scrollbar-thumb:hover { background: #87ab63; } From 0bf0f41246d70fa2127c27b504d487c04833d9fb Mon Sep 17 00:00:00 2001 From: Michael Gnehr Date: Wed, 26 Jun 2019 18:04:42 +0200 Subject: [PATCH 5/6] change to use important flag in css Signed-off-by: Michael Gnehr --- public/css/theme-arc-green.css | 10 +++++----- public/less/themes/arc-green.less | 29 ++++++++++++----------------- 2 files changed, 17 insertions(+), 22 deletions(-) diff --git a/public/css/theme-arc-green.css b/public/css/theme-arc-green.css index 957ee6a6fa7bc..251db5d73457f 100644 --- a/public/css/theme-arc-green.css +++ b/public/css/theme-arc-green.css @@ -13,11 +13,11 @@ .ui.horizontal.segments>.segment{background-color:#383c4a} body{background:#383c4a;color:#9e9e9e} *{scrollbar-width:thin;scrollbar-color:#87ab63 rgba(255,255,255,.1)} -::-webkit-scrollbar,body ::-webkit-scrollbar{-webkit-appearance:none;width:10px;height:10px} -::-webkit-scrollbar-track,body ::-webkit-scrollbar-track{border-radius:0;background:rgba(255,255,255,.1)} -::-webkit-scrollbar-thumb,body ::-webkit-scrollbar-thumb{cursor:pointer;border-radius:5px;transition:color .2s ease;background:#87ab63} -::-webkit-scrollbar-thumb:window-inactive,body ::-webkit-scrollbar-thumb:window-inactive{background:#87ab63} -::-webkit-scrollbar-thumb:hover,body ::-webkit-scrollbar-thumb:hover{background:#87ab63} +::-webkit-scrollbar{-webkit-appearance:none!important;width:10px!important;height:10px!important} +::-webkit-scrollbar-track{border-radius:0!important;background:rgba(255,255,255,.1)!important} +::-webkit-scrollbar-thumb{cursor:pointer!important;border-radius:5px!important;transition:color .2s ease!important;background:#87ab63!important} +::-webkit-scrollbar-thumb:window-inactive{background:#87ab63!important} +::-webkit-scrollbar-thumb:hover{background:#87ab63!important} a{color:#87ab63} a:hover{color:#a0cc75} .ui.card>.extra a:not(.ui):hover,.ui.cards>.card>.extra a:not(.ui):hover{color:#a0cc75} diff --git a/public/less/themes/arc-green.less b/public/less/themes/arc-green.less index c32506f205b65..c7390ffa0eb01 100644 --- a/public/less/themes/arc-green.less +++ b/public/less/themes/arc-green.less @@ -94,36 +94,31 @@ body { /* webkit scrollbars */ -body ::-webkit-scrollbar, ::-webkit-scrollbar { - -webkit-appearance: none; - width: 10px; - height: 10px; + -webkit-appearance: none !important; + width: 10px !important; + height: 10px !important; } -body ::-webkit-scrollbar-track, ::-webkit-scrollbar-track { - border-radius: 0; - background: rgba(255,255,255,0.1); + border-radius: 0 !important; + background: rgba(255,255,255,0.1) !important; } -body ::-webkit-scrollbar-thumb, ::-webkit-scrollbar-thumb { - cursor: pointer; - border-radius: 5px; - -webkit-transition: color 0.2s ease; - transition: color 0.2s ease; - background: #87ab63; + cursor: pointer !important; + border-radius: 5px !important; + -webkit-transition: color 0.2s ease !important; + transition: color 0.2s ease !important; + background: #87ab63 !important; } -body ::-webkit-scrollbar-thumb:window-inactive, ::-webkit-scrollbar-thumb:window-inactive { - background: #87ab63; + background: #87ab63 !important; } -body ::-webkit-scrollbar-thumb:hover, ::-webkit-scrollbar-thumb:hover { - background: #87ab63; + background: #87ab63 !important; } a { From 06164f7172d6efe83f796ab615eaa7c46fa7bfc9 Mon Sep 17 00:00:00 2001 From: Michael Gnehr Date: Thu, 27 Jun 2019 23:33:35 +0200 Subject: [PATCH 6/6] fix make css lint errors Signed-off-by: Michael Gnehr --- public/less/themes/arc-green.less | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/public/less/themes/arc-green.less b/public/less/themes/arc-green.less index 004676d167398..58743e068b924 100644 --- a/public/less/themes/arc-green.less +++ b/public/less/themes/arc-green.less @@ -89,7 +89,7 @@ body { * { scrollbar-width: thin; - scrollbar-color: #87ab63 rgba(255,255,255,0.1); + scrollbar-color: #87ab63 rgba(255, 255, 255, 0.1); } /* webkit scrollbars */ @@ -102,7 +102,7 @@ body { ::-webkit-scrollbar-track { border-radius: 0 !important; - background: rgba(255,255,255,0.1) !important; + background: rgba(255, 255, 255, 0.1) !important; } ::-webkit-scrollbar-thumb {