feat: homepage updates (#184)

- update the homepage buttons - add a picture to the readme
dylants · Apr 18, 2024 · 931f2d2 · 931f2d2
1 parent ca716e2
commit 931f2d2
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 12 deletions.
diff --git a/README.md b/README.md
@@ -2,6 +2,8 @@
 
 An application to help run a book store.
 
+![bookstore](https://github.com/dylants/bookstore/assets/1596740/29a06c8f-f8ba-43d1-9101-840be931ef23)
+
 ## Getting Started
 
 _This app uses [bun](https://bun.sh/) for dependency management and script execution._

diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -20,23 +20,21 @@ function NavLink({
   const buttonContent = (
     <Button
       variant="outline"
-      className="flex items-center gap-2 py-0 h-8 w-[150px]"
+      className="flex items-center gap-2 py-0 h-[60px] w-[200px] text-lg"
       disabled={disabled}
     >
       {children}
     </Button>
   );
 
   return (
-    <>
+    <div className="flex items-center">
       {disabled ? (
-        <div className="h-[50px] flex items-center">{buttonContent}</div>
+        <>{buttonContent}</>
       ) : (
-        <Link href={path} className="h-[50px] flex items-center">
-          {buttonContent}
-        </Link>
+        <Link href={path}>{buttonContent}</Link>
       )}
-    </>
+    </div>
   );
 }
 
@@ -45,21 +43,21 @@ export default function HomePage() {
     <div className="flex flex-col w-full items-center mt-[80px] gap-4">
       <h1>Bookstore</h1>
       <Separator className="bg-customPalette-200 my-4" />
-      <div className="grid grid-cols-2 gap-x-8 gap-y-2">
+      <div className="grid grid-cols-2 gap-8">
         <NavLink path="/checkout">
-          <ShoppingCartIcon size={14} />
+          <ShoppingCartIcon size={18} />
           Checkout
         </NavLink>
         <NavLink path="/invoices">
-          <PackageOpenIcon size={14} />
+          <PackageOpenIcon size={18} />
           Invoices
         </NavLink>
         <NavLink path="/orders">
-          <GiftIcon size={14} />
+          <GiftIcon size={18} />
           Orders
         </NavLink>
         <NavLink path="#" disabled>
-          <ClipboardListIcon size={14} />
+          <ClipboardListIcon size={18} />
           Reports
         </NavLink>
       </div>