From bb24a9fce4cab10fb163f6f10050ac06bf45f70f Mon Sep 17 00:00:00 2001
From: hoangnt2 <hoang2.nguyenthai@toshiba.co.jp>
Date: Mon, 23 Sep 2024 14:34:58 +0700
Subject: [PATCH] fix(Style): Makes the styling of index pages consistent

---
 .../users/components/UserAdministration.tsx    |  2 +-
 .../admin/vendors/components/VendorsList.tsx   |  2 +-
 .../components/components/ComponentsTable.tsx  |  2 +-
 .../licenses/components/LicensePage.tsx        |  4 ++--
 .../[locale]/packages/components/Packages.tsx  | 18 ++++++++++--------
 .../[locale]/projects/components/Projects.tsx  |  4 ++--
 .../[locale]/search/components/SearchPage.tsx  |  2 +-
 .../components/Vulnerabilities.tsx             | 11 ++++-------
 src/styles/globals.css                         |  2 +-
 9 files changed, 23 insertions(+), 24 deletions(-)

diff --git a/src/app/[locale]/admin/users/components/UserAdministration.tsx b/src/app/[locale]/admin/users/components/UserAdministration.tsx
index bd849a34..e8626418 100644
--- a/src/app/[locale]/admin/users/components/UserAdministration.tsx
+++ b/src/app/[locale]/admin/users/components/UserAdministration.tsx
@@ -156,7 +156,7 @@ export default function UserAdminstration() {
 
     return (
         <>
-            <div className='mx-3 mt-3'>
+            <div className='container page-content'>
                 <div className='row'>
                     <div className='col-lg-2'>
                         <AdvancedSearch title='Advanced Search' fields={advancedSearch} />
diff --git a/src/app/[locale]/admin/vendors/components/VendorsList.tsx b/src/app/[locale]/admin/vendors/components/VendorsList.tsx
index 8df804e5..a1f34459 100644
--- a/src/app/[locale]/admin/vendors/components/VendorsList.tsx
+++ b/src/app/[locale]/admin/vendors/components/VendorsList.tsx
@@ -99,7 +99,7 @@ export default function VendorsList() {
                         <QuickFilter id='vendorSearch' />
                     </div>
                     <div className='col-lg-10'>
-                        <div className='row d-flex justify-content-between ms-1'>
+                        <div className='row d-flex justify-content-between'>
                             <div className='col-lg-5'>
                                 <button className='btn btn-primary col-auto me-2' onClick={handleAddVendor}>
                                     {t('Add Vendor')}
diff --git a/src/app/[locale]/components/components/ComponentsTable.tsx b/src/app/[locale]/components/components/ComponentsTable.tsx
index 1f806347..9cb94f4b 100644
--- a/src/app/[locale]/components/components/ComponentsTable.tsx
+++ b/src/app/[locale]/components/components/ComponentsTable.tsx
@@ -118,7 +118,7 @@ function ComponentsTable({ setNumberOfComponent }: Props) {
 
     return (
         <>
-            <div className='row'>
+            <div className='col'>
                 {status === 'authenticated' &&
                     <Table columns={columns} selector={true} server={initServerPaginationConfig(session)} />
                 }
diff --git a/src/app/[locale]/licenses/components/LicensePage.tsx b/src/app/[locale]/licenses/components/LicensePage.tsx
index 373ae1b1..998106ff 100644
--- a/src/app/[locale]/licenses/components/LicensePage.tsx
+++ b/src/app/[locale]/licenses/components/LicensePage.tsx
@@ -93,12 +93,12 @@ function LicensePage() {
         signOut()
     } else {
         return (
-            <div className='container' style={{ maxWidth: '98vw', marginTop: '10px' }}>
+            <div className='container page-content'>
                 <div className='row'>
                     <div className='col-2 sidebar'>
                         <QuickFilter id='licensefilter' title={t('Quick Filter')} searchFunction={doSearch} />
                     </div>
-                    <div className='col col-sm-9'>
+                    <div className='col col-10'>
                         <div className='col'>
                             <div className='row'>
                                 <PageButtonHeader
diff --git a/src/app/[locale]/packages/components/Packages.tsx b/src/app/[locale]/packages/components/Packages.tsx
index 1a4d3381..35497cbd 100644
--- a/src/app/[locale]/packages/components/Packages.tsx
+++ b/src/app/[locale]/packages/components/Packages.tsx
@@ -168,17 +168,19 @@ export default function Packages() {
     return (
         <>
             <DeletePackageModal modalMetaData={deletePackageModalMetaData} setModalMetaData={setDeletePackageModalMetaData} isEditPage={false}/>
-            <div className='mx-3 mt-3'>
+            <div className='container page-content'>
                 <div className='row'>
-                    <div className='col-lg-2'>
+                    <div className='col-2'>
                         <AdvancedSearch title='Advanced Search' fields={advancedSearch} />
                     </div>
-                    <div className='col-lg-10'>
-                        <div className='row d-flex justify-content-between ms-1'>
-                            <button className='btn btn-primary col-auto' onClick={handleCreatePackage}>
-                                {t('Add Package')}
-                            </button>
-                            <div className='col-auto buttonheader-title'>{t('PACKAGES')}</div>
+                    <div className='col-10'>
+                        <div className='row'>
+                            <div className='col d-flex justify-content-between'>
+                                <button className='btn btn-primary col-auto' onClick={handleCreatePackage}>
+                                    {t('Add Package')}
+                                </button>
+                                <div className='col-auto buttonheader-title'>{t('PACKAGES')}</div>
+                            </div>
                         </div>
                         {
                             status === 'authenticated' ? 
diff --git a/src/app/[locale]/projects/components/Projects.tsx b/src/app/[locale]/projects/components/Projects.tsx
index ec13b931..8f44831f 100644
--- a/src/app/[locale]/projects/components/Projects.tsx
+++ b/src/app/[locale]/projects/components/Projects.tsx
@@ -346,13 +346,13 @@ function Project() {
         <>
             <ImportSBOMModal importSBOMMetadata={importSBOMMetadata} setImportSBOMMetadata={setImportSBOMMetadata} />
             <DeleteProjectDialog projectId={deleteProjectId} show={deleteDialogOpen} setShow={setDeleteDialogOpen} />
-            <div className='mx-3 mt-3'>
+            <div className='container page-content'>
                 <div className='row'>
                     <div className='col-lg-2'>
                         <AdvancedSearch title='Advanced Search' fields={advancedSearch} />
                     </div>
                     <div className='col-lg-10'>
-                        <div className='row d-flex justify-content-between ms-1'>
+                        <div className='row d-flex justify-content-between'>
                             <div className='col-lg-5'>
                                 <div className='row'>
                                     <div className='btn-group col-auto' role='group'>
diff --git a/src/app/[locale]/search/components/SearchPage.tsx b/src/app/[locale]/search/components/SearchPage.tsx
index 0588b9b4..a78379d1 100644
--- a/src/app/[locale]/search/components/SearchPage.tsx
+++ b/src/app/[locale]/search/components/SearchPage.tsx
@@ -93,7 +93,7 @@ export default function Search() {
                                 {t('SEARCH RESULTS', { datalength: data ? data.length : 0 })}
                             </div>
                         </div>
-                        <div className='row mt-5'>
+                        <div className='row'>
                             {!data ? (
                                 <div className='col-12' style={{ textAlign: 'center' }}>
                                     <Spinner className='spinner' />
diff --git a/src/app/[locale]/vulnerabilities/components/Vulnerabilities.tsx b/src/app/[locale]/vulnerabilities/components/Vulnerabilities.tsx
index 0de03c84..92a11d97 100644
--- a/src/app/[locale]/vulnerabilities/components/Vulnerabilities.tsx
+++ b/src/app/[locale]/vulnerabilities/components/Vulnerabilities.tsx
@@ -149,13 +149,10 @@ function Vulnerabilities() {
             />
             <div className='container page-content'>
                 <div className='row'>
-                    <div className='col-lg-2'>
-                        <div className='row mb-3'>
-                            <QuickFilter id='vunerabilities.quickSearch' />
-                        </div>
-                        <div className='row'>
-                            <AdvancedSearch title='Advanced Filter' fields={advancedSearch} />
-                        </div>
+                    <div className='col-lg-2 sidebar'>
+                        <QuickFilter id='vunerabilities.quickSearch' />
+                        <br/>
+                        <AdvancedSearch title='Advanced Filter' fields={advancedSearch} />
                     </div>
                     <div className='col-lg-10'>
                         <div className='row d-flex justify-content-between ms-1'>
diff --git a/src/styles/globals.css b/src/styles/globals.css
index 0bbe7e6c..2eb08c7e 100644
--- a/src/styles/globals.css
+++ b/src/styles/globals.css
@@ -659,7 +659,7 @@ body {
 
 .licadmin-upload {
     color: #5d8ea9;
-    border: 1px solid #5d8ea9;
+    border-bottom: 1px solid #5d8ea9;
     font-size: 1rem;
     font-weight: bold;
     text-transform: uppercase;