removed fortawesome package and replaced icons

calblueprint · Oct 12, 2023 · bf5b3ab · bf5b3ab
1 parent d43d3be
commit bf5b3ab
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 7 deletions.
diff --git a/src/app/storefront/Shopping_Cart_01.png b/src/app/storefront/Shopping_Cart_01.png
diff --git a/src/app/storefront/User_01.png b/src/app/storefront/User_01.png
diff --git a/src/app/storefront/page.tsx b/src/app/storefront/page.tsx
@@ -1,8 +1,9 @@
 'use client';
 
 import React from 'react';
-import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
-import { faShoppingCart, faUser } from '@fortawesome/free-solid-svg-icons';
+import Image from 'next/image';
+import ShoppingCartImage from './Shopping_Cart_01.png';
+import UserProfileImage from './User_01.png';
 import { GlobalStyle, Button } from './styles';
 
 function handleCheckoutClick() {
@@ -18,11 +19,11 @@ export default function App() {
     <main>
       <GlobalStyle />
       <Button onClick={handleCheckoutClick}>
-        <FontAwesomeIcon icon={faShoppingCart} />
+        <Image src={ShoppingCartImage} alt="Cart" />
         <div>Cart</div>
       </Button>
       <Button onClick={handleProfileClick}>
-        <FontAwesomeIcon icon={faUser} />
+        <Image src={UserProfileImage} alt="Profile" />
         <div>Profile</div>
       </Button>
     </main>

diff --git a/src/app/storefront/styles.ts b/src/app/storefront/styles.ts
@@ -7,16 +7,17 @@ export const GlobalStyle = createGlobalStyle`
 `;
 
 export const Button = styled.button`
-  margin: 10px;
+  margin-top: 30px;
+  margin-right: 25px;
   color: black;
   text-align: center;
   font-family: sans-serif;
   font-size: 15px;
   font-style: normal;
   font-weight: normal;
   line-height: normal;
-  width: 50px;
-  height: 50px;
+  width: 70px;
+  height: 70px;
   background: transparent;
   border: transparent;
   float: right;