Make combobox play nicely with its background (#218)

josefarias · Nov 18, 2024 · 1377a03 · 1377a03
1 parent 4ad5153
commit 1377a03
Showing 1 changed file with 6 additions and 0 deletions.
diff --git a/app/assets/stylesheets/hotwire_combobox.css b/app/assets/stylesheets/hotwire_combobox.css
@@ -1,6 +1,7 @@
 :root {
   --hw-active-bg-color: #F3F4F6;
   --hw-border-color: #D1D5DB;
+  --hw-component-bg-color: #FFFFFF;
   --hw-group-color: #57595C;
   --hw-group-bg-color: #FFFFFF;
   --hw-invalid-color: #EF4444;
@@ -63,6 +64,7 @@
 }
 
 .hw-combobox__main__wrapper {
+  background-color: var(--hw-component-bg-color);
   border: var(--hw-border-width--slim) solid var(--hw-border-color);
   border-radius: var(--hw-border-radius);
   padding: var(--hw-padding--slim) calc(var(--hw-handle-width) + var(--hw-padding--slimmer)) var(--hw-padding--slim) var(--hw-padding--thick);
@@ -291,4 +293,8 @@
 
 .hw_combobox__pagination__wrapper {
   background-color: var(--hw-option-bg-color);
+
+  &:only-child {
+    background-color: transparent;
+  }
 }