diff --git a/web_src/less/_base.less b/web_src/less/_base.less index 121a2b206419c..8323ed7b88a62 100644 --- a/web_src/less/_base.less +++ b/web_src/less/_base.less @@ -97,6 +97,7 @@ --color-input-border-hover: #cecece; --color-navbar: #f8f8f8; --color-light: #00000004; + --color-light-undo-disabling: rgba(0, 0, 0, calc(4 / 255 * 222 / 255 / var(--opacity-disabled))); --color-light-border: #0000001d; --color-hover: #0000000d; --color-active: #00000012; diff --git a/web_src/less/_repository.less b/web_src/less/_repository.less index 9f40c0c618b6b..8c8af3e16e201 100644 --- a/web_src/less/_repository.less +++ b/web_src/less/_repository.less @@ -2864,8 +2864,23 @@ tbody.commit-list { align-items: center; } +.repo-buttons .ui.labeled.button > .label:hover { + color: var(--color-primary-light-2); + background: var(--color-light); +} + +.label-mimic-enabled() { + color: var(--color-text-dark); + background: var(--color-light-undo-disabling) !important; + + &:hover { + color: var(--color-primary-dark-1); + } +} + .repo-buttons button[disabled] ~ .label { opacity: var(--opacity-disabled); + .label-mimic-enabled(); } .repo-buttons .ui.labeled.button { @@ -2879,6 +2894,10 @@ tbody.commit-list { &.disabled { pointer-events: inherit !important; + > .label { + .label-mimic-enabled(); + } + > .button { pointer-events: none !important; } diff --git a/web_src/less/themes/theme-arc-green.less b/web_src/less/themes/theme-arc-green.less index 9f35d4dafe55b..343f9283ae92b 100644 --- a/web_src/less/themes/theme-arc-green.less +++ b/web_src/less/themes/theme-arc-green.less @@ -92,6 +92,7 @@ --color-input-border-hover: #505667; --color-navbar: #2a2e3a; --color-light: #00000028; + --color-light-undo-disabling: rgba(0, 0, 0, calc(40 / 255 * 222 / 255 / var(--opacity-disabled))); --color-light-border: #ffffff28; --color-hover: #60606020; --color-active: #60606040;