Improve visual separation of select optgroup headers (#18376)

archilex · danharrin · web-flow · commit ace827dbad2b · 2025-11-02T16:16:54.000Z
* Update select.css

* Update packages/support/resources/css/components/input/select.css

Signed-off-by: Dan Harrin &lt;git@danharrin.com&gt;

---------

Signed-off-by: Dan Harrin &lt;git@danharrin.com&gt;
Co-authored-by: Dan Harrin &lt;git@danharrin.com&gt;
diff --git a/packages/support/resources/css/components/input/select.css b/packages/support/resources/css/components/input/select.css
@@ -69,6 +69,10 @@ select.fi-select-input {
 
     & .fi-select-input-option-group {
         @apply divide-y divide-gray-100 dark:divide-white/5;
+
+        & .fi-dropdown-header {
+            @apply font-medium text-gray-500 dark:text-gray-400;
+        }
     }
 
     & .fi-select-input-search-ctn {

Original file line number	Diff line number	Diff line change
`@@ -69,6 +69,10 @@ select.fi-select-input {`
`69`	`69`
`70`	`70`	`& .fi-select-input-option-group {`
`71`	`71`	`@apply divide-y divide-gray-100 dark:divide-white/5;`
	`72`	`+`
	`73`	`+ & .fi-dropdown-header {`
	`74`	`+ @apply font-medium text-gray-500 dark:text-gray-400;`
	`75`	`+ }`
`72`	`76`	`}`
`73`	`77`
`74`	`78`	`& .fi-select-input-search-ctn {`