From ad4dde1d49d554fa2fc4d842a85ba860e1520da8 Mon Sep 17 00:00:00 2001 From: silverwind Date: Fri, 23 Oct 2020 00:55:44 +0200 Subject: [PATCH] More arc-green fixes (#13247) (#13253) - 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 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 2bd9bf6a4..e76f2a1bd 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; @@ -651,26 +649,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; @@ -861,6 +845,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; @@ -1040,6 +1040,7 @@ a.ui.basic.green.label:hover { .ui.dropdown .menu > .item:hover { color: #dbdbdb; + background: #353945; } .ui.dropdown .menu > .item { @@ -1130,6 +1131,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; } @@ -1236,7 +1246,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, @@ -1707,6 +1717,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), @@ -1714,6 +1725,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; @@ -1770,7 +1785,7 @@ a.ui.labels .label:hover { } .editor-toolbar i.separator { - border-right-color: #7f98ad; + border-right-color: #87ab63; } .repository .diff-detail-box { @@ -2058,6 +2073,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;