From 5d6ecba9f7b616d217bb830c905a5e4bf0f1f0bc Mon Sep 17 00:00:00 2001
From: shibao <shibao@bubbletea.dev>
Date: Mon, 28 Mar 2022 23:56:15 -0400
Subject: [PATCH] display inline block, add min width to buttons and links

---
 assets/css/components.scss |  2 ++
 assets/tailwind.config.js  | 14 ++++++++++++++
 2 files changed, 16 insertions(+)

diff --git a/assets/css/components.scss b/assets/css/components.scss
index d3c8d46..5f567e3 100644
--- a/assets/css/components.scss
+++ b/assets/css/components.scss
@@ -25,6 +25,7 @@
   }
 
   .btn {
+    @apply inline-block break-all min-w-4;
     @apply focus:outline-none px-4 py-2 rounded-lg;
     @apply shadow-sm focus:shadow-lg;
     @apply transition-all duration-300 ease-in-out;
@@ -51,6 +52,7 @@
   }
 
   .link {
+    @apply inline-block break-all min-w-4;
     @apply hover:underline;
     @apply transition-colors duration-500 ease-in-out;
   }
diff --git a/assets/tailwind.config.js b/assets/tailwind.config.js
index 2063490..5566454 100644
--- a/assets/tailwind.config.js
+++ b/assets/tailwind.config.js
@@ -28,6 +28,20 @@ module.exports = {
         128: '32rem',
         192: '48rem',
         256: '64rem'
+      },
+      minWidth: {
+        4: '1rem',
+        8: '2rem',
+        12: '3rem',
+        16: '4rem',
+        20: '8rem'
+      },
+      maxWidth: {
+        4: '1rem',
+        8: '2rem',
+        12: '3rem',
+        16: '4rem',
+        20: '8rem'
       }
     }
   },