From 6e3438d9fe4d316a9b9f4eef2f587574b2f830a3 Mon Sep 17 00:00:00 2001 From: tienifr Date: Fri, 1 Dec 2023 14:11:21 +0700 Subject: [PATCH 1/3] fix: 31415 Input field on Login page gets white background after using auto-fill --- web/index.html | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/web/index.html b/web/index.html index a7630b1a2cdc..d4555b45cd32 100644 --- a/web/index.html +++ b/web/index.html @@ -74,6 +74,15 @@ } /* Customizes the background and text colors for autofill inputs in Chrome */ + input[chrome-autofilled], + input[chrome-autofilled]:hover, + input[chrome-autofilled]:focus, + textarea[chrome-autofilled], + textarea[chrome-autofilled]:hover, + textarea[chrome-autofilled]:focus, + select[chrome-autofilled], + select[chrome-autofilled]:hover, + select[chrome-autofilled]:focus, input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, @@ -89,7 +98,7 @@ } /* Prevent autofill from overlapping with the input label in Chrome */ - div:has(input:-webkit-autofill) > label { + div:has(input:-webkit-autofill, input[chrome-autofilled]) > label { transform: translateY(var(--active-label-translate-y)) scale(var(--active-label-scale)) !important; transition: transform var(--label-transition-duration); } From e42ba1ed55b954100388b55dffcf3e92657e74c8 Mon Sep 17 00:00:00 2001 From: tienifr Date: Mon, 4 Dec 2023 10:32:06 +0700 Subject: [PATCH 2/3] add comment --- web/index.html | 2 ++ 1 file changed, 2 insertions(+) diff --git a/web/index.html b/web/index.html index d4555b45cd32..d19eac29c5da 100644 --- a/web/index.html +++ b/web/index.html @@ -74,6 +74,8 @@ } /* Customizes the background and text colors for autofill inputs in Chrome */ + /* Chrome on iOS does not support the autofill pseudo class because it is a non-standard webkit feature. + We should rely on the chrome-autofilled property that being added to the input when users use auto-fill function */ input[chrome-autofilled], input[chrome-autofilled]:hover, input[chrome-autofilled]:focus, From 700cded6e5d2ee28ed52c2b6d96d06537d29b87f Mon Sep 17 00:00:00 2001 From: tienifr Date: Tue, 5 Dec 2023 15:06:53 +0700 Subject: [PATCH 3/3] fix: comment --- web/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/web/index.html b/web/index.html index d19eac29c5da..1c0425bf38da 100644 --- a/web/index.html +++ b/web/index.html @@ -75,7 +75,7 @@ /* Customizes the background and text colors for autofill inputs in Chrome */ /* Chrome on iOS does not support the autofill pseudo class because it is a non-standard webkit feature. - We should rely on the chrome-autofilled property that being added to the input when users use auto-fill function */ + We should rely on the chrome-autofilled property being added to the input when users use auto-fill */ input[chrome-autofilled], input[chrome-autofilled]:hover, input[chrome-autofilled]:focus,