Small style changes

ShephardLuke · Nov 28, 2024 · 27b93c1 · 27b93c1
1 parent d39cd22
commit 27b93c1
Show file tree

Hide file tree

Showing 7 changed files with 34 additions and 29 deletions.
diff --git a/app/dbLink.tsx b/app/dbLink.tsx
@@ -47,16 +47,16 @@ export default function DbLink({database, deleteDatabase}: {database: IDBDatabas
 
     return (
         <tr className="border-2">
-            <th>
+            <th className="border-2">
                 {database.name}
             </th>
-            <td>
+            <td className="border-2">
                 {database.version}
             </td>
-            <td className="truncate text-nowrap">
+            <td className="truncate text-nowrap border-2">
                 {objectStoreNames.length}: {getObjectStoreNamesString()}
             </td>
-            <td>
+            <td className="border-2">
                 <Link className="" href={{pathname: "/view", query: {database: database.name}}}>
                     <PrimaryButton text="Open Database" clicked={() => {}}/>
                 </Link>

diff --git a/app/footer/footer.tsx b/app/footer/footer.tsx
@@ -3,8 +3,10 @@ export default function Footer() { // Global footer
     return (
         <footer className="text-center">
             <hr></hr>
-            <p className="pt-10">Version {pk.version}</p>
-            <p>(Pre-release version, everything is subject to change and bugs or crashes may occur.)</p>
+            <div className="p-10">
+                <p>Version {pk.version}</p>
+                <p>(Pre-release version, everything is subject to change and bugs or crashes may occur.)</p>
+            </div>
         </footer>
     )
 }
diff --git a/app/page.tsx b/app/page.tsx
@@ -80,10 +80,10 @@ export default function ChooseDatabase() { // Displaying every database allowing
 
     return (
         <>
-            <div className="text-center">
+            <div className="text-center p-10">
                 <p className="p-10 pb-5 text-4xl text-bold underline">Found databases: {databases?.length}</p>   
                 <br/>
-                <table className="table-fixed w-full border-2">
+                <table className="table-fixed w-full border-4">
                     <thead className="border-2">
                         <tr>
                             <th>Database Name</th>

diff --git a/app/view/objectStore/objectStoreCreation.tsx b/app/view/objectStore/objectStoreCreation.tsx
@@ -113,23 +113,26 @@ export default function ObjectStoreCreation({newObjectStore}: {newObjectStore: (
 
     return (
         <>
+
             <p className="text-xl font-bold underline">New Object Store Setup</p>
             <PrimaryButton text="Create Index" clicked={newIndex}/>
-            <table className="m-4 table-fixed w-full">
-                <thead>
-                    <tr>
-                        {indexRows}
-                    </tr>
-                </thead>
-                <tbody>
-                    <tr>
-                        {keyCheckboxes}
-                    </tr>
-                    <tr>
-                        {deleteButtons}
-                    </tr>
-                </tbody>
-            </table>
+            <div className="p-10">
+                <table className="table-fixed w-full border-4">
+                    <thead>
+                        <tr>
+                            {indexRows}
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <tr>
+                            {keyCheckboxes}
+                        </tr>
+                        <tr>
+                            {deleteButtons}
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
             <div className="p-10">
                 <SuccessMessage success={creationMessage?.success} text={creationMessage?.text}/>
                 <input className="text-center m-4 border-4 w-1/4" placeholder="Enter name..." id="objectStoreName" type="text" />

diff --git a/app/view/objectStore/objectStoreDisplay.tsx b/app/view/objectStore/objectStoreDisplay.tsx
@@ -16,8 +16,8 @@ export default function ObjectStoreDisplay({idbRequest, deleteObjectStore}: {idb
 
     const indexOrder = [... keys, ...indexes]; // Eventually can possibly be rearranged by the user to whatever they pick
 
-    const headings = indexOrder.map(index => <th key={indexOrder.indexOf(index)} className={"border-solid border-4" + (keys.includes(index) ? " underline" : "")}>{index}</th>)
-    headings.push(<th key={"-1"} className="border-solid border-4">Option</th>)
+    const headings = indexOrder.map(index => <th key={indexOrder.indexOf(index)} className={"border-solid" + (keys.includes(index) ? " underline" : "")}>{index}</th>)
+    headings.push(<th key={"-1"} className="border-solid">Option</th>)
 
     const recordRows = data.map(record => <Record key={Object.values(record).toString()} deleteRecord={deleteRecord} indexOrder={indexOrder} data={record}/>) // bug if record has 2 indexes same data (will cause same keys)#=
 
@@ -139,8 +139,8 @@ export default function ObjectStoreDisplay({idbRequest, deleteObjectStore}: {idb
             <div className="flex justify-center">
                 <DeleteButton classAdd="flex-1 max-w-40" text="Delete Object Store" clicked={() => deleteObjectStore((idbRequest.source as IDBObjectStore).name)}/>
             </div>
-            <div className="m-4 flex">
-                <table className="table-fixed w-full">
+            <div className="p-10">
+                <table className="table-fixed w-full border-4">
                     <thead className="h-2">
                         <tr>
                             {headings}

diff --git a/app/view/table/databaseIndexDisplay.tsx b/app/view/table/databaseIndexDisplay.tsx
@@ -2,6 +2,6 @@ import { ReactNode } from "react";
 
 export default function DatabaseIndexDisplay({text}: {text: unknown}) {
     return (
-        <th className="border-4">{text as ReactNode}</th>
+        <th className="p-4">{text as ReactNode}</th>
     )
 }
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "database-demo",
-  "version": "0.5.0",
+  "version": "0.5.1",
   "private": true,
   "scripts": {
     "dev": "next dev",