From f511ffb08327fe34aea0b353d2467496699c6097 Mon Sep 17 00:00:00 2001 From: harryzcy Date: Sat, 10 Dec 2022 01:37:27 -0500 Subject: [PATCH 1/3] Fix autofilled text visibility issue in dark mode --- web_src/fomantic/build/semantic.css | 1 + 1 file changed, 1 insertion(+) diff --git a/web_src/fomantic/build/semantic.css b/web_src/fomantic/build/semantic.css index dd6637981be6e..bec04842fe225 100644 --- a/web_src/fomantic/build/semantic.css +++ b/web_src/fomantic/build/semantic.css @@ -10719,6 +10719,7 @@ select.ui.dropdown { .ui.form .field.field input:-webkit-autofill { box-shadow: 0 0 0 100px #FFFFF0 inset !important; border-color: #E5DFA1 !important; + -webkit-text-fill-color: #000000 !important; } /* Focus */ From 4d84c9c21f29df285b75520adac7b09172db1383 Mon Sep 17 00:00:00 2001 From: harryzcy Date: Mon, 12 Dec 2022 00:54:03 -0500 Subject: [PATCH 2/3] Provide fix in source rather than in build --- web_src/fomantic/build/semantic.css | 1 - web_src/less/_base.less | 4 ++++ 2 files changed, 4 insertions(+), 1 deletion(-) diff --git a/web_src/fomantic/build/semantic.css b/web_src/fomantic/build/semantic.css index bec04842fe225..dd6637981be6e 100644 --- a/web_src/fomantic/build/semantic.css +++ b/web_src/fomantic/build/semantic.css @@ -10719,7 +10719,6 @@ select.ui.dropdown { .ui.form .field.field input:-webkit-autofill { box-shadow: 0 0 0 100px #FFFFF0 inset !important; border-color: #E5DFA1 !important; - -webkit-text-fill-color: #000000 !important; } /* Focus */ diff --git a/web_src/less/_base.less b/web_src/less/_base.less index 022afcea927e7..91cd31014055a 100644 --- a/web_src/less/_base.less +++ b/web_src/less/_base.less @@ -1354,6 +1354,10 @@ a.ui.card:hover, border-color: var(--color-error-border) !important; } +.ui.form .field.field input:-webkit-autofill { + -webkit-text-fill-color: var(--color-black) !important; +} + .ui.loading.loading.input > i.icon svg { visibility: hidden; } From fbbcde9a988a734677294bac12645b65a1781a7f Mon Sep 17 00:00:00 2001 From: harryzcy Date: Mon, 12 Dec 2022 00:56:15 -0500 Subject: [PATCH 3/3] Provide comment --- web_src/less/_base.less | 2 ++ 1 file changed, 2 insertions(+) diff --git a/web_src/less/_base.less b/web_src/less/_base.less index 91cd31014055a..697bc0ee7459e 100644 --- a/web_src/less/_base.less +++ b/web_src/less/_base.less @@ -1354,6 +1354,8 @@ a.ui.card:hover, 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; }