From e270999745f97c2860f6a5b84e897dc6da8d6001 Mon Sep 17 00:00:00 2001
From: sct <sctsnipe@gmail.com>
Date: Thu, 4 Feb 2021 06:45:49 +0000
Subject: [PATCH] fix(ui): fix tables extending outside viewport in mobile
 formats

---
 src/components/Common/Table/index.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/Common/Table/index.tsx b/src/components/Common/Table/index.tsx
index dd15b9e6..3bf03b7b 100644
--- a/src/components/Common/Table/index.tsx
+++ b/src/components/Common/Table/index.tsx
@@ -71,9 +71,9 @@ const TD: React.FC<TDProps> = ({
 const Table: React.FC = ({ children }) => {
   return (
     <div className="flex flex-col">
-      <div className="my-2 overflow-x-auto -mx-6 md:mx-0 lg:mx-0">
-        <div className="py-2 align-middle inline-block min-w-full">
-          <div className="shadow overflow-hidden sm:rounded-lg">
+      <div className="my-2 -mx-4 overflow-x-auto md:mx-0 lg:mx-0">
+        <div className="inline-block min-w-full py-2 align-middle">
+          <div className="overflow-hidden shadow sm:rounded-lg">
             <table className="min-w-full">{children}</table>
           </div>
         </div>