Counterwork seemingly unclickable repo button labels (#15064)

As title, the change counter-works the effect from #14926 that links seem unclickable (especially in the default gitea theme), while maintaining some sort of visual harmony.

Co-authored-by: Andrew Thornton <art27@cantab.net>
This commit is contained in:
Mike L 2021-06-28 10:21:43 +02:00 committed by GitHub
parent 6ca667d3f2
commit 5c80ecc2f7
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 21 additions and 0 deletions

View file

@ -97,6 +97,7 @@
--color-input-border-hover: #cecece; --color-input-border-hover: #cecece;
--color-navbar: #f8f8f8; --color-navbar: #f8f8f8;
--color-light: #00000006; --color-light: #00000006;
--color-light-mimic-enabled: rgba(0, 0, 0, calc(6 / 255 * 222 / 255 / var(--opacity-disabled)));
--color-light-border: #0000001d; --color-light-border: #0000001d;
--color-hover: #0000000f; --color-hover: #0000000f;
--color-active: #00000014; --color-active: #00000014;

View file

@ -2932,8 +2932,23 @@ tbody.commit-list {
align-items: center; 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-mimic-enabled) !important;
&:hover {
color: var(--color-primary-dark-1);
}
}
.repo-buttons button[disabled] ~ .label { .repo-buttons button[disabled] ~ .label {
opacity: var(--opacity-disabled); opacity: var(--opacity-disabled);
.label-mimic-enabled();
} }
.repo-buttons .ui.labeled.button { .repo-buttons .ui.labeled.button {
@ -2947,6 +2962,10 @@ tbody.commit-list {
&.disabled { &.disabled {
pointer-events: inherit !important; pointer-events: inherit !important;
> .label {
.label-mimic-enabled();
}
> .button { > .button {
pointer-events: none !important; pointer-events: none !important;
} }

View file

@ -92,6 +92,7 @@
--color-input-border-hover: #505667; --color-input-border-hover: #505667;
--color-navbar: #2a2e3a; --color-navbar: #2a2e3a;
--color-light: #00000028; --color-light: #00000028;
--color-light-mimic-enabled: rgba(0, 0, 0, calc(40 / 255 * 222 / 255 / var(--opacity-disabled)));
--color-light-border: #ffffff28; --color-light-border: #ffffff28;
--color-hover: #ffffff10; --color-hover: #ffffff10;
--color-active: #ffffff16; --color-active: #ffffff16;