From b1338c5beddbab4155d004f391bd067f9d4d687a Mon Sep 17 00:00:00 2001
From: Sam Chau <chaucted@gmail.com>
Date: Sat, 11 Jan 2025 03:31:06 +1030
Subject: [PATCH] feat: increase modal and view changes component widths for
 improved layout

---
 frontend/src/components/settings/git/status/ViewChanges.jsx | 6 +++---
 frontend/src/components/ui/Modal.jsx                        | 6 ++++++
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/settings/git/status/ViewChanges.jsx b/frontend/src/components/settings/git/status/ViewChanges.jsx
index 43eaa4e..c99158f 100644
--- a/frontend/src/components/settings/git/status/ViewChanges.jsx
+++ b/frontend/src/components/settings/git/status/ViewChanges.jsx
@@ -25,7 +25,7 @@ const ViewChanges = ({isOpen, onClose, change, isIncoming}) => {
             isOpen={isOpen}
             onClose={onClose}
             title={titleContent}
-            width='7xl'>
+            width='10xl'>
             <div className='space-y-4'>
                 {/* If there's a commit message, show it */}
                 {change.commit_message && (
@@ -36,10 +36,10 @@ const ViewChanges = ({isOpen, onClose, change, isIncoming}) => {
                     <table className='min-w-full'>
                         <thead className='bg-gray-800 border-b border-gray-700'>
                             <tr>
-                                <th className='py-3 px-4 text-left text-gray-400 font-medium w-1/6'>
+                                <th className='py-3 px-4 text-left text-gray-400 font-medium w-1/8'>
                                     Change
                                 </th>
-                                <th className='py-3 px-4 text-left text-gray-400 font-medium w-1/6'>
+                                <th className='py-3 px-4 text-left text-gray-400 font-medium w-2/8'>
                                     Key
                                 </th>
                                 <th className='py-3 px-4 text-left text-gray-400 font-medium w-2/6'>
diff --git a/frontend/src/components/ui/Modal.jsx b/frontend/src/components/ui/Modal.jsx
index 1dc7c82..c8885e4 100644
--- a/frontend/src/components/ui/Modal.jsx
+++ b/frontend/src/components/ui/Modal.jsx
@@ -60,6 +60,9 @@ const Modal = ({
         '5xl': 'w-[1024px]',
         '6xl': 'w-[1152px]',
         '7xl': 'w-[1280px]',
+        '8xl': 'w-[1408px]',
+        '9xl': 'w-[1536px]',
+        '10xl': 'w-[1664px]',
         full: 'w-full',
         'screen-sm': 'w-screen-sm',
         'screen-md': 'w-screen-md',
@@ -187,6 +190,9 @@ Modal.propTypes = {
         '5xl',
         '6xl',
         '7xl',
+        '8xl',
+        '9xl',
+        '10xl',
         'full',
         'screen-sm',
         'screen-md',