Completely style the webkit autofill (#29683)
Previously it was only partially styled, e.g. there was black text on white background even in dark theme caused by fomantic styles. <img width="195" alt="image" src="https://github.com/go-gitea/gitea/assets/115237/bc5cf516-2aef-45c3-854a-c9f5497aacca"> <img width="195" alt="Screenshot 2024-03-09 at 02 09 29" src="https://github.com/go-gitea/gitea/assets/115237/ef0af17d-6e0b-402e-b24d-bfa34dc2f4e0"> Co-authored-by: Giteabot <teabot@gitea.io> (cherry picked from commit 9b69f76e5a33788150f3abc3dee64010539c6b86)
This commit is contained in:
parent
01bf3a82cf
commit
9916f3ed64
1 changed files with 12 additions and 4 deletions
|
@ -883,10 +883,18 @@ img.ui.avatar,
|
|||
border-color: var(--color-error-border) !important;
|
||||
}
|
||||
|
||||
/* A fix for text visibility issue in Chrome autofill in dark mode. */
|
||||
/* It's a problem from Formatic UI, and this rule overrides it. */
|
||||
.ui.form .field.field input:-webkit-autofill {
|
||||
-webkit-text-fill-color: var(--color-black) !important;
|
||||
input:-webkit-autofill,
|
||||
input:-webkit-autofill:focus,
|
||||
input:-webkit-autofill:hover,
|
||||
input:-webkit-autofill:active,
|
||||
.ui.form .field.field input:-webkit-autofill,
|
||||
.ui.form .field.field input:-webkit-autofill:focus,
|
||||
.ui.form .field.field input:-webkit-autofill:hover,
|
||||
.ui.form .field.field input:-webkit-autofill:active {
|
||||
-webkit-background-clip: text;
|
||||
-webkit-text-fill-color: var(--color-text);
|
||||
box-shadow: 0 0 0 100px var(--color-primary-light-6) inset !important;
|
||||
border-color: var(--color-primary-light-4) !important;
|
||||
}
|
||||
|
||||
.ui.form .field.muted {
|
||||
|
|
Loading…
Reference in a new issue