Merge pull request #4728 from nextcloud-libraries/fix/41217-Contrast_…

…of_focused_select_is_not_enough Change styles for focused Select
nextcloud-libraries · Nov 6, 2023 · 2069548 · 2069548
2 parents cc12609 + f77b65f
commit 2069548
Showing 1 changed file with 8 additions and 5 deletions.
diff --git a/src/components/NcSelect/NcSelect.vue b/src/components/NcSelect/NcSelect.vue
@@ -1113,12 +1113,14 @@ body {
 	}
 
 	&.vs--open .vs__dropdown-toggle {
-		border-color: var(--color-primary-element);
+		outline: 2px solid var(--color-main-background);
+		border-color: var(--color-main-text);
 		border-bottom-color: transparent;
 	}
 
 	&:not(.vs--disabled, .vs--open) .vs__dropdown-toggle:hover {
-		border-color: var(--color-primary-element);
+		outline: 2px solid var(--color-main-background);
+		border-color: var(--color-main-text);
 	}
 
 	&.vs--disabled {
@@ -1149,7 +1151,7 @@ body {
 			.vs__dropdown-toggle {
 				border-radius: 0 0 var(--vs-border-radius) var(--vs-border-radius);
 				border-top-color: transparent;
-				border-bottom-color: var(--color-primary-element);
+				border-bottom-color: var(--color-main-text);
 			}
 		}
 	}
@@ -1182,8 +1184,10 @@ body {
 }
 
 .vs__dropdown-menu {
-	border-color: var(--color-primary-element) !important;
+	border-color: var(--color-main-text) !important;
+	outline: 2px solid var(--color-main-background);
 	padding: 4px !important;
+	box-shadow: none;
 
 	&--floating {
 		/* Fallback styles overidden by programmatically set inline styles */
@@ -1196,7 +1200,6 @@ body {
 			border-radius: var(--vs-border-radius) var(--vs-border-radius) 0 0 !important;
 			border-top-style: var(--vs-border-style) !important;
 			border-bottom-style: none !important;
-			box-shadow: 0px -1px 1px 0px var(--color-box-shadow) !important;
 		}
 	}