Fixing append and prepend options

erimicel · Jan 5, 2025 · f318878 · f318878
1 parent 06cb6aa
commit f318878
Show file tree

Hide file tree

Showing 8 changed files with 43 additions and 13 deletions.
diff --git a/README.md b/README.md
@@ -14,7 +14,6 @@ https://erimicel.github.io/select2-tailwindcss-theme/
 
 ## Current issues to be fixed
 
-- [ ] Prepend and Append Styles
 - [ ] Fix height of multi select box
 
 ## 📦 Installation

diff --git a/dist/select2-tailwindcss-theme-plain.css b/dist/select2-tailwindcss-theme-plain.css
@@ -168,6 +168,19 @@
   padding-bottom: 0px
 }
 
+/* Input groups */
+.input-group > * + select + .select2-container--tailwindcss-3 .select2-selection{
+  border-top-left-radius: 0px;
+  border-bottom-left-radius: 0px;
+  border-left-width: 0px
+}
+
+.input-group > .select2-container--tailwindcss-3:not(:last-child) .select2-selection{
+  border-top-right-radius: 0px;
+  border-bottom-right-radius: 0px;
+  border-right-width: 0px
+}
+
 /* Loading state */
 .select2-container--tailwindcss-3 .select2-results__option--loading{
   display: flex;

diff --git a/dist/select2-tailwindcss-theme-plain.min.css b/dist/select2-tailwindcss-theme-plain.min.css
diff --git a/dist/select2-tailwindcss-theme.css b/dist/select2-tailwindcss-theme.css
@@ -59,6 +59,15 @@
   @apply px-0 py-0;
 }
 
+/* Input groups */
+.input-group > * + select + .select2-container--tailwindcss-3 .select2-selection {
+  @apply rounded-l-none border-l-0;
+}
+
+.input-group > .select2-container--tailwindcss-3:not(:last-child) .select2-selection {
+  @apply rounded-r-none border-r-0;
+}
+
 /* Loading state */
 .select2-container--tailwindcss-3 .select2-results__option--loading {
   @apply flex items-center justify-center py-4 text-gray-400;

diff --git a/dist/select2-tailwindcss-theme.min.css b/dist/select2-tailwindcss-theme.min.css