diff options
| -rw-r--r-- | src/components/header.js | 69 | ||||
| -rw-r--r-- | src/components/productCard.js | 39 |
2 files changed, 0 insertions, 108 deletions
diff --git a/src/components/header.js b/src/components/header.js deleted file mode 100644 index 3d5d0f84..00000000 --- a/src/components/header.js +++ /dev/null @@ -1,69 +0,0 @@ -import Image from "next/image"; -import Link from "next/link"; -import ShoppingCartIcon from "../icons/shopping-cart.svg"; -import SearchIcon from "../icons/search.svg"; -import MenuIcon from "../icons/menu.svg"; -import ChevronRightIcon from "../icons/chevron-right.svg"; -import { useState } from "react"; - - -export default function Header() { - const [isMenuActive, setIsMenuActive] = useState(false); - - const openMenu = () => setIsMenuActive(true); - const closeMenu = () => setIsMenuActive(false); - - return ( - <> - <div className={isMenuActive ? 'menu-wrapper active' : 'menu-wrapper'}> - <div className="flex gap-x-2 items-center"> - <Link href="/login" className="w-full py-2 btn-light">Masuk</Link> - <Link href="/register" className="w-full py-2 btn-primary">Daftar</Link> - </div> - <div className="flex flex-col gap-y-4 mt-5"> - <Link className="flex w-full font-normal text-gray-800" href="/shop/brands"> - <span>Brand</span> - <div className="ml-auto"> - <ChevronRightIcon className="stroke-gray-700" /> - </div> - </Link> - <Link className="flex w-full font-normal text-gray-800" href="/blog"> - <span>Blog</span> - <div className="ml-auto"> - <ChevronRightIcon className="stroke-gray-700" /> - </div> - </Link> - <button className="flex w-full font-normal text-gray-800" id="open_category_parent_menu"> - <span>Kategori</span> - <div className="ml-auto"> - <ChevronRightIcon className="stroke-gray-700" /> - </div> - </button> - </div> - </div> - <div className={isMenuActive ? 'menu-overlay block opacity-100' : 'menu-overlay hidden opacity-0'} onClick={closeMenu}></div> - - <div className="sticky-header"> - <div className="flex justify-between items-center"> - <Link href="/"> - <Image src="/images/logo.png" alt="Logo Indoteknik" width={120} height={40} /> - </Link> - <div className="flex gap-4"> - <Link href="/shop/cart"> - <ShoppingCartIcon className="w-6" /> - </Link> - <button onClick={openMenu}> - <MenuIcon className="w-6" /> - </button> - </div> - </div> - <form action="" method="GET" className="flex mt-2"> - <input type="text" name="product_name" className="form-input rounded-r-none border-r-0 focus:outline-none" placeholder="Ketikan nama, merek, part number"/> - <button type="submit" aria-label="search" className="btn-light bg-transparent px-2 py-1 rounded-l-none border-l-0"> - <SearchIcon /> - </button> - </form> - </div> - </> - ) -}
\ No newline at end of file diff --git a/src/components/productCard.js b/src/components/productCard.js deleted file mode 100644 index f51473ad..00000000 --- a/src/components/productCard.js +++ /dev/null @@ -1,39 +0,0 @@ -import Link from "next/link"; -import currencyFormat from "../helpers/currencyFormat"; -import { createSlug } from "../helpers/slug"; -import { LazyLoadImage } from "react-lazy-load-image-component"; - -import 'react-lazy-load-image-component/src/effects/blur.css'; - - -export default function productCard({ data }) { - let product = data; - return ( - <div className="product-card"> - <Link href={'/shop/product/' + createSlug(product.name, product.id)} className="block"> - <LazyLoadImage effect="blur" src={product.image ? product.image : '/images/noimage.jpeg'} alt={product.name} className="product-card__image" /> - </Link> - <div className="product-card__description"> - <div> - {typeof product.manufacture.name !== undefined ? ( - <a href={'/shop/brands/' + createSlug(product.manufacture.name, product.manufacture.id)} className="product-card__brand">{product.manufacture.name}</a> - ) : ( - <span className="product-card__brand">-</span> - )} - <Link href={'/shop/product/' + createSlug(product.name, product.id)} className="product-card__title wrap-line-ellipsis-3"> - {product.name} - </Link> - </div> - <div> - {product.lowest_price.discount_percentage > 0 ? ( - <div className="flex gap-x-1 items-center mt-2"> - <span className="badge-yellow">{product.lowest_price.discount_percentage}%</span> - <p className="text-xs text-gray-800 line-through">{currencyFormat(product.lowest_price.price)}</p> - </div> - ) : ''} - <p className="text-sm text-gray-900 font-semibold">{product.lowest_price.price_discount > 0 ? currencyFormat(product.lowest_price.price_discount) : 'Tanya harga'}</p> - </div> - </div> - </div> - ) -}
\ No newline at end of file |