fix(NcInputField): Make focus visible on trailing button look better

Signed-off-by: Ferdinand Thiessen <[email protected]>
nextcloud-libraries · Jul 18, 2024 · faca023 · faca023
1 parent ad3a9c8
commit faca023
Showing 1 changed file with 8 additions and 2 deletions.
diff --git a/src/components/NcInputField/NcInputField.vue b/src/components/NcInputField/NcInputField.vue
@@ -488,11 +488,17 @@ export default {
 	}
 
 	&__trailing-button {
+		--button-size: calc(var(--default-clickable-area) - 2 * var(--border-width-input-focused, 2px)) !important;
+
 		&.button-vue {
 			position: absolute;
-			top: 0;
-			right: 0;
+			top: var(--border-width-input-focused, 2px);
+			right: var(--border-width-input-focused, 2px);
 			border-radius: var(--border-radius-large);
+
+			&:focus-visible {
+				box-shadow: none !important;
+			}
 		}
 
 		&--pill.button-vue {