From 677a09eb745f405204a2cd8c87649b29e5478617 Mon Sep 17 00:00:00 2001 From: silverwind Date: Wed, 28 Sep 2022 15:19:22 +0200 Subject: [PATCH] Consolidate more CSS rules, fix inline code on arc-green (#21260) - Consolidate various CSS rules into base rules - Fix inline code in Markdown not having enough contrast on arc-green Adds one new color variable, `--color-label-active-bg` for the background of active labels. Co-authored-by: wxiaoguang --- web_src/less/_base.less | 37 +++++++++++++++++- web_src/less/themes/theme-arc-green.less | 48 +----------------------- 2 files changed, 38 insertions(+), 47 deletions(-) diff --git a/web_src/less/_base.less b/web_src/less/_base.less index 3c0b24a634..a2c27acfdf 100644 --- a/web_src/less/_base.less +++ b/web_src/less/_base.less @@ -158,6 +158,7 @@ --color-tooltip-bg: #000000f0; --color-tooltip-text: #ffffff; --color-header-bar: #ffffff; + --color-label-active-bg: #d0d0d0; /* backgrounds */ --checkbox-mask-checked: url('data:image/svg+xml;utf8,'); --checkbox-mask-indeterminate: url('data:image/svg+xml;utf8,'); @@ -393,6 +394,12 @@ a.commit-statuses-trigger { background: var(--color-grey); } +.ui.active.label { + background: var(--color-label-active-bg); + border-color: var(--color-label-active-bg); + color: var(--color-text-dark); +} + .ui.link.menu .item:hover, .ui.menu .dropdown.item:hover, .ui.menu .link.item:hover, @@ -478,11 +485,21 @@ a.commit-statuses-trigger { color: var(--color-text-light-2); } +.ui.list .list > .item .header, +.ui.list > .item .header { + color: var(--color-text-dark); +} + .ui.list .list > .item > .content, .ui.list > .item > .content { color: var(--color-text); } +.ui.list .list > .item .description, +.ui.list > .item .description { + color: var(--color-text); +} + .ui.secondary.menu .dropdown.item:hover, .ui.secondary.menu .link.item:hover, .ui.secondary.menu a.item:hover { @@ -704,6 +721,12 @@ a.ui.card:hover, border-top-color: var(--color-secondary-alpha-50); } +.ui.ui.ui.ui.table tr.active, +.ui.ui.table td.active { + color: var(--color-text); + background: var(--color-active); +} + .ui.ui.selectable.table > tbody > tr:hover, .ui.table tbody tr td.selectable:hover { color: var(--color-text); @@ -726,11 +749,22 @@ a.ui.card:hover, } .ui.modal > .header { + color: var(--color-text-dark); + background: var(--color-secondary-bg); border-color: var(--color-secondary); border-top-left-radius: var(--border-radius); border-top-right-radius: var(--border-radius); } +.ui.modal > .content { + background: var(--color-body); +} + +.ui.modal > .actions { + background: var(--color-secondary-bg); + border-color: var(--color-secondary); +} + .ui.modal > .close.inside, .ui.fullscreen.modal > .close { top: 11px; /* align modal close icon, for example admin notices */ @@ -1591,6 +1625,7 @@ i.icon.centerlock { .ui.labels a.label:hover, a.ui.label:hover { background: var(--color-hover); + border-color: var(--color-hover); color: var(--color-text); } @@ -1615,7 +1650,7 @@ a.ui.label:hover { padding-left: 10px; padding-right: 10px; text-align: right !important; - color: rgba(27, 31, 35, .3); + color: var(--color-text-light-1); width: 1%; font-family: var(--fonts-monospace); diff --git a/web_src/less/themes/theme-arc-green.less b/web_src/less/themes/theme-arc-green.less index 754177d603..7ebcb87d9d 100644 --- a/web_src/less/themes/theme-arc-green.less +++ b/web_src/less/themes/theme-arc-green.less @@ -118,7 +118,7 @@ --color-menu: #2e323e; --color-card: #2e323e; --color-markup-table-row: #ffffff06; - --color-markup-code-block: #292d39; + --color-markup-code-block: #ffffff0d; --color-button: #353846; --color-code-bg: #2a2e3a; --color-code-sidebar-bg: #2e323e; @@ -133,6 +133,7 @@ --color-reaction-bg: #ffffff12; --color-reaction-active-bg: var(--color-primary-alpha-40); --color-header-bar: #2e323e; + --color-label-active-bg: #4c525e; } ::-webkit-calendar-picker-indicator { @@ -228,11 +229,6 @@ a.ui.basic.green.label:hover { background-color: #a0cc75; } -.repository .navbar .active.item, -.repository .navbar .active.item:hover { - border-color: transparent !important; -} - .repository .diff-stats li { border-color: var(--color-secondary); } @@ -247,37 +243,11 @@ a.ui.basic.green.label:hover { background-color: #984646; } -.ui.list .list > .item .header, -.ui.list > .item .header { - color: #dedede; -} - -.ui.list .list > .item .description, -.ui.list > .item .description { - color: var(--color-secondary-dark-6); -} - -.lines-num { - color: var(--color-secondary-dark-6) !important; - border-color: var(--color-secondary) !important; -} - .lines-code.active, .lines-code .active { background: #534d1b !important; } -.ui.ui.ui.ui.table tr.active, -.ui.ui.table td.active { - color: #dbdbdb; -} - -.ui.active.label { - background: #393d4a; - border-color: #393d4a; - color: #dbdbdb; -} - .ui.header .sub.header { color: var(--color-secondary-dark-6); } @@ -286,20 +256,6 @@ a.ui.basic.green.label:hover { border-bottom: 1px solid var(--color-secondary); } -.ui.modal > .header { - background: var(--color-secondary); - color: #dbdbdb; -} - -.ui.modal > .actions { - background: var(--color-secondary); - border-color: var(--color-secondary); -} - -.ui.modal > .content { - background: #383c4a; -} - .minicolors-panel { background: var(--color-secondary) !important; border-color: #6a737d !important;