refactor(NcTextArea): use shared scss mixin for input border

Signed-off-by: Ferdinand Thiessen <opensource@fthiessen.de>

Author: susnux

src/components/NcTextArea/NcTextArea.vue

@@ -357,6 +357,8 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+@use '../../assets/input-border.scss' as border;
+
 .textarea {
 	--input-border-color: var(--color-border-maxcontrast);
 	--input-border-width-offset: calc(var(--border-width-input-focused, 2px) - var(--border-width-input, 2px));
@@ -373,19 +375,14 @@ export default {
 
 	&__main-wrapper {
 		height: calc(var(--default-clickable-area) * 2);
-		padding: var(--border-width-input, 2px);
+		padding: var(--border-width-input-focused, 2px);
 		position: relative;
-
-		&:not(:has([disabled])):has(textarea:focus),
-		&:not(:has([disabled])):has(textarea:active) {
-			padding: 0;
-		}
 	}
 
 	&__input {
 		margin: 0;
-		padding-block: calc(10px + var(--input-border-width-offset));
-		padding-inline: calc(12px - var(--border-width-input, 2px) + var(--input-border-width-offset)); // align with label 8px margin label + 4px padding label - 2px border input
+		padding-block: var(--border-radius-element);
+		padding-inline: 10px; // align with label 8px margin label + 4px padding label - 2px border input
 		width: 100%;
 		font-size: var(--default-font-size);
 		text-overflow: ellipsis;
@@ -400,15 +397,10 @@ export default {
 			0 -1px var(--input-border-color),
 			0 0 0 1px color-mix(in srgb, var(--input-border-color), 65% transparent);
 
-		&:hover:not([disabled]) {
-			box-shadow: 0 0 0 1px var(--input-border-color);
-		}
 		&:active:not([disabled]),
 		&:focus:not([disabled]) {
 			--input-border-width-offset: 0px;
 			--input-border-color: var(--color-main-text);
-			border: var(--border-width-input-focused, 2px) solid var(--input-border-color);
-			box-shadow: 0 0 0 2px var(--color-main-background) !important;
 		}
 
 		// Hide placeholder while not focussed -> show label instead (only if internal label is used)
@@ -492,24 +484,5 @@ export default {
 			color: var(--color-success-text);
 		}
 	}
-
-	// for Nextcloud 31 and older we need the old design with only one color
-	&--legacy {
-		.textarea__input {
-			box-shadow: 0 0 0 1px var(--input-border-color);
-		}
-
-		.textarea__main-wrapper:hover:not(:has([disabled])) {
-			padding: 0;
-
-			.textarea__input {
-				--input-border-color: var(--color-main-text);
-				// Reset padding offset when focused
-				--input-border-width-offset: 0px;
-				border: var(--border-width-input-focused, 2px) solid var(--input-border-color);
-				box-shadow: 0 0 0 2px var(--color-main-background) !important;
-			}
-		}
-	}
 }
 </style>