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 <art27@cantab.net>
tokarchuk/v1.17
silverwind 4 years ago committed by GitHub
parent ff50274ff3
commit dafc634a46
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 95
      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 { .ui.horizontal.segments > .segment {
background-color: #383c4a; background-color: #383c4a;
} }
@ -535,15 +539,26 @@ a:hover {
.ui.secondary.menu .link.item:hover, .ui.secondary.menu .link.item:hover,
.ui.secondary.menu .active.item:hover, .ui.secondary.menu .active.item:hover,
.ui.secondary.menu a.item:hover, .ui.secondary.menu a.item:hover,
.ui.dropdown .menu .active.item { .ui.dropdown .menu .active.item,
color: #ffffff; .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 { .ui.menu .ui.dropdown .menu > .item {
background: #2c303a !important;
color: #9e9e9e !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.secondary.menu .dropdown.item > .menu,
.ui.text.menu .dropdown.item > .menu { .ui.text.menu .dropdown.item > .menu {
border: 1px solid #434444; border: 1px solid #434444;
@ -559,12 +574,8 @@ footer {
background: #2c303a; background: #2c303a;
} }
.ui.menu .ui.dropdown .menu > .item:hover, .ui.dropdown .menu > .header,
.ui.menu .ui.dropdown .menu > .selected.item { .ui.dropdown .menu > .header:not(.ui) {
color: #ffffff !important;
}
.ui.dropdown .menu > .header {
color: #dbdbdb; color: #dbdbdb;
} }
@ -585,19 +596,6 @@ footer {
background: #4b5162; 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 { .ui.input input {
background: #404552; background: #404552;
border: 1px solid #4b505f; border: 1px solid #4b505f;
@ -652,26 +650,12 @@ a.ui.basic.green.label:hover {
color: #129c92; color: #129c92;
} }
.ui.basic.button,
.ui.basic.buttons .button {
color: #797979;
}
.ui.basic.red.active.button, .ui.basic.red.active.button,
.ui.basic.red.buttons .active.button { .ui.basic.red.buttons .active.button {
box-shadow: 0 0 0 1px #c75252 inset !important; box-shadow: 0 0 0 1px #c75252 inset !important;
color: #c75252 !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 { .ui.menu .item {
background: #404552; background: #404552;
color: #9e9e9e; color: #9e9e9e;
@ -862,6 +846,22 @@ a.ui.basic.green.label:hover {
color: #dbdbdb; 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.labeled.button:not([class*="left labeled"]) > .label,
.ui[class*="left labeled"].button > .button { .ui[class*="left labeled"].button > .button {
background: #404552; background: #404552;
@ -1041,6 +1041,7 @@ a.ui.basic.green.label:hover {
.ui.dropdown .menu > .item:hover { .ui.dropdown .menu > .item:hover {
color: #dbdbdb; color: #dbdbdb;
background: #353945;
} }
.ui.dropdown .menu > .item { .ui.dropdown .menu > .item {
@ -1126,6 +1127,15 @@ a.ui.basic.green.label:hover {
background: radial-gradient(#383c4a 40%, transparent 40%) no-repeat; 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 { .repository .comment.form .content .form:after {
border-right-color: #313c47; border-right-color: #313c47;
} }
@ -1232,7 +1242,7 @@ td.blob-hunk {
.ui.card, .ui.card,
.ui.cards > .card { .ui.cards > .card {
background: #353945; 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, .ui.card > .content > .header,
@ -1703,6 +1713,7 @@ a.ui.labels .label:hover {
border-color: #634343 !important; border-color: #634343 !important;
} }
.organization.settings .labelspage .item,
.organization.teams .repositories .item:not(:last-child), .organization.teams .repositories .item:not(:last-child),
.organization.teams .members .item:not(:last-child), .organization.teams .members .item:not(:last-child),
.organization.teams .detail .item:not(:last-child), .organization.teams .detail .item:not(:last-child),
@ -1710,6 +1721,10 @@ a.ui.labels .label:hover {
border-bottom-color: #404552; border-bottom-color: #404552;
} }
.organization.settings .labelspage .item a:hover {
color: #fff;
}
.ui.blue.button:active, .ui.blue.button:active,
.ui.blue.buttons .button:active { .ui.blue.buttons .button:active {
background-color: #a27558; background-color: #a27558;
@ -1766,7 +1781,7 @@ a.ui.labels .label:hover {
} }
.editor-toolbar i.separator { .editor-toolbar i.separator {
border-right-color: #7f98ad; border-right-color: #87ab63;
} }
.repository .diff-detail-box { .repository .diff-detail-box {
@ -2054,6 +2069,10 @@ footer .container .links > * {
color: #2a2e3a; color: #2a2e3a;
} }
img[src$="/img/matrix.svg"] {
filter: invert(80%);
}
#git-graph-container.monochrome #rel-container .flow-group { #git-graph-container.monochrome #rel-container .flow-group {
stroke: dimgrey; stroke: dimgrey;
fill: dimgrey; fill: dimgrey;

Loading…
Cancel
Save