basic chgs 2 use 4 food delivery instead of product shipping; remove menu
This commit is contained in:
parent
07456cf81f
commit
1fe46ca39f
26 changed files with 57 additions and 215 deletions
|
@ -3,7 +3,7 @@
|
|||
"version": "1.0.3",
|
||||
"private": true,
|
||||
"author": "Kasper Fabricius Kristensen <kasper@medusajs.com> & Victor Gerbrands <victor@medusajs.com> (https://www.medusajs.com)",
|
||||
"description": "Next.js Starter to be used with Medusa server",
|
||||
"description": "Next.js Storefront for Medusa, built from nextjs-starter-medusa",
|
||||
"keywords": [
|
||||
"medusa-storefront"
|
||||
],
|
||||
|
|
|
@ -27,7 +27,7 @@ export default function CheckoutLayout({
|
|||
href="/"
|
||||
className="txt-compact-xlarge-plus text-ui-fg-subtle hover:text-ui-fg-base uppercase"
|
||||
>
|
||||
Medusa Store
|
||||
Space City Sustenance
|
||||
</LocalizedClientLink>
|
||||
<div className="flex-1 basis-0" />
|
||||
</nav>
|
||||
|
|
|
@ -25,9 +25,9 @@ export default async function Addresses() {
|
|||
return (
|
||||
<div className="w-full">
|
||||
<div className="mb-8 flex flex-col gap-y-4">
|
||||
<h1 className="text-2xl-semi">Shipping Addresses</h1>
|
||||
<h1 className="text-2xl-semi">Delivery Addresses</h1>
|
||||
<p className="text-base-regular">
|
||||
View and update your shipping addresses, you can add as many as you
|
||||
View and update your delivery addresses, you can add as many as you
|
||||
like. Saving your addresses will make them available during checkout.
|
||||
</p>
|
||||
</div>
|
||||
|
|
|
@ -21,8 +21,7 @@ export default async function Orders() {
|
|||
<div className="mb-8 flex flex-col gap-y-4">
|
||||
<h1 className="text-2xl-semi">Orders</h1>
|
||||
<p className="text-base-regular">
|
||||
View your previous orders and their status. You can also create
|
||||
returns or exchanges for your orders if needed.
|
||||
View your previous orders and their status.
|
||||
</p>
|
||||
</div>
|
||||
<div>
|
||||
|
|
|
@ -11,7 +11,7 @@ import { notFound } from "next/navigation"
|
|||
|
||||
export const metadata: Metadata = {
|
||||
title: "Profile",
|
||||
description: "View and edit your Medusa Store profile.",
|
||||
description: "View and edit your profile.",
|
||||
}
|
||||
|
||||
export default async function Profile() {
|
||||
|
|
|
@ -4,7 +4,7 @@ import LoginTemplate from "@modules/account/templates/login-template"
|
|||
|
||||
export const metadata: Metadata = {
|
||||
title: "Sign in",
|
||||
description: "Sign in to your Medusa Store account.",
|
||||
description: "Sign in to Space City Sustenance.",
|
||||
}
|
||||
|
||||
export default function Login() {
|
||||
|
|
|
@ -53,7 +53,7 @@ export async function generateMetadata({ params }: Props): Promise<Metadata> {
|
|||
`${title} category.`
|
||||
|
||||
return {
|
||||
title: `${title} | Medusa Store`,
|
||||
title: `${title} | Space City Sustenance`,
|
||||
description,
|
||||
alternates: {
|
||||
canonical: `${params.category.join("/")}`,
|
||||
|
|
|
@ -52,7 +52,7 @@ export async function generateMetadata({ params }: Props): Promise<Metadata> {
|
|||
}
|
||||
|
||||
const metadata = {
|
||||
title: `${collection.title} | Medusa Store`,
|
||||
title: `${collection.title} | Space City Sustenance`,
|
||||
description: `${collection.title} collection`,
|
||||
} as Metadata
|
||||
|
||||
|
|
|
@ -8,9 +8,9 @@ import { ProductCollectionWithPreviews } from "types/global"
|
|||
import { cache } from "react"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Medusa Next.js Starter Template",
|
||||
title: "Space City Sustenance",
|
||||
description:
|
||||
"A performant frontend ecommerce starter template with Next.js 14 and Medusa.",
|
||||
"Vegan food deliveries 2 se htx",
|
||||
}
|
||||
|
||||
const getCollectionsWithProducts = cache(
|
||||
|
|
|
@ -58,10 +58,10 @@ export async function generateMetadata({ params }: Props): Promise<Metadata> {
|
|||
}
|
||||
|
||||
return {
|
||||
title: `${product.title} | Medusa Store`,
|
||||
title: `${product.title} | Space City Sustenance`,
|
||||
description: `${product.title}`,
|
||||
openGraph: {
|
||||
title: `${product.title} | Medusa Store`,
|
||||
title: `${product.title} | Space City Sustenance`,
|
||||
description: `${product.title}`,
|
||||
images: product.thumbnail ? [product.thumbnail] : [],
|
||||
},
|
||||
|
|
|
@ -4,8 +4,8 @@ import { SortOptions } from "@modules/store/components/refinement-list/sort-prod
|
|||
import StoreTemplate from "@modules/store/templates"
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Store",
|
||||
description: "Explore all of our products.",
|
||||
title: "Menu",
|
||||
description: "Explore our dishes.",
|
||||
}
|
||||
|
||||
type Params = {
|
||||
|
|
|
@ -19,11 +19,11 @@ const Register = ({ setCurrentView }: Props) => {
|
|||
return (
|
||||
<div className="max-w-sm flex flex-col items-center">
|
||||
<h1 className="text-large-semi uppercase mb-6">
|
||||
Become a Medusa Store Member
|
||||
Create an account
|
||||
</h1>
|
||||
<p className="text-center text-base-regular text-ui-fg-base mb-4">
|
||||
Create your Medusa Store Member profile, and get access to an enhanced
|
||||
shopping experience.
|
||||
Create your Space City Sustenance account, and start ordering delicious
|
||||
vegan meals!!
|
||||
</p>
|
||||
<form className="w-full flex flex-col" action={formAction}>
|
||||
<div className="flex flex-col w-full gap-y-2">
|
||||
|
@ -57,7 +57,7 @@ const Register = ({ setCurrentView }: Props) => {
|
|||
</div>
|
||||
<ErrorMessage error={message} />
|
||||
<span className="text-center text-ui-fg-base text-small-regular mt-6">
|
||||
By creating an account, you agree to Medusa Store's{" "}
|
||||
By creating an account, you agree to Space City Sustenance's{" "}
|
||||
<LocalizedClientLink
|
||||
href="/content/privacy-policy"
|
||||
className="underline"
|
||||
|
|
|
@ -21,20 +21,6 @@ const AccountLayout: React.FC<AccountLayoutProps> = ({
|
|||
<div>{customer && <AccountNav customer={customer} />}</div>
|
||||
<div className="flex-1">{children}</div>
|
||||
</div>
|
||||
<div className="flex flex-col small:flex-row items-end justify-between small:border-t border-gray-200 py-12 gap-8">
|
||||
<div>
|
||||
<h3 className="text-xl-semi mb-4">Got questions?</h3>
|
||||
<span className="txt-medium">
|
||||
You can find frequently asked questions and answers on our
|
||||
customer service page.
|
||||
</span>
|
||||
</div>
|
||||
<div>
|
||||
<UnderlineLink href="/customer-service">
|
||||
Customer Service
|
||||
</UnderlineLink>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
|
|
@ -56,7 +56,7 @@ const Addresses = ({
|
|||
level="h2"
|
||||
className="flex flex-row text-3xl-regular gap-x-2 items-baseline"
|
||||
>
|
||||
Shipping Address
|
||||
Delivery Address
|
||||
{!isOpen && <CheckCircleSolid />}
|
||||
</Heading>
|
||||
{!isOpen && cart?.shipping_address && (
|
||||
|
@ -105,7 +105,7 @@ const Addresses = ({
|
|||
<div className="flex items-start gap-x-1 w-full">
|
||||
<div className="flex flex-col w-1/3">
|
||||
<Text className="txt-medium-plus text-ui-fg-base mb-1">
|
||||
Shipping Address
|
||||
Delivery Address
|
||||
</Text>
|
||||
<Text className="txt-medium text-ui-fg-subtle">
|
||||
{cart.shipping_address.first_name}{" "}
|
||||
|
|
|
@ -41,9 +41,9 @@ const Review = ({
|
|||
<div className="w-full">
|
||||
<Text className="txt-medium-plus text-ui-fg-base mb-1">
|
||||
By clicking the Place Order button, you confirm that you have
|
||||
read, understand and accept our Terms of Use, Terms of Sale and
|
||||
Returns Policy and acknowledge that you have read Medusa
|
||||
Store's Privacy Policy.
|
||||
read, understand and accept our Terms of Use & Terms of Sale
|
||||
and acknowledge that you have read Space City
|
||||
Sustenance's Privacy Policy.
|
||||
</Text>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -57,7 +57,7 @@ const CartTotals: React.FC<CartTotalsProps> = ({ data }) => {
|
|||
</div>
|
||||
)}
|
||||
<div className="flex items-center justify-between">
|
||||
<span>Shipping</span>
|
||||
<span>Delivery</span>
|
||||
<span>{getAmount(shipping_total)}</span>
|
||||
</div>
|
||||
<div className="flex justify-between">
|
||||
|
|
|
@ -10,22 +10,18 @@ const Hero = () => {
|
|||
level="h1"
|
||||
className="text-3xl leading-10 text-ui-fg-base font-normal"
|
||||
>
|
||||
Ecommerce Starter Template
|
||||
Phenomenal Vegan Food
|
||||
</Heading>
|
||||
<Heading
|
||||
level="h2"
|
||||
className="text-3xl leading-10 text-ui-fg-subtle font-normal"
|
||||
>
|
||||
Powered by Medusa and Next.js
|
||||
Delivered to SE Hou
|
||||
</Heading>
|
||||
</span>
|
||||
<a
|
||||
href="https://github.com/medusajs/nextjs-starter-medusa"
|
||||
target="_blank"
|
||||
>
|
||||
<a href="/store" >
|
||||
<Button variant="secondary">
|
||||
View on GitHub
|
||||
<Github />
|
||||
Browse plates
|
||||
</Button>
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
@ -66,7 +66,7 @@ const CountrySelect = ({ toggleState, regions }: CountrySelectProps) => {
|
|||
>
|
||||
<Listbox.Button className="py-1 w-full">
|
||||
<div className="txt-compact-small flex items-start gap-x-2">
|
||||
<span>Shipping to:</span>
|
||||
<span>Delivering to:</span>
|
||||
{current && (
|
||||
<span className="txt-compact-small flex items-center gap-x-2">
|
||||
<ReactCountryFlag
|
||||
|
|
|
@ -1,102 +0,0 @@
|
|||
"use client"
|
||||
|
||||
import { Popover, Transition } from "@headlessui/react"
|
||||
import { ArrowRightMini, XMark } from "@medusajs/icons"
|
||||
import { Region } from "@medusajs/medusa"
|
||||
import { Text, clx, useToggleState } from "@medusajs/ui"
|
||||
import { Fragment } from "react"
|
||||
|
||||
import LocalizedClientLink from "@modules/common/components/localized-client-link"
|
||||
import CountrySelect from "../country-select"
|
||||
|
||||
const SideMenuItems = {
|
||||
Home: "/",
|
||||
Store: "/store",
|
||||
Search: "/search",
|
||||
Account: "/account",
|
||||
Cart: "/cart",
|
||||
}
|
||||
|
||||
const SideMenu = ({ regions }: { regions: Region[] | null }) => {
|
||||
const toggleState = useToggleState()
|
||||
|
||||
return (
|
||||
<div className="h-full">
|
||||
<div className="flex items-center h-full">
|
||||
<Popover className="h-full flex">
|
||||
{({ open, close }) => (
|
||||
<>
|
||||
<div className="relative flex h-full">
|
||||
<Popover.Button className="relative h-full flex items-center transition-all ease-out duration-200 focus:outline-none hover:text-ui-fg-base">
|
||||
Menu
|
||||
</Popover.Button>
|
||||
</div>
|
||||
|
||||
<Transition
|
||||
show={open}
|
||||
as={Fragment}
|
||||
enter="transition ease-out duration-150"
|
||||
enterFrom="opacity-0"
|
||||
enterTo="opacity-100 backdrop-blur-2xl"
|
||||
leave="transition ease-in duration-150"
|
||||
leaveFrom="opacity-100 backdrop-blur-2xl"
|
||||
leaveTo="opacity-0"
|
||||
>
|
||||
<Popover.Panel className="flex flex-col absolute w-full pr-4 sm:pr-0 sm:w-1/3 2xl:w-1/4 sm:min-w-min h-[calc(100vh-1rem)] z-30 inset-x-0 text-sm text-ui-fg-on-color m-2 backdrop-blur-2xl">
|
||||
<div className="flex flex-col h-full bg-[rgba(3,7,18,0.5)] rounded-rounded justify-between p-6">
|
||||
<div className="flex justify-end" id="xmark">
|
||||
<button onClick={close}>
|
||||
<XMark />
|
||||
</button>
|
||||
</div>
|
||||
<ul className="flex flex-col gap-6 items-start justify-start">
|
||||
{Object.entries(SideMenuItems).map(([name, href]) => {
|
||||
return (
|
||||
<li key={name}>
|
||||
<LocalizedClientLink
|
||||
href={href}
|
||||
className="text-3xl leading-10 hover:text-ui-fg-disabled"
|
||||
onClick={close}
|
||||
>
|
||||
{name}
|
||||
</LocalizedClientLink>
|
||||
</li>
|
||||
)
|
||||
})}
|
||||
</ul>
|
||||
<div className="flex flex-col gap-y-6">
|
||||
<div
|
||||
className="flex justify-between"
|
||||
onMouseEnter={toggleState.open}
|
||||
onMouseLeave={toggleState.close}
|
||||
>
|
||||
{regions && (
|
||||
<CountrySelect
|
||||
toggleState={toggleState}
|
||||
regions={regions}
|
||||
/>
|
||||
)}
|
||||
<ArrowRightMini
|
||||
className={clx(
|
||||
"transition-transform duration-150",
|
||||
toggleState.state ? "-rotate-90" : ""
|
||||
)}
|
||||
/>
|
||||
</div>
|
||||
<Text className="flex justify-between txt-compact-small">
|
||||
© {new Date().getFullYear()} Medusa Store. All rights
|
||||
reserved.
|
||||
</Text>
|
||||
</div>
|
||||
</div>
|
||||
</Popover.Panel>
|
||||
</Transition>
|
||||
</>
|
||||
)}
|
||||
</Popover>
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default SideMenu
|
|
@ -18,7 +18,7 @@ export default async function Footer() {
|
|||
href="/"
|
||||
className="txt-compact-xlarge-plus text-ui-fg-subtle hover:text-ui-fg-base uppercase"
|
||||
>
|
||||
Medusa Store
|
||||
Space City Sustenance
|
||||
</LocalizedClientLink>
|
||||
</div>
|
||||
<div className="text-small-regular gap-10 md:gap-x-16 grid grid-cols-2 sm:grid-cols-3">
|
||||
|
@ -102,36 +102,36 @@ export default async function Footer() {
|
|||
</div>
|
||||
)}
|
||||
<div className="flex flex-col gap-y-2">
|
||||
<span className="txt-small-plus txt-ui-fg-base">Medusa</span>
|
||||
<span className="txt-small-plus txt-ui-fg-base">Social</span>
|
||||
<ul className="grid grid-cols-1 gap-y-2 text-ui-fg-subtle txt-small">
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/medusajs"
|
||||
href="https://snapchat.com/spacecitysus"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="hover:text-ui-fg-base"
|
||||
>
|
||||
GitHub
|
||||
Snapchat
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://docs.medusajs.com"
|
||||
href="https://instagram.com/spacecitysus"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="hover:text-ui-fg-base"
|
||||
>
|
||||
Documentation
|
||||
Instagram
|
||||
</a>
|
||||
</li>
|
||||
<li>
|
||||
<a
|
||||
href="https://github.com/medusajs/nextjs-starter-medusa"
|
||||
href="https://threads.net/spacecitysus"
|
||||
target="_blank"
|
||||
rel="noreferrer"
|
||||
className="hover:text-ui-fg-base"
|
||||
>
|
||||
Source code
|
||||
Threads
|
||||
</a>
|
||||
</li>
|
||||
</ul>
|
||||
|
@ -140,7 +140,7 @@ export default async function Footer() {
|
|||
</div>
|
||||
<div className="flex w-full mb-16 justify-between text-ui-fg-muted">
|
||||
<Text className="txt-compact-small">
|
||||
© {new Date().getFullYear()} Medusa Store. All rights reserved.
|
||||
© {new Date().getFullYear()} Space City Sustenance. All rights reserved.
|
||||
</Text>
|
||||
<MedusaCTA />
|
||||
</div>
|
||||
|
|
|
@ -4,7 +4,6 @@ import { Suspense } from "react"
|
|||
import { listRegions } from "@lib/data"
|
||||
import LocalizedClientLink from "@modules/common/components/localized-client-link"
|
||||
import CartButton from "@modules/layout/components/cart-button"
|
||||
import SideMenu from "@modules/layout/components/side-menu"
|
||||
|
||||
export default async function Nav() {
|
||||
const regions = await listRegions().then((regions) => regions)
|
||||
|
@ -15,7 +14,12 @@ export default async function Nav() {
|
|||
<nav className="content-container txt-xsmall-plus text-ui-fg-subtle flex items-center justify-between w-full h-full text-small-regular">
|
||||
<div className="flex-1 basis-0 h-full flex items-center">
|
||||
<div className="h-full">
|
||||
<SideMenu regions={regions} />
|
||||
<LocalizedClientLink
|
||||
className="hover:text-ui-fg-base"
|
||||
href="/store"
|
||||
>
|
||||
Menu
|
||||
</LocalizedClientLink>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
@ -24,7 +28,7 @@ export default async function Nav() {
|
|||
href="/"
|
||||
className="txt-compact-xlarge-plus hover:text-ui-fg-base uppercase"
|
||||
>
|
||||
Medusa Store
|
||||
Space City Sustenance
|
||||
</LocalizedClientLink>
|
||||
</div>
|
||||
|
||||
|
|
|
@ -6,16 +6,11 @@ const Help = () => {
|
|||
return (
|
||||
<div className="mt-6">
|
||||
<Heading className="text-base-semi">Need help?</Heading>
|
||||
<div className="text-base-regular my-2">
|
||||
<div className="text-base-regular my-1">
|
||||
<ul className="gap-y-2 flex flex-col">
|
||||
<li>
|
||||
<LocalizedClientLink href="/contact">Contact</LocalizedClientLink>
|
||||
</li>
|
||||
<li>
|
||||
<LocalizedClientLink href="/contact">
|
||||
Returns & Exchanges
|
||||
</LocalizedClientLink>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -36,7 +36,7 @@ const OrderSummary = ({ order }: OrderSummaryProps) => {
|
|||
</div>
|
||||
)}
|
||||
<div className="flex items-center justify-between">
|
||||
<span>Shipping</span>
|
||||
<span>Delivery</span>
|
||||
<span>{getAmount(order.shipping_total)}</span>
|
||||
</div>
|
||||
<div className="flex items-center justify-between">
|
||||
|
|
|
@ -17,7 +17,7 @@ const ShippingDetails = ({ order }: ShippingDetailsProps) => {
|
|||
<div className="flex items-start gap-x-8">
|
||||
<div className="flex flex-col w-1/3">
|
||||
<Text className="txt-medium-plus text-ui-fg-base mb-1">
|
||||
Shipping Address
|
||||
Delivery Address
|
||||
</Text>
|
||||
<Text className="txt-medium text-ui-fg-subtle">
|
||||
{order.shipping_address.first_name}{" "}
|
||||
|
|
|
@ -19,7 +19,7 @@ const ProductTabs = ({ product }: ProductTabsProps) => {
|
|||
component: <ProductInfoTab product={product} />,
|
||||
},
|
||||
{
|
||||
label: "Shipping & Returns",
|
||||
label: "Delivery",
|
||||
component: <ShippingInfoTab />,
|
||||
},
|
||||
]
|
||||
|
@ -48,16 +48,8 @@ const ProductInfoTab = ({ product }: ProductTabsProps) => {
|
|||
<div className="grid grid-cols-2 gap-x-8">
|
||||
<div className="flex flex-col gap-y-4">
|
||||
<div>
|
||||
<span className="font-semibold">Material</span>
|
||||
<p>{product.material ? product.material : "-"}</p>
|
||||
</div>
|
||||
<div>
|
||||
<span className="font-semibold">Country of origin</span>
|
||||
<p>{product.origin_country ? product.origin_country : "-"}</p>
|
||||
</div>
|
||||
<div>
|
||||
<span className="font-semibold">Type</span>
|
||||
<p>{product.type ? product.type.value : "-"}</p>
|
||||
<span className="font-semibold">Calories</span>
|
||||
<p>{product.calories ? product.calories : "idk"}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-col gap-y-4">
|
||||
|
@ -65,14 +57,6 @@ const ProductInfoTab = ({ product }: ProductTabsProps) => {
|
|||
<span className="font-semibold">Weight</span>
|
||||
<p>{product.weight ? `${product.weight} g` : "-"}</p>
|
||||
</div>
|
||||
<div>
|
||||
<span className="font-semibold">Dimensions</span>
|
||||
<p>
|
||||
{product.length && product.width && product.height
|
||||
? `${product.length}L x ${product.width}W x ${product.height}H`
|
||||
: "-"}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{product.tags?.length ? (
|
||||
|
@ -91,31 +75,11 @@ const ShippingInfoTab = () => {
|
|||
<div className="flex items-start gap-x-2">
|
||||
<FastDelivery />
|
||||
<div>
|
||||
<span className="font-semibold">Fast delivery</span>
|
||||
<span className="font-semibold">Speedy delivery</span>
|
||||
<p className="max-w-sm">
|
||||
Your package will arrive in 3-5 business days at your pick up
|
||||
location or in the comfort of your home.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-start gap-x-2">
|
||||
<Refresh />
|
||||
<div>
|
||||
<span className="font-semibold">Simple exchanges</span>
|
||||
<p className="max-w-sm">
|
||||
Is the fit not quite right? No worries - we'll exchange your
|
||||
product for a new one.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex items-start gap-x-2">
|
||||
<Back />
|
||||
<div>
|
||||
<span className="font-semibold">Easy returns</span>
|
||||
<p className="max-w-sm">
|
||||
Just return your product and we'll refund your money. No
|
||||
questions asked – we'll do our best to make sure your return
|
||||
is hassle-free.
|
||||
Your food will arrive at the soonest possible point between
|
||||
11am-3pm. We dispatch orders based on position in queue, grouping
|
||||
nearby deliveries together.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -22,7 +22,7 @@ const StoreTemplate = ({
|
|||
<RefinementList sortBy={sortBy || "created_at"} />
|
||||
<div className="w-full">
|
||||
<div className="mb-8 text-2xl-semi">
|
||||
<h1>All products</h1>
|
||||
<h1>All plates</h1>
|
||||
</div>
|
||||
<Suspense fallback={<SkeletonProductGrid />}>
|
||||
<PaginatedProducts
|
||||
|
|
Loading…
Reference in a new issue