revamp template

src/plugins/components/image-input.js

@@ -0,0 +1,39 @@
+ 
+import plugin from 'tailwindcss/plugin';
+
+export default plugin(({addComponents}) => {
+  // Base
+  addComponents({
+    '.image-input': {			
+      'display': 'inline-flex',
+			'position': 'relative',
+      'align-items': 'stretch',
+			'justify-content': 'center',
+      'input[type="file"]': {
+				'appearance': 'none',
+				'position': 'absolute',
+				'width': '0 !important',
+				'height': '0 !important',
+				'overflow': 'hidden',
+				'opacity': '0',
+			},
+			'.image-input-preview': {
+				'cursor': 'pointer',
+				'position': 'relative',
+				'overflow': 'hidden',
+				'width': '100%',
+				'height': '100%',
+				'background-size': 'cover',
+				'background-repeat': 'no-repeat',
+			},
+			'.image-input-placeholder': {
+				'position': 'relative',
+				'overflow': 'hidden',
+				'width': '100%',
+				'height': '100%',
+				'background-size': 'cover',
+				'background-repeat': 'no-repeat',
+			}
+    },
+  }); 
+});