From dafc634a4634ba688e021dd1a6f1607f52626fff Mon Sep 17 00:00:00 2001 From: silverwind Date: Thu, 22 Oct 2020 05:51:12 +0200 Subject: [PATCH] More arc-green fixes (#13247) - Fix various white borders - Tweak basic button style to have more contrast - Add more contrast to hover styles - Invert Matrix webhook icon May backport to 1.13. Co-authored-by: zeripath --- web_src/less/themes/theme-arc-green.less | 95 ++++++++++++++---------- 1 file changed, 57 insertions(+), 38 deletions(-) diff --git a/web_src/less/themes/theme-arc-green.less b/web_src/less/themes/theme-arc-green.less index 1e2a42611..c2e440997 100644 --- a/web_src/less/themes/theme-arc-green.less +++ b/web_src/less/themes/theme-arc-green.less @@ -384,6 +384,10 @@ } } +.repository .ui.segment.sub-menu .list .item a:hover { + color: #fff; +} + .ui.horizontal.segments > .segment { background-color: #383c4a; } @@ -535,15 +539,26 @@ a:hover { .ui.secondary.menu .link.item:hover, .ui.secondary.menu .active.item:hover, .ui.secondary.menu a.item:hover, -.ui.dropdown .menu .active.item { - color: #ffffff; +.ui.dropdown .menu .active.item, +.ui.link.menu .item:hover, +.ui.menu .dropdown.item:hover, +.ui.menu .link.item:hover, +.ui.menu a.item:hover, +.ui.menu .active.item { + color: #dbdbdb; + background: #454b5a; } .ui.menu .ui.dropdown .menu > .item { - background: #2c303a !important; color: #9e9e9e !important; } +.ui.menu .ui.dropdown .menu > .item:hover, +.ui.menu .ui.dropdown .menu > .selected.item { + color: #dbdbdb !important; + background: #454b5a !important; +} + .ui.secondary.menu .dropdown.item > .menu, .ui.text.menu .dropdown.item > .menu { border: 1px solid #434444; @@ -559,12 +574,8 @@ footer { background: #2c303a; } -.ui.menu .ui.dropdown .menu > .item:hover, -.ui.menu .ui.dropdown .menu > .selected.item { - color: #ffffff !important; -} - -.ui.dropdown .menu > .header { +.ui.dropdown .menu > .header, +.ui.dropdown .menu > .header:not(.ui) { color: #dbdbdb; } @@ -585,19 +596,6 @@ footer { background: #4b5162; } -.ui.link.menu .item:hover, -.ui.menu .dropdown.item:hover, -.ui.menu .link.item:hover, -.ui.menu a.item:hover { - color: #dbdbdb; - background: #454b5a; -} - -.ui.menu .active.item { - background: #4b5162; - color: #dbdbdb; -} - .ui.input input { background: #404552; border: 1px solid #4b505f; @@ -652,26 +650,12 @@ a.ui.basic.green.label:hover { color: #129c92; } -.ui.basic.button, -.ui.basic.buttons .button { - color: #797979; -} - .ui.basic.red.active.button, .ui.basic.red.buttons .active.button { box-shadow: 0 0 0 1px #c75252 inset !important; color: #c75252 !important; } -.ui.basic.button:focus, -.ui.basic.button:hover, -.ui.basic.buttons .button:focus, -.ui.basic.buttons .button:hover { - color: #dbdbdb; - box-shadow: 0 0 0 1px rgba(200, 200, 200, .35) inset; - background: rgba(0, 0, 0, .5); -} - .ui.menu .item { background: #404552; color: #9e9e9e; @@ -862,6 +846,22 @@ a.ui.basic.green.label:hover { color: #dbdbdb; } +.ui.basic.button, +.ui.basic.buttons .button { + color: #9e9e9e; + background: rgba(0, 0, 0, .08); + box-shadow: none; +} + +.ui.basic.button:focus, +.ui.basic.button:hover, +.ui.basic.buttons .button:focus, +.ui.basic.buttons .button:hover { + color: #dbdbdb; + background: rgba(255, 255, 255, .08); + box-shadow: none; +} + .ui.labeled.button:not([class*="left labeled"]) > .label, .ui[class*="left labeled"].button > .button { background: #404552; @@ -1041,6 +1041,7 @@ a.ui.basic.green.label:hover { .ui.dropdown .menu > .item:hover { color: #dbdbdb; + background: #353945; } .ui.dropdown .menu > .item { @@ -1126,6 +1127,15 @@ a.ui.basic.green.label:hover { background: radial-gradient(#383c4a 40%, transparent 40%) no-repeat; } +.repository.file.editor .commit-form-wrapper .commit-form { + border-color: #505667; +} + +.repository.file.editor .commit-form-wrapper .commit-form::before, +.repository.file.editor .commit-form-wrapper .commit-form::after { + border-right-color: #505667; +} + .repository .comment.form .content .form:after { border-right-color: #313c47; } @@ -1232,7 +1242,7 @@ td.blob-hunk { .ui.card, .ui.cards > .card { background: #353945; - box-shadow: 0 1px 3px 0 #4c505c, 0 0 0 1px #4c505c; + box-shadow: 0 0 0 1px #4c505c; } .ui.card > .content > .header, @@ -1703,6 +1713,7 @@ a.ui.labels .label:hover { border-color: #634343 !important; } +.organization.settings .labelspage .item, .organization.teams .repositories .item:not(:last-child), .organization.teams .members .item:not(:last-child), .organization.teams .detail .item:not(:last-child), @@ -1710,6 +1721,10 @@ a.ui.labels .label:hover { border-bottom-color: #404552; } +.organization.settings .labelspage .item a:hover { + color: #fff; +} + .ui.blue.button:active, .ui.blue.buttons .button:active { background-color: #a27558; @@ -1766,7 +1781,7 @@ a.ui.labels .label:hover { } .editor-toolbar i.separator { - border-right-color: #7f98ad; + border-right-color: #87ab63; } .repository .diff-detail-box { @@ -2054,6 +2069,10 @@ footer .container .links > * { color: #2a2e3a; } +img[src$="/img/matrix.svg"] { + filter: invert(80%); +} + #git-graph-container.monochrome #rel-container .flow-group { stroke: dimgrey; fill: dimgrey;