tanshu/kakawa
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Almost all content on home page

Browse Source
This commit is contained in:
Amritanshu Agrawal 2024-09-23 23:05:32 +05:30
parent 322c92982d
commit fc237d8b9f
30 changed files with 699 additions and 376 deletions

23
.eslintrc.json

@ -1,3 +1,24 @@
{
"extends": ["next/core-web-vitals", "next/typescript"]
"extends": [
"next/core-web-vitals",
"next/typescript",
"eslint:recommended",
"plugin:react/recommended",
"prettier"
],
"plugins": ["prettier"],
"rules": {
"prettier/prettier": "error",
"react/no-unescaped-entities": "error",
"react/react-in-jsx-scope": "off"
},
"env": {
"browser": true,
"node": true
},
"settings": {
"react": {
"version": "detect"
}
}
}

5
.prettierrc Normal file

@ -0,0 +1,5 @@
{
"semi": true,
"singleQuote": true,
"jsxSingleQuote": true
}

5
next.config.mjs

@ -1,4 +1,7 @@
/** @type {import('next').NextConfig} */
const nextConfig = {};
const nextConfig = {
output: 'export',
images: { unoptimized: true },
};
export default nextConfig;

15
package.json

@ -9,18 +9,23 @@
"lint": "next lint"
},
"dependencies": {
"next": "14.2.13",
"react": "^18",
"react-dom": "^18",
"next": "14.2.13"
"sharp": "^0.33.5",
"swiper": "^11.1.14"
},
"devDependencies": {
"typescript": "^5",
"@types/node": "^20",
"@types/react": "^18",
"@types/react-dom": "^18",
"postcss": "^8",
"tailwindcss": "^3.4.1",
"eslint": "^8",
"eslint-config-next": "14.2.13"
"eslint-config-next": "14.2.13",
"eslint-config-prettier": "^9.1.0",
"eslint-plugin-prettier": "^5.2.1",
"postcss": "^8",
"prettier": "^3.3.3",
"tailwindcss": "^3.4.1",
"typescript": "^5"
}
}

BIN
public/images/categories/barks.jpg Normal file

Binary file not shown.
Side by Side

After

(image error) Size: 418 KiB

BIN
public/images/categories/bars.jpg Normal file

Binary file not shown.
Side by Side

After

(image error) Size: 1.5 MiB

BIN
public/images/categories/dragees.jpg Normal file

Binary file not shown.
Side by Side

After

(image error) Size: 887 KiB

BIN
public/images/categories/gelatos.jpg Normal file

Binary file not shown.
Side by Side

After

(image error) Size: 482 KiB

BIN
public/images/categories/pralines.jpg Normal file

Binary file not shown.
Side by Side

After

(image error) Size: 341 KiB

BIN
public/images/categories/spreads.jpg Normal file

Binary file not shown.
Side by Side

After

(image error) Size: 520 KiB

BIN
public/images/collections/bestsellers.jpg Normal file

Binary file not shown.
Side by Side

After

(image error) Size: 587 KiB

BIN
public/images/collections/gifting.jpg Normal file

Binary file not shown.
Side by Side

After

(image error) Size: 454 KiB

BIN
public/images/collections/new-arrivals.jpg Normal file

Binary file not shown.
Side by Side

After

(image error) Size: 776 KiB

19
src/app/about-us/page.tsx

@ -1,10 +1,11 @@
export default function AboutUsPage() {
return (
<div className="p-8">
<h1 className="text-4xl font-bold">About Us</h1>
<p className="mt-4 text-lg">
Kakawa is a fictional company that delivers high-quality content through modern web technologies.
</p>
</div>
);
}
return (
<div className='p-8'>
<h1 className='text-4xl font-bold'>About Us</h1>
<p className='mt-4 text-lg'>
Kakawa is a fictional company that delivers high-quality content through
modern web technologies.
</p>
</div>
);
}

2
src/app/globalicons.css

@ -1 +1 @@
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200');

15
src/app/globals.css

@ -26,7 +26,6 @@ body {
}
}
body {
margin: 0;
margin-top: 8em;
@ -51,7 +50,7 @@ body {
z-index: 1000;
}
.navbar a {
.navbar a {
color: black;
text-decoration: none;
margin: 0 0.5em;
@ -62,7 +61,8 @@ body {
color: #555;
}
.left, .right {
.left,
.right {
display: flex;
align-items: center;
}
@ -81,7 +81,8 @@ body {
height: 50px; /* Adjust the logo size as needed */
}
.fa-search, .fa-user {
.fa-search,
.fa-user {
font-size: 1.2em;
}
@ -109,11 +110,11 @@ body {
border-radius: 25px; /* Makes the corners more rounded */
}
.navbar a {
font-size: 1.1em;
}
.fa-search, .fa-user {
.fa-search,
.fa-user {
font-size: 1.4em;
}
}

8
src/app/layout.tsx

@ -1,13 +1,13 @@
import './globals.css';
import './globalicons.css'
import './globalicons.css';
import { ReactNode } from 'react';
import Navbar from '../components/navbar';
import Footer from '../components/footer'
import Footer from '../components/footer';
export default function RootLayout({ children }: { children: ReactNode }) {
return (
<html lang="en">
<html lang='en'>
<body>
<Navbar />
<main>{children}</main>
@ -15,4 +15,4 @@ export default function RootLayout({ children }: { children: ReactNode }) {
</body>
</html>
);
}
}

99
src/app/page.tsx

@ -1,52 +1,85 @@
import Image from 'next/image'
import brandStoryPic from '/public/images/homepage/brand-story.jpg'
import Image from 'next/image';
import brandStoryPic from '/public/images/homepage/brand-story.jpg';
import { HomepageVideo } from '@/components/homepage-video';
import { HeroSwiper } from '@/components/swiper';
import { Collections } from '@/components/our-collection';
import { ChocolateCategories } from '@/components/category-slider';
export default function HomePage() {
return (
<div className="overflow-x-hidden">
<div className='overflow-x-hidden'>
<HeroSwiper />
{/* First Two-Column Layout */}
<section className="flex flex-col md:flex-row items-center">
<section className='flex flex-col md:flex-row items-center'>
{/* Left Column - Text with Header */}
<div className="w-full md:w-1/2">
<h1 className="text-4xl font-bold">
Brand Story
</h1>
<p className="text-base">
Mozimo's journey is a passionate pursuit of crafting exceptional chocolate that celebrates the origin of each cocoa bean.
</p>
<p className="text-base">
We meticulously roast, crack, winnow, and refine beans in-house, using modern techniques to highlight their natural flavors.
</p>
<p className="text-base">
Each chocolate is a masterpiece, capturing the essence of cocoa in its purest form.
</p>
<div className='w-full md:w-1/2'>
<div className='m-8 space-y-10'>
<h1 className='text-6xl font-normal text-justify font-sans'>
Brand Story
</h1>
<p className='text-xl font-light'>
Mozimo&apos;s journey is a passionate pursuit of crafting
exceptional chocolate that celebrates the origin of each cocoa
bean.
</p>
<p className='text-xl font-light text-justify'>
We meticulously roast, crack, winnow, and refine beans in-house,
using modern techniques to highlight their natural flavors.
</p>
<p className='text-xl font-light text-justify'>
Each chocolate is a masterpiece, capturing the essence of cocoa in
its purest form.
</p>
</div>
</div>
{/* Right Column - Image */}
<div className="w-full md:w-1/2">
<Image src={brandStoryPic} alt="Right Side Image" layout='responsive' className="w-full h-auto" />
<div className='w-full md:w-1/2'>
<Image
src={brandStoryPic}
alt='Right Side Image'
layout='responsive'
className='w-full h-auto'
/>
</div>
</section>
{/* Second Two-Column Layout (Video and Text) */}
<section className="flex flex-col md:flex-row items-center">
<section className='flex flex-col md:flex-row items-center'>
{/* Left Column - Video */}
<div className="w-full md:w-1/2">
<div className="aspect-w-16 aspect-h-9">
<div className='w-full md:w-1/2'>
<div className='aspect-w-16 aspect-h-9'>
<HomepageVideo />
</div>
</div>
{/* Right Column - Text */}
<div className="w-full md:w-1/2">
<h2 className="text-3xl font-bold">
Discover the delicate art of our
</h2>
<h3 className="text-3xl font-bold"> Chocolate Tempering</h3>
<p className="text-base">
Crafted to perfection Mozimo delivers a sublime sensory experience with every bite. Experience the epitome of indulgence with our perfectly tempered chocolate: velvety smooth, exquisitely rich, and artfully balanced. Each bite offers a symphony of nuanced cocoa flavors, melting luxuriously! </p>
<div className='w-full md:w-1/2'>
<div className='m-8 space-y-10'>
<h2 className='text-6xl font-bold'>
Discover the delicate art of our
</h2>
<h3 className='text-3xl font-bold'> Chocolate Tempering</h3>
<p className='text-xl'>
Crafted to perfection Mozimo delivers a sublime sensory experience
with every bite. Experience the epitome of indulgence with our
perfectly tempered chocolate: velvety smooth, exquisitely rich,
and artfully balanced. Each bite offers a symphony of nuanced
cocoa flavors, melting luxuriously!{' '}
</p>
</div>
</div>
</section>
</div>
</section>
{/* Third Layout (Our Collections) */}
<section className='flex flex-col md:flex-row'>
<div className='bg-[#f9f6f5] w-full text-6xl font-normal font-sans text-center'>
Our Collections
</div>
</section>
{/* Fourth Three-Column Layout (Collections) */}
<section className='flex flex-col md:flex-row items-center "bg-[#f9f6f5] py-12 px-4 sm:px-6 lg:px-8"'>
<Collections />
</section>
{/* Fifth Layout (Categories) */}
<ChocolateCategories />
</div>
);
}
}

304
src/app/privacy-policy/page.tsx

@ -1,170 +1,192 @@
export default function TermsPage() {
return (
<div className="p-8">
<h1 className="text-4xl font-bold">Privacy Policy</h1>
<p className="mt-4 text-base">
Mozimo.in recognizes the importance of maintaining your privacy. We value your privacy and appreciate your trust in us. This Policy describes how we treat user information we collect on http://www.mozimo.in and other offline sources. This Privacy Policy applies to current and former visitors to our website and to our online customers. By visiting and/or using our website, you agree to this Privacy Policy.
</p>
<p className="mt-4 text-base font-bold">
Information We Collect
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Contact Information:</span> We may collect your name, email, mobile number, phone number, street, city, state, pincode, country, and IP address.
</p>
return (
<div className='p-8'>
<h1 className='text-4xl font-bold'>Privacy Policy</h1>
<p className='mt-4 text-base'>
Mozimo.in recognizes the importance of maintaining your privacy. We
value your privacy and appreciate your trust in us. This Policy
describes how we treat user information we collect on
http://www.mozimo.in and other offline sources. This Privacy Policy
applies to current and former visitors to our website and to our online
customers. By visiting and/or using our website, you agree to this
Privacy Policy.
</p>
<p className='mt-4 text-base font-bold'>Information We Collect</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Contact Information:</span> We may collect
your name, email, mobile number, phone number, street, city, state,
pincode, country, and IP address.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Payment and Billing Information:</span> We may collect your billing name, billing address, and payment method when you make a purchase. We NEVER collect your credit card number, credit card expiry date, or other credit card details on our website. Credit card information will be processed by our secure online payment partner.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Payment and Billing Information:</span> We
may collect your billing name, billing address, and payment method when
you make a purchase. We NEVER collect your credit card number, credit
card expiry date, or other credit card details on our website. Credit
card information will be processed by our secure online payment partner.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Information You Post:</span> We collect information you post in a public space on our website or on a third-party social media site related to Mozimo.in.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Information You Post:</span> We collect
information you post in a public space on our website or on a
third-party social media site related to Mozimo.in.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Demographic Information:</span> We may collect demographic information about you, including products you like, products you intend to purchase, and products you buy. This may be collected through surveys or other means.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Demographic Information:</span> We may
collect demographic information about you, including products you like,
products you intend to purchase, and products you buy. This may be
collected through surveys or other means.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Other Information:</span> We may collect information about your IP address, the browser you're using, the website you came from, duration of time spent on our website, pages accessed, or the website you visit when you leave us. We might also collect information about your mobile device or the version of the operating system you are using.
How We Collect Information
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Other Information:</span> We may collect
information about your IP address, the browser you&apos;re using, the
website you came from, duration of time spent on our website, pages
accessed, or the website you visit when you leave us. We might also
collect information about your mobile device or the version of the
operating system you are using. How We Collect Information
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Direct Collection:</span> We collect information directly from you when you register on our website, make purchases, post comments or queries, or contact us via phone or email.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Direct Collection:</span> We collect
information directly from you when you register on our website, make
purchases, post comments or queries, or contact us via phone or email.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Passive Collection:</span> We use tracking tools like Google Analytics, cookies, and web beacons to collect information about your usage of our website.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Passive Collection:</span> We use tracking
tools like Google Analytics, cookies, and web beacons to collect
information about your usage of our website.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Third-Party Sources:</span> We may receive information from third parties, such as social media sites if you use integrated social media features on our website.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Third-Party Sources:</span> We may receive
information from third parties, such as social media sites if you use
integrated social media features on our website.
</p>
<p className="mt-4 text-lg font-bold">
Use of Your Personal Information
</p>
<p className='mt-4 text-lg font-bold'>Use of Your Personal Information</p>
<p className="mt-4 text-base">
<span className="font-bold">
Contact You:</span> We may use your information to contact you for purchase confirmations or promotional purposes.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Contact You:</span> We may use your
information to contact you for purchase confirmations or promotional
purposes.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Respond to Requests:</span> We may use your information to confirm purchases or respond to queries.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Respond to Requests:</span> We may use your
information to confirm purchases or respond to queries.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Improve Products and Services:</span> We may use your information to customize your experience and improve our offerings.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Improve Products and Services:</span> We may
use your information to customize your experience and improve our
offerings.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Site Trends and Customer Interests:</span> We may analyze your information to enhance our website and products.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Site Trends and Customer Interests:</span>{' '}
We may analyze your information to enhance our website and products.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Security:</span> We may use your information to protect our company, customers, or website.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Security:</span> We may use your information
to protect our company, customers, or website.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Marketing:</span> We may send information about special promotions, offers, new features, or products. If you make a purchase, you may be enrolled in our newsletter.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Marketing:</span> We may send information
about special promotions, offers, new features, or products. If you make
a purchase, you may be enrolled in our newsletter.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Transactional Communications:</span> We may send you emails or SMS regarding your account or purchases.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Transactional Communications:</span> We may
send you emails or SMS regarding your account or purchases.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Legal Compliance:</span> We use information as otherwise permitted by law.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Legal Compliance:</span> We use information
as otherwise permitted by law.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Cookies and Web Beacons
</span>
Like many websites, Mozimo.in uses 'cookies' to store information about visitors' preferences and pages visited. This helps us customize your experience based on browser type and other information.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Cookies and Web Beacons</span>
Like many websites, Mozimo.in uses &apos;cookies&apos; to store
information about visitors&apos; preferences and pages visited. This
helps us customize your experience based on browser type and other
information.
</p>
<p className="mt-4 text-lg font-bold">
Sharing of Information with Third Parties
</p>
<p className='mt-4 text-lg font-bold'>
Sharing of Information with Third Parties
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Service Providers:</span> We share information with third parties who perform services on our behalf, such as payment processors, delivery services, or transactional message processors. Some vendors may be located outside of India.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Service Providers:</span> We share
information with third parties who perform services on our behalf, such
as payment processors, delivery services, or transactional message
processors. Some vendors may be located outside of India.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Legal Compliance:</span> We may share information to comply with legal obligations or protect ourselves, such as in response to court orders or government requests.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Legal Compliance:</span> We may share
information to comply with legal obligations or protect ourselves, such
as in response to court orders or government requests.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Business Transfers:</span> If our business is sold or transferred, customer information may be part of the transaction.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Business Transfers:</span> If our business
is sold or transferred, customer information may be part of the
transaction.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Other Sharing:</span> We may share information for reasons not described in this policy, with prior notice to you.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Other Sharing:</span> We may share
information for reasons not described in this policy, with prior notice
to you.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Email Opt-Out:
</span>
You can opt out of receiving our marketing emails by emailing <a href="info@mozimo.in" />. Please allow up to ten days for processing. Even if you opt out of marketing emails, we will continue to send transactional messages related to your purchases.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Email Opt-Out:</span>
You can opt out of receiving our marketing emails by emailing{' '}
<a href='info@mozimo.in' />. Please allow up to ten days for processing.
Even if you opt out of marketing emails, we will continue to send
transactional messages related to your purchases.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Third-Party Sites
</span> We do not offer third-party products or services on our website.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Third-Party Sites</span> We do not offer
third-party products or services on our website.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Grievance Officer
</span> In accordance with the Information Technology Act 2000 and associated rules, the Grievance Officer’s contact details are as follows:
[Your Address Here]
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Grievance Officer</span> In accordance with
the Information Technology Act 2000 and associated rules, the Grievance
Officer&apos;s contact details are as follows: [Your Address Here]
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Email: info@mozimo.in
</span>
For questions about this Policy or other privacy concerns, you can also email us at info@mozimo.in.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Email: info@mozimo.in</span>
For questions about this Policy or other privacy concerns, you can also
email us at info@mozimo.in.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Updates to This Policy
</span>
This Privacy Policy was last updated on 05.09.24. We may change our privacy practices from time to time and will notify you of any material changes as required by law. Updated policies will be posted on our website. Please check our site periodically for updates.
</p>
<p className='mt-4 text-base'>
<span className='font-bold'>Updates to This Policy</span>
This Privacy Policy was last updated on 05.09.24. We may change our
privacy practices from time to time and will notify you of any material
changes as required by law. Updated policies will be posted on our
website. Please check our site periodically for updates.
</p>
<p className="mt-4 text-base">
<span className="font-bold">
Jurisdiction
</span>
By visiting our website, any disputes over privacy are subject to this Policy and the website's terms of use. Disputes arising under this Policy shall be governed by the laws of India.
</p>
</div>
);
}
<p className='mt-4 text-base'>
<span className='font-bold'>Jurisdiction</span>
By visiting our website, any disputes over privacy are subject to this
Policy and the website&apos;s terms of use. Disputes arising under this
Policy shall be governed by the laws of India.
</p>
</div>
);
}

233
src/app/terms/page.tsx

@ -1,90 +1,145 @@
export default function TermsPage() {
return (
<div className="p-8">
<h1 className="text-4xl font-bold">Terms and Conditions</h1>
<p className="mt-4 text-lg">
PLEASE READ THIS TERMS OF SERVICE AGREEMENT CAREFULLY. BY USING THIS WEBSITE OR ORDERING PRODUCTS FROM THIS WEBSITE, YOU AGREE TO BE BOUND BY ALL OF THE TERMS AND CONDITIONS OF THIS AGREEMENT.
</p>
<p className="mt-4 text-base">
This Terms of Service Agreement (the "Agreement") governs your use of this website, Mozimo.in (the "Website"), and Mozimo's offer of products for purchase on this Website. This Agreement includes and incorporates by reference the policies and guidelines referenced below. Mozimo reserves the right to change or revise the terms and conditions of this Agreement at any time by posting any changes or a revised Agreement on this Website. Mozimo will notify you of changes or revisions by indicating the date on the top of this Agreement. The revised Agreement will be effective immediately after it is posted on this Website. Your use of the Website following any changes or a revised Agreement will constitute your acceptance of those changes or revisions. Mozimo encourages you to review this Agreement whenever you visit the Website to ensure you understand the terms and conditions governing its use. This Agreement does not alter any terms or conditions of any other written agreement you may have with Mozimo for other products or services. If you do not agree to this Agreement (including any referenced policies or guidelines), please immediately discontinue your use of the Website. To print this Agreement, click the print button on your browser toolbar.
</p>
<p className="mt-4 text-base">
Understanding Expiry and Best Before Dates:
Our products are carefully crafted and may be shipped in conditions to preserve their quality. The shelf life printed on the packaging refers to the product’s life when shipped. Upon arrival at our local stores, products may be defrosted, and the expiry date of defrosted products will be indicated on the label sticker on each box. Please refer to this expiry date when purchasing products.
</p>
<p className="mt-4 text-lg">
I. PRODUCTS
</p>
<p className="mt-4 text-base">
Terms of Offer: This Website offers certain products (the "Products") for sale. By placing an order through this Website, you agree to the terms set forth in this Agreement.
Customer Solicitation: Unless you inform our representatives otherwise, you agree to continue receiving emails and call solicitations from Mozimo and its designated teams.
Opt-Out Procedure: To opt out of future solicitations, you can:
Use the opt-out link found in any email solicitation.
Send your email address to info@moizmo.in.
Proprietary Rights: Mozimo has proprietary rights and trade secrets in the distribution of its Products. You may not copy, reproduce, resell, or redistribute any Product manufactured or distributed by Mozimo. Mozimo also owns all trademarks and trade dress, including the layout of this webpage.
Goods and Service Tax (GST): If you purchase Products, you will be responsible for any applicable taxes.
</p>
<p className="mt-4 text-lg">
II. WEBSITE
</p>
<p className="mt-4 text-base">
Content; Intellectual Property; Third-Party Links: This Website provides information and marketing materials, some of which may be gathered from other sources. Content created by Mozimo is protected by intellectual property laws. Unauthorized use may violate copyright or trademark laws. You use the content for personal, non-commercial purposes. Links to third-party websites are provided for convenience only, and Mozimo does not endorse or assume responsibility for their content.
Use of Website: You will use the Website legally and responsibly, and will not interfere with others' use, engage in spam, or disrupt other users.
License: You are granted a limited, non-exclusive, non-transferable right to use the Website content for personal, non-commercial use. Unauthorized copying or distribution is prohibited.
Posting: By posting content on the Website, you grant Mozimo a perpetual, worldwide, non-exclusive, royalty-free license to use and distribute that content. Mozimo is not responsible for user-generated content or interactions between users.
Your Consent: By registering with us, you consent to the collection, processing, storing, handling, and disclosure of your information as detailed in our privacy policy, which complies with Indian data protection laws.
Alerts: We may contact you via email or phone to inform you about new products and offerings.
User Communications: Communications sent to us may be retained to process inquiries and improve our services.
</p>
<p className="mt-4 text-lg">
III. DISCLAIMER OF WARRANTIES
</p>
<p className="mt-4 text-base normal-case">
Your use of the website and products is at your own risk. The website and products are offered on an "as is" and "as available" basis. Mozimo disclaims all warranties, express or implied, including implied warranties of merchantability, fitness for a particular purpose, and non-infringement.
</p>
<p className="mt-4 text-lg">
IV. LIMITATION OF LIABILITY
</p>
<p className="mt-4 text-base">
Mozimo’s liability is limited to the amount you paid for products purchased through the website. Mozimo will not be liable for any direct, indirect, incidental, special, or consequential damages.
</p>
<p className="mt-4 text-lg uppercase">
V. INDEMNIFICATION
</p>
<p className="mt-4 text-base">
You agree to indemnify and hold harmless Mozimo, its contractors, agents, and affiliates from any claims, damages, costs, or expenses arising out of your breach of this Agreement or use of the Website or Products. Mozimo may participate in the defense of any third-party claims at its own expense.
</p>
<p className="mt-4 text-lg">
VI. PRIVACY
</p>
<p className="mt-4 text-base">
Mozimo is committed to protecting user privacy. Refer to our privacy policy for details on how we handle your data.
</p>
<p className="mt-4 text-lg">
VII. AGREEMENT TO BE BOUND
</p>
<p className="mt-4 text-base">
By using this Website or ordering Products, you acknowledge that you have read and agree to this Agreement and all terms and conditions on this Website.
</p>
<p className="mt-4 text-lg">
VIII. GENERAL
</p>
<p className="mt-4 text-base">
Force Majeure: Mozimo will not be liable for any delays or interruptions caused by events beyond its control, such as natural disasters or acts of war.
</p>
<p className="mt-4 text-base">
Cessation of Operation: Mozimo may cease operation of the Website and distribution of Products at its discretion.
Entire Agreement: This Agreement constitutes the entire agreement between you and Mozimo and supersedes any prior agreements.
Effect of Waiver: Failure to enforce any provision of this Agreement does not constitute a waiver. If any provision is found invalid, the remaining provisions will remain in effect.
Governing Law; Jurisdiction: This Agreement is governed by the laws of Maharashtra, India. Disputes will be resolved in courts located in Maharashtra.
Statute of Limitation: Claims must be filed within one year of the cause of action or be barred.
Waiver of Class Action Rights: You waive any right to join claims with others in a class action. Claims must be asserted individually.
Termination: Mozimo may terminate your access to the Website if you breach this Agreement, and may cancel any outstanding orders.
Domestic Use: Mozimo makes no representation that the Website or Products are appropriate for use outside India. Users outside India are responsible for compliance with local laws.
Assignment: You may not assign your rights under this Agreement. Mozimo may assign its rights and obligations without notice.
By using this website or ordering products from this website, you agree to be bound by all of the terms and conditions of this agreement.
</p>
</div>
);
}
return (
<div className='p-8'>
<h1 className='text-4xl font-bold'>Terms and Conditions</h1>
<p className='mt-4 text-lg'>
PLEASE READ THIS TERMS OF SERVICE AGREEMENT CAREFULLY. BY USING THIS
WEBSITE OR ORDERING PRODUCTS FROM THIS WEBSITE, YOU AGREE TO BE BOUND BY
ALL OF THE TERMS AND CONDITIONS OF THIS AGREEMENT.
</p>
<p className='mt-4 text-base'>
This Terms of Service Agreement (the &quot;Agreement&quot;) governs your
use of this website, Mozimo.in (the &quot;Website&quot;), and
Mozimo&apos;s offer of products for purchase on this Website. This
Agreement includes and incorporates by reference the policies and
guidelines referenced below. Mozimo reserves the right to change or
revise the terms and conditions of this Agreement at any time by posting
any changes or a revised Agreement on this Website. Mozimo will notify
you of changes or revisions by indicating the date on the top of this
Agreement. The revised Agreement will be effective immediately after it
is posted on this Website. Your use of the Website following any changes
or a revised Agreement will constitute your acceptance of those changes
or revisions. Mozimo encourages you to review this Agreement whenever
you visit the Website to ensure you understand the terms and conditions
governing its use. This Agreement does not alter any terms or conditions
of any other written agreement you may have with Mozimo for other
products or services. If you do not agree to this Agreement (including
any referenced policies or guidelines), please immediately discontinue
your use of the Website. To print this Agreement, click the print button
on your browser toolbar.
</p>
<p className='mt-4 text-base'>
Understanding Expiry and Best Before Dates: Our products are carefully
crafted and may be shipped in conditions to preserve their quality. The
shelf life printed on the packaging refers to the product’s life when
shipped. Upon arrival at our local stores, products may be defrosted,
and the expiry date of defrosted products will be indicated on the label
sticker on each box. Please refer to this expiry date when purchasing
products.
</p>
<p className='mt-4 text-lg'>I. PRODUCTS</p>
<p className='mt-4 text-base'>
Terms of Offer: This Website offers certain products (the
&quot;Products&quot;) for sale. By placing an order through this
Website, you agree to the terms set forth in this Agreement. Customer
Solicitation: Unless you inform our representatives otherwise, you agree
to continue receiving emails and call solicitations from Mozimo and its
designated teams. Opt-Out Procedure: To opt out of future solicitations,
you can: Use the opt-out link found in any email solicitation. Send your
email address to info@moizmo.in. Proprietary Rights: Mozimo has
proprietary rights and trade secrets in the distribution of its
Products. You may not copy, reproduce, resell, or redistribute any
Product manufactured or distributed by Mozimo. Mozimo also owns all
trademarks and trade dress, including the layout of this webpage. Goods
and Service Tax (GST): If you purchase Products, you will be responsible
for any applicable taxes.
</p>
<p className='mt-4 text-lg'>II. WEBSITE</p>
<p className='mt-4 text-base'>
Content; Intellectual Property; Third-Party Links: This Website provides
information and marketing materials, some of which may be gathered from
other sources. Content created by Mozimo is protected by intellectual
property laws. Unauthorized use may violate copyright or trademark laws.
You use the content for personal, non-commercial purposes. Links to
third-party websites are provided for convenience only, and Mozimo does
not endorse or assume responsibility for their content. Use of Website:
You will use the Website legally and responsibly, and will not interfere
with others&apos; use, engage in spam, or disrupt other users. License:
You are granted a limited, non-exclusive, non-transferable right to use
the Website content for personal, non-commercial use. Unauthorized
copying or distribution is prohibited. Posting: By posting content on
the Website, you grant Mozimo a perpetual, worldwide, non-exclusive,
royalty-free license to use and distribute that content. Mozimo is not
responsible for user-generated content or interactions between users.
Your Consent: By registering with us, you consent to the collection,
processing, storing, handling, and disclosure of your information as
detailed in our privacy policy, which complies with Indian data
protection laws. Alerts: We may contact you via email or phone to inform
you about new products and offerings. User Communications:
Communications sent to us may be retained to process inquiries and
improve our services.
</p>
<p className='mt-4 text-lg'>III. DISCLAIMER OF WARRANTIES</p>
<p className='mt-4 text-base normal-case'>
Your use of the website and products is at your own risk. The website
and products are offered on an &quot;as is&quot; and &quot;as
available&quot; basis. Mozimo disclaims all warranties, express or
implied, including implied warranties of merchantability, fitness for a
particular purpose, and non-infringement.
</p>
<p className='mt-4 text-lg'>IV. LIMITATION OF LIABILITY</p>
<p className='mt-4 text-base'>
Mozimo’s liability is limited to the amount you paid for products
purchased through the website. Mozimo will not be liable for any direct,
indirect, incidental, special, or consequential damages.
</p>
<p className='mt-4 text-lg uppercase'>V. INDEMNIFICATION</p>
<p className='mt-4 text-base'>
You agree to indemnify and hold harmless Mozimo, its contractors,
agents, and affiliates from any claims, damages, costs, or expenses
arising out of your breach of this Agreement or use of the Website or
Products. Mozimo may participate in the defense of any third-party
claims at its own expense.
</p>
<p className='mt-4 text-lg'>VI. PRIVACY</p>
<p className='mt-4 text-base'>
Mozimo is committed to protecting user privacy. Refer to our privacy
policy for details on how we handle your data.
</p>
<p className='mt-4 text-lg'>VII. AGREEMENT TO BE BOUND</p>
<p className='mt-4 text-base'>
By using this Website or ordering Products, you acknowledge that you
have read and agree to this Agreement and all terms and conditions on
this Website.
</p>
<p className='mt-4 text-lg'>VIII. GENERAL</p>
<p className='mt-4 text-base'>
Force Majeure: Mozimo will not be liable for any delays or interruptions
caused by events beyond its control, such as natural disasters or acts
of war.
</p>
<p className='mt-4 text-base'>
Cessation of Operation: Mozimo may cease operation of the Website and
distribution of Products at its discretion. Entire Agreement: This
Agreement constitutes the entire agreement between you and Mozimo and
supersedes any prior agreements. Effect of Waiver: Failure to enforce
any provision of this Agreement does not constitute a waiver. If any
provision is found invalid, the remaining provisions will remain in
effect. Governing Law; Jurisdiction: This Agreement is governed by the
laws of Maharashtra, India. Disputes will be resolved in courts located
in Maharashtra. Statute of Limitation: Claims must be filed within one
year of the cause of action or be barred. Waiver of Class Action Rights:
You waive any right to join claims with others in a class action. Claims
must be asserted individually. Termination: Mozimo may terminate your
access to the Website if you breach this Agreement, and may cancel any
outstanding orders. Domestic Use: Mozimo makes no representation that
the Website or Products are appropriate for use outside India. Users
outside India are responsible for compliance with local laws.
Assignment: You may not assign your rights under this Agreement. Mozimo
may assign its rights and obligations without notice. By using this
website or ordering products from this website, you agree to be bound by
all of the terms and conditions of this agreement.
</p>
</div>
);
}

43
src/components/category-slider.tsx Normal file

@ -0,0 +1,43 @@
'use client';
import { useState } from 'react';
import Image from 'next/image';
const categories = [
{ name: 'Bars', image: '/images/categories/bars.jpg' },
{ name: 'Barks', image: '/images/categories/barks.jpg' },
{ name: 'Pralines', image: '/images/categories/pralines.jpg' },
{ name: 'Spreads', image: '/images/categories/spreads.jpg' },
{ name: 'Dragees', image: '/images/categories/dragees.jpg' },
{ name: 'Gelatos', image: '/images/categories/gelatos.jpg' },
];
export function ChocolateCategories() {
const [currentImage, setCurrentImage] = useState(categories[0].image);
return (
<section className='flex flex-col md:flex-row items-center "bg-[#f9f6f5] py-12 px-4 sm:px-6 lg:px-8"'>
{/* Left Side: Categories */}
<ul className='space-y-4 text-[#5a352a] font-serif text-5xl flex flex-col justify-center w-1/2 bg-white text-left pl-10'>
{categories.map((category) => (
<li
key={category.name}
onMouseEnter={() => setCurrentImage(category.image)}
className='hover:text-[#c19a6b] cursor-pointer'
>
{category.name}
</li>
))}
</ul>
{/* Right Side: Image */}
<div className='w-full md:w-1/2'>
<Image
src={currentImage}
alt='Chocolate Category'
width={500}
height={300}
/>
</div>
</section>
);
}

121
src/components/footer.tsx

@ -1,54 +1,69 @@
// components/Footer.js
export default function Footer() {
return (
<footer className="bg-white text-brown-800 py-12">
<div className="max-w-7xl mx-auto grid grid-cols-1 md:grid-cols-4 gap-8 px-4">
return (
<footer className='bg-white text-brown-800 py-12'>
<div className='max-w-7xl mx-auto grid grid-cols-1 md:grid-cols-4 gap-8 px-4'>
{/* First Column: Logo and Description */}
<div className="space-y-4">
<div className="flex items-center">
<div className='space-y-4'>
<div className='flex items-center'>
<img
src="/images/logo.png" // Update with your logo path
alt="Mozimo Logo"
className="h-10"
src='/images/logo.png' // Update with your logo path
alt='Mozimo Logo'
className='h-10'
/>
</div>
<p className="text-sm">India's Premier European style bean-to-bar chocolate experience.</p>
<p className='text-sm'>
India&apos;s Premier European style bean-to-bar chocolate
experience.
</p>
</div>
{/* Second Column: Contact Information */}
<div className="space-y-4">
<h3 className="font-semibold">Get in touch</h3>
<p className="text-sm flex items-center">
<span className="material-symbols-outlined">call</span>
<div className='space-y-4'>
<h3 className='font-semibold'>Get in touch</h3>
<p className='text-sm flex items-center'>
<span className='material-symbols-outlined'>call</span>
0172-4045414
</p>
<p className="text-sm flex items-center">
<span className="material-symbols-outlined">pin_drop</span>
<p className='text-sm flex items-center'>
<span className='material-symbols-outlined'>pin_drop</span>
SCO 8, Inner Market, 9-D, Sector 9, Chandigarh, 160009
</p>
</div>
{/* Third Column: Links */}
<div className="space-y-4">
<h3 className="font-semibold">Know more</h3>
<ul className="space-y-2">
<div className='space-y-4'>
<h3 className='font-semibold'>Know more</h3>
<ul className='space-y-2'>
<li>
<a href="/privacy-policy" className="text-sm text-brown-600 hover:underline">
<a
href='/privacy-policy'
className='text-sm text-brown-600 hover:underline'
>
Privacy Policy
</a>
</li>
<li>
<a href="/refund-policy" className="text-sm text-brown-600 hover:underline">
<a
href='/refund-policy'
className='text-sm text-brown-600 hover:underline'
>
Refund & Return Policy
</a>
</li>
<li>
<a href="/terms" className="text-sm text-brown-600 hover:underline">
<a
href='/terms'
className='text-sm text-brown-600 hover:underline'
>
Terms & Conditions
</a>
</li>
<li>
<a href="/shipping" className="text-sm text-brown-600 hover:underline">
<a
href='/shipping'
className='text-sm text-brown-600 hover:underline'
>
Shipping Policy
</a>
</li>
@ -56,48 +71,66 @@ export default function Footer() {
</div>
{/* Additional Links */}
<div className="space-y-4">
<ul className="space-y-2">
<div className='space-y-4'>
<ul className='space-y-2'>
<li>
<a href="/faq" className="text-sm text-brown-600 hover:underline">
<a href='/faq' className='text-sm text-brown-600 hover:underline'>
FAQ
</a>
</li>
<li>
<a href="/locate" className="text-sm text-brown-600 hover:underline">
<a
href='/locate'
className='text-sm text-brown-600 hover:underline'
>
Locate our Store
</a>
</li>
<li>
<a href="/bulk-ordering" className="text-sm text-brown-600 hover:underline">
<a
href='/bulk-ordering'
className='text-sm text-brown-600 hover:underline'
>
Bulk Ordering
</a>
</li>
</ul>
<h3 className="font-semibold">Find Us On</h3>
<div className="flex space-x-4">
<a href="https://facebook.com" className="text-brown-600 hover:text-brown-800">
<img src="/icons/facebook.svg" />
<h3 className='font-semibold'>Find Us On</h3>
<div className='flex space-x-4'>
<a
href='https://facebook.com'
className='text-brown-600 hover:text-brown-800'
>
<img src='/icons/facebook.svg' />
</a>
<a href="https://instagram.com" className="text-brown-600 hover:text-brown-800">
<img src="/icons/instagram.svg" />
<a
href='https://instagram.com'
className='text-brown-600 hover:text-brown-800'
>
<img src='/icons/instagram.svg' />
</a>
<a href="https://youtube.com" className="text-brown-600 hover:text-brown-800">
<img src="/icons/youtube.svg" />
<a
href='https://youtube.com'
className='text-brown-600 hover:text-brown-800'
>
<img src='/icons/youtube.svg' />
</a>
<a href="https://linkedin.com" className="text-brown-600 hover:text-brown-800">
<img src="/icons/linkedin.svg" />
<a
href='https://linkedin.com'
className='text-brown-600 hover:text-brown-800'
>
<img src='/icons/linkedin.svg' />
</a>
</div>
</div>
</div>
</footer>
);
};
}
// <footer className="bg-gray-800 text-white">
// <div className="container mx-auto px-4 py-6">
// <p>&copy; {new Date().getFullYear()} Kakawa Chocolate Shop. All rights reserved.</p>
// {/* Social media links */}
// </div>
// </footer>
// <footer className="bg-gray-800 text-white">
// <div className="container mx-auto px-4 py-6">
// <p>&copy; {new Date().getFullYear()} Kakawa Chocolate Shop. All rights reserved.</p>
// {/* Social media links */}
// </div>
// </footer>

19
src/components/header.tsx

@ -1,12 +1,11 @@
// components/Header.js
export default function Header() {
return (
<header className="bg-white shadow">
<div className="container mx-auto px-4 py-6">
<h1 className="text-2xl font-bold">Kakawa Chocolate Shop</h1>
{/* Navigation links */}
</div>
</header>
);
}
return (
<header className='bg-white shadow'>
<div className='container mx-auto px-4 py-6'>
<h1 className='text-2xl font-bold'>Kakawa Chocolate Shop</h1>
{/* Navigation links */}
</div>
</header>
);
}

22
src/components/homepage-video.tsx

@ -1,8 +1,16 @@
export function HomepageVideo() {
return (
<video width="1080" height="1920" controls preload="auto" loop autoPlay muted >
<source src="/videos/homepage-video.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video>
)
}
return (
<video
width='1080'
height='1920'
controls
preload='auto'
loop
autoPlay
muted
>
<source src='/videos/homepage-video.mp4' type='video/mp4' />
Your browser does not support the video tag.
</video>
);
}

8
src/components/layout.tsx

@ -1,8 +1,12 @@
// components/Layout.js
import Header from './header';
import Footer from './footer';
import { ReactNode } from 'react'; // Import ReactNode
export default function Layout({ children }) {
interface LayoutProps {
children: ReactNode; // Define the type of children prop
}
export default function Layout({ children }: LayoutProps) {
return (
<>
<Header />
@ -10,4 +14,4 @@ export default function Layout({ children }) {
<Footer />
</>
);
}
}

36
src/components/navbar.tsx

@ -1,21 +1,27 @@
// components/Navbar.tsx
export default function Navbar() {
return (
<nav className="navbar">
<div className="left">
<a href="#about-us">About Us</a>
<a href="#shop">Shop</a>
return (
<nav className='navbar'>
<div className='left'>
<a href='#about-us'>About Us</a>
<a href='#shop'>Shop</a>
</div>
<div className="center">
<a href="/" className="mx-0"><img src="/images/logo.png" alt="Logo" className="logo" /></a>
<div className='center'>
<a href='/' className='mx-0'>
<img src='/images/logo.png' alt='Logo' className='logo' />
</a>
</div>
<div className="right">
<a href="#search"><span className="material-symbols-outlined">search</span></a>
<a href="#shopping"><span className="material-symbols-outlined">shopping_bag</span></a>
<a href="#profile"><span className="material-symbols-outlined">person</span></a>
<div className='right'>
<a href='#search'>
<span className='material-symbols-outlined'>search</span>
</a>
<a href='#shopping'>
<span className='material-symbols-outlined'>shopping_bag</span>
</a>
<a href='#profile'>
<span className='material-symbols-outlined'>person</span>
</a>
</div>
</nav>
);
}
);
}

42
src/components/our-collection.tsx Normal file

@ -0,0 +1,42 @@
import Image from 'next/image';
const collections = [
{
title: 'Bestsellers',
image: '/images/collections/bestsellers.jpg', // replace with actual image path
},
{
title: 'New Arrivals',
image: '/images/collections/new-arrivals.jpg', // replace with actual image path
},
{
title: 'Gift Collection',
image: '/images/collections/gifting.jpg', // replace with actual image path
},
];
export function Collections() {
return (
<div className='max-w-7xl mx-auto grid gap-6 sm:grid-cols-1 md:grid-cols-2 lg:grid-cols-3'>
{collections.map((collection, index) => (
<div
key={index}
className='block rounded-lg overflow-hidden shadow-lg bg-white transition transform hover:scale-105 duration-300'
>
<Image
src={collection.image}
alt={collection.title}
width={500}
height={300}
className='w-full object-cover'
/>
<div className='p-4'>
<h3 className='text-center text-base font-light'>
{collection.title}
</h3>
</div>
</div>
))}
</div>
);
}

41
src/components/swiper.tsx Normal file

@ -0,0 +1,41 @@
'use client';
// import Swiper core and required modules
import { Autoplay, Pagination, Scrollbar } from 'swiper/modules';
import { Swiper, SwiperSlide } from 'swiper/react';
// Import Swiper styles
import 'swiper/css';
import 'swiper/css/navigation';
import 'swiper/css/pagination';
import 'swiper/css/scrollbar';
export function HeroSwiper() {
return (
<Swiper
// install Swiper modules
modules={[Autoplay, Pagination, Scrollbar]}
autoplay={{
delay: 2500,
disableOnInteraction: false,
}}
pagination={{ clickable: true }}
scrollbar={{ draggable: true }}
onSwiper={(swiper) => console.log(swiper)}
onSlideChange={() => console.log('slide change')}
>
<SwiperSlide>
<img src='/images/slider/slider-01.jpg' className='w-full' />
</SwiperSlide>
<SwiperSlide>
<img src='/images/slider/slider-02.jpg' className='w-full' />
</SwiperSlide>
<SwiperSlide>
<img src='/images/slider/slider-03.jpg' className='w-full' />
</SwiperSlide>
<SwiperSlide>
<img src='/images/slider/slider-04.jpg' className='w-full' />
</SwiperSlide>
</Swiper>
);
}

3
src/pages/_app.tsx

@ -1,7 +1,8 @@
import { AppProps } from 'next/app'; // Import the AppProps type
import Layout from '../components/layout';
import '../app/globals.css';
function MyApp({ Component, pageProps }) {
function MyApp({ Component, pageProps }: AppProps) {
return (
<Layout>
<Component {...pageProps} />

12
tailwind.config.ts

@ -1,16 +1,16 @@
import type { Config } from "tailwindcss";
import type { Config } from 'tailwindcss';
const config: Config = {
content: [
"./src/pages/**/*.{js,ts,jsx,tsx,mdx}",
"./src/components/**/*.{js,ts,jsx,tsx,mdx}",
"./src/app/**/*.{js,ts,jsx,tsx,mdx}",
'./src/pages/**/*.{js,ts,jsx,tsx,mdx}',
'./src/components/**/*.{js,ts,jsx,tsx,mdx}',
'./src/app/**/*.{js,ts,jsx,tsx,mdx}',
],
theme: {
extend: {
colors: {
background: "var(--background)",
foreground: "var(--foreground)",
background: 'var(--background)',
foreground: 'var(--foreground)',
},
},
},