edit: fix select component ui bug (#103)

Author: RATIU5

.changeset/flat-icons-drive.md

@@ -0,0 +1,5 @@
+---
+"@studiocms/ui": patch
+---
+
+Fixes Select components UI bug, where list items had no background and showed bullet points

packages/studiocms_ui/src/components/SearchSelect/searchselect.css

@@ -50,9 +50,9 @@
 	left: 0;
 	display: none;
 	max-height: 300px;
-	border: 1px solid hsl(var(--border));
+	border: 1px solid var(--border);
 	border-radius: var(--radius-md);
-	background-color: hsl(var(--background-step-2));
+	background-color: var(--background-step-2);
 	z-index: 90;
 	box-shadow: 0px 4px 8px var(--shadow);
 }
@@ -62,6 +62,15 @@
 	bottom: calc(100% - 1.5rem);
 }
 
+.sui-search-select-dropdown-list {
+	list-style: none;
+	margin: 0;
+	padding: 0;
+	display: flex;
+	flex-direction: column;
+	width: 100%;
+}
+
 .sui-search-select-option,
 .empty-search-results {
 	padding: 0.5rem;

packages/studiocms_ui/src/components/Select/select.css

@@ -94,9 +94,9 @@
 	left: 0;
 	display: none;
 	max-height: 300px;
-	border: 1px solid hsl(var(--border));
+	border: 1px solid var(--border);
 	border-radius: var(--radius-md);
-	background-color: hsl(var(--background-step-2));
+	background-color: var(--background-step-2);
 	z-index: 90;
 	box-shadow: 0px 4px 8px var(--shadow);
 }
@@ -110,6 +110,15 @@
 	bottom: calc(100% + 0.25rem);
 }
 
+.sui-select-dropdown-list {
+	list-style: none;
+	margin: 0;
+	padding: 0;
+	display: flex;
+	flex-direction: column;
+	width: 100%;
+}
+
 .sui-select-option {
 	padding: 0.5rem;
 	cursor: pointer;