Reduce inputs border-width

Signed-off-by: Marco Ambrosini <[email protected]>
nextcloud-libraries · Apr 29, 2024 · 26f85e9 · 26f85e9
1 parent 1b6dadd
commit 26f85e9
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 5 deletions.
diff --git a/src/components/NcInputField/NcInputField.vue b/src/components/NcInputField/NcInputField.vue
@@ -371,7 +371,7 @@ export default {
 
 		background-color: var(--color-main-background);
 		color: var(--color-main-text);
-		border: 2px solid var(--color-border-maxcontrast);
+		border: 1px solid var(--color-border-maxcontrast);
 		border-radius: var(--border-radius-large);
 
 		cursor: pointer;
@@ -386,7 +386,7 @@ export default {
 		&:active:not([disabled]),
 		&:hover:not([disabled]),
 		&:focus:not([disabled]) {
-			border-color: 2px solid var(--color-main-text) !important;
+			border: 2px solid var(--color-main-text) !important;
 			box-shadow: 0 0 0 2px var(--color-main-background) !important;
 		}
 

diff --git a/src/components/NcSelect/NcSelect.vue b/src/components/NcSelect/NcSelect.vue
@@ -1149,7 +1149,7 @@ body {
 
 	/* Borders */
 	--vs-border-color: var(--color-border-maxcontrast);
-	--vs-border-width: 2px;
+	--vs-border-width: 1px;
 	--vs-border-style: solid;
 	--vs-border-radius: var(--border-radius-large);
 
@@ -1226,6 +1226,7 @@ body {
 	}
 
 	&.vs--open .vs__dropdown-toggle {
+		border-width: 2px;
 		outline: 2px solid var(--color-main-background);
 		border-color: var(--color-main-text);
 		border-bottom-color: transparent;
@@ -1301,6 +1302,7 @@ body {
 
 .vs__dropdown-menu {
 	border-color: var(--color-main-text) !important;
+	border-width: 2px;
 	outline: none !important;
 	box-shadow:
 		-2px 0 0 var(--color-main-background), // Right

diff --git a/src/components/NcTextArea/NcTextArea.vue b/src/components/NcTextArea/NcTextArea.vue
@@ -311,6 +311,7 @@ export default {
 	border-radius: var(--border-radius-large);
 	margin-block-start: 6px; // for the label in active state
 	resize: vertical;
+	box-sizing: border-box;
 
 	&__main-wrapper {
 		position: relative;
@@ -331,15 +332,15 @@ export default {
 
 		background-color: var(--color-main-background);
 		color: var(--color-main-text);
-		border: 2px solid var(--color-border-maxcontrast);
+		border: 1px solid var(--color-border-maxcontrast);
 		border-radius: var(--border-radius-large);
 
 		cursor: pointer;
 
 		&:active:not([disabled]),
 		&:hover:not([disabled]),
 		&:focus:not([disabled]) {
-			border-color: 2px solid var(--color-main-text) !important;
+			border: 2px solid var(--color-main-text) !important;
 			box-shadow: 0 0 0 2px var(--color-main-background) !important;
 		}