fix(NcInputField): Do not overwrite invalid state border color

Signed-off-by: Ferdinand Thiessen <[email protected]>
nextcloud-libraries · Aug 7, 2024 · 1331abf · 1331abf
1 parent f28b6ef
commit 1331abf
Showing 1 changed file with 3 additions and 2 deletions.
diff --git a/src/components/NcInputField/NcInputField.vue b/src/components/NcInputField/NcInputField.vue
@@ -391,8 +391,8 @@ export default {
 		&:active:not([disabled]),
 		&:hover:not([disabled]),
 		&:focus:not([disabled]) {
+			border-color: var(--color-main-text);
 			border-width: var(--border-width-input-focused, 2px);
-			border-color: var(--color-main-text) !important;
 			box-shadow: 0 0 0 2px var(--color-main-background) !important;
 			// Reset padding offset when focused
 			--input-border-width-offset: 0px;
@@ -422,7 +422,8 @@ export default {
 			}
 		}
 
-		&--error {
+		&--error,
+		&:invalid {
 			border-color: var(--color-error) !important; //Override hover border color
 			&:focus-visible {
 				box-shadow: rgb(248, 250, 252) 0px 0px 0px 2px, var(--color-primary-element) 0px 0px 0px 4px, rgba(0, 0, 0, 0.05) 0px 1px 2px 0px