revamp template

src/plugins/components/input-group.js

@@ -0,0 +1,37 @@
+import plugin from 'tailwindcss/plugin';
+
+export default plugin(({ addComponents }) => {
+  // Form input
+  addComponents({
+    '.input-group': {
+      'display': 'flex',
+      'align-items': 'stretch',
+      '.btn': {
+        'flex-shrink': '0',
+      },
+      '.input': {
+        'flex-grow': '1',
+      },
+      '.input ~ .btn, .input ~ .dropdown > .btn': {
+        'border-start-start-radius': '0',
+        'border-end-start-radius': '0',
+      },
+      '.input + .btn, .input + .dropdown > .btn': {
+        'border-inline-start': '0',
+      },
+      '.btn ~ .input, .btn ~ .btn, .input ~ .input': {
+        'border-start-start-radius': '0',
+        'border-end-start-radius': '0',
+      },
+      '.input:has(~ .btn), .input:has(~ .input), .input:has(~ .dropdown > .btn)': {
+        'border-start-end-radius': '0',
+        'border-end-end-radius': '0',
+      },
+      '.btn:has(~ .input, ~ .btn), .input:has(~ .input)': {
+        'border-start-end-radius': '0',
+        'border-end-end-radius': '0',
+        'border-inline-end': '0',
+      },
+    },
+  });
+});