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

Category slider responsive.

Browse Source 
New Typography based on:

https://www.wix.com/studio/blog/font-size
This commit is contained in:
Amritanshu Agrawal
2024-09-30 22:06:25 +05:30
parent 2519b4f740
commit 6ff0623762
12 changed files with 116 additions and 79 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
src/app/(static)/about-us/page.tsx
View File

@ -12,10 +12,10 @@ export default function AboutUsPage() {
<div className='overflow-x-hidden bg-white pt-28'>
<section className='flex flex-col items-center'>
{/* Left Column - Text with Header */}
<div className='w-full text-8xl font-normal text-center font-montera'>
<div className='w-full text-s-headline font-normal text-center font-montera'>
Welcome to the World of Mozimo Magic
</div>
<div className='w-full text-xl text-justify p-12'>
<div className='w-full text-s-normal text-justify p-12'>
Indulge in the Luxurious. Immerse in the Captivating. Savor the Fresh.
At Mozimo, we curate a chocolate experience that transports you to a
world of opulence, captivates your senses with mesmerizing aromas and
@ -48,13 +48,10 @@ export default function AboutUsPage() {
{/* Right Column - Text with Header */}
<div className='w-full md:w-1/2'>
<div className='m-8 space-y-10'>
<p className='text-6xl font-normal text-justify font-montera'>
Our Founders
<p className='text-s-title font-normal text-justify font-montera'>
Our Founders Priyanka and Amritanshu
</p>
<p className='text-5xl font-normal text-justify font-montera'>
Priyanka and Amritanshu,
</p>
<p className='text-xl text-justify'>
<p className='text-s-normal text-justify'>
are the proud founders of Mozimo, a bean-to-bar chocolate shop
that celebrates the rich and distinctive flavors of single origin
cocoa beans. Their journey with Mozimo has been a passionate
@ -68,13 +65,13 @@ export default function AboutUsPage() {
<section className='flex flex-col md:flex-row items-center'>
<div className='w-full md:w-1/2'>
<div className='m-8 space-y-10'>
<h2 className='text-6xl font-normal text-justify font-montera'>
<h2 className='text-s-title font-normal text-justify font-montera'>
Capturing the essence of
</h2>
<h3 className='text-8xl font-normal text-justify font-samantha'>
<h3 className='text-s-headline font-normal text-justify font-samantha'>
Italian Chocolate
</h3>
<p className='text-xl text-justify'>
<p className='text-s-normal text-justify'>
With over 15 years of hospitality experience, these avid travelers
scoured the globe for the finest cocoa beans and techniques. Deep
in remote cocoa farms, they cultivated relationships with farmers
@ -115,7 +112,7 @@ export default function AboutUsPage() {
</div>
</section>
<section className='flex flex-col md:flex-col items-center'>
<div className='flex w-full text-xl text-justify p-12'>
<div className='flex w-full text-s-normal text-justify p-12'>
Under the mentorship of the master chocolatier Gabriele Rinaudo,
Priyanka and Amritanshu dedicated themselves to mastering the
intricate art of chocolate making. With unwavering determination and a
@ -124,7 +121,7 @@ export default function AboutUsPage() {
the delicate techniques that transform raw beans into exquisite
chocolate creations.
</div>
<div className='flex w-full text-xl text-justify p-12'>
<div className='flex w-full text-s-normal text-justify p-12'>
In addition to their training under Gabriele Rinaudo, they embarked on
a transformative journey to Italy to further enrich their
understanding of the art of chocolate making. This immersive
@ -141,7 +138,7 @@ export default function AboutUsPage() {
sizes='100vw'
/>
</div>
<div className='flex w-full text-xl text-justify p-12'>
<div className='flex w-full text-s-normal text-justify p-12'>
Passionate about chocolate as a medium for creativity and exploration,
they view it not just as a confection but as a canvas for artistic
expression. Constantly seeking inspiration, they push the boundaries

40
src/app/(static)/festival/page.tsx
View File

@ -21,12 +21,12 @@ export default function AboutUsPage() {
/>
</div>
<AnimatedText finishClass='delay-300'>
<h2 className='text-8xl font-normal text-justify font-samantha p-12'>
<h2 className='text-s-headline font-normal text-justify font-samantha p-12'>
Sweet Moments with Mozimo
</h2>
</AnimatedText>
<AnimatedText startClass='translate-y-8' finishClass='translate-y-0'>
<div className='w-full text-xl text-justify pb-12'>
<div className='w-full text-s-normal text-justify pb-12'>
“Transforming cacao beans sourced straight from the pod into rich,
velvety smooth chocolate is pure magic. This is why we take great
pride in being called the &apos;Alchemists of the Chocolate
@ -51,7 +51,7 @@ export default function AboutUsPage() {
startClass='translate-y-8'
finishClass='translate-y-0'
>
<p className='text-xl text-justify'>
<p className='text-s-normal text-justify'>
Our journey at Mozimo has been a passionate pursuit of creating
exceptional chocolate that tantalizes the taste buds and tells
the unique story of each cocoa bean&apos;s origin. We traversed
@ -65,7 +65,7 @@ export default function AboutUsPage() {
startClass='translate-y-8'
finishClass='translate-y-0'
>
<p className='text-xl text-justify'>
<p className='text-s-normal text-justify'>
Beholding our vision, we started the meticulous process of
crafting rich, exquisite, delectable chocolates, ultimately
perfecting the art. As we continue our journey at Mozimo, we are
@ -76,11 +76,11 @@ export default function AboutUsPage() {
</div>
</div>
</section>
<section className='flex flex-col md:flex-row items-center'>
<section className='flex flex-col-reverse md:flex-row items-center'>
<div className='w-full md:w-1/2'>
<div className='m-8 space-y-5'>
<AnimatedText finishClass='delay-300'>
<p className='text-xl font-justify uppercase'>
<p className='text-s-normal font-justify uppercase'>
Aritsan Craftmanship
</p>
</AnimatedText>
@ -88,7 +88,7 @@ export default function AboutUsPage() {
startClass='translate-y-8'
finishClass='translate-y-0'
>
<p className='text-xl text-justify pb-12'>
<p className='text-s-normal text-justify pb-12'>
We are an atelier crafting chocolate from the finest
single-source beans. Our commitment to the art of making
chocolate ensures that each piece epitomizes supreme taste &
@ -96,7 +96,7 @@ export default function AboutUsPage() {
</p>
</AnimatedText>
<AnimatedText finishClass='delay-300'>
<p className='text-xl font-justify uppercase'>
<p className='text-s-normal font-justify uppercase'>
Ethics and Sustainability
</p>
</AnimatedText>
@ -104,7 +104,7 @@ export default function AboutUsPage() {
startClass='translate-y-8'
finishClass='translate-y-0'
>
<p className='text-xl text-justify pb-12'>
<p className='text-s-normal text-justify pb-12'>
We are committed to sustainability and being ethical in all that
we do. From selecting ingredients from remote farmers to our
production practices, we prioritize sustainability and ethical
@ -112,7 +112,7 @@ export default function AboutUsPage() {
</p>
</AnimatedText>
<AnimatedText finishClass='delay-300'>
<p className='text-xl font-justify uppercase'>
<p className='text-s-normal font-justify uppercase'>
Commitment to Excellence
</p>
</AnimatedText>
@ -120,7 +120,7 @@ export default function AboutUsPage() {
startClass='translate-y-8'
finishClass='translate-y-0'
>
<p className='text-xl text-justify'>
<p className='text-s-normal text-justify'>
We are inspired to create the best-quality chocolate in our
pursuit of excellence. This involves refining ingredients,
updating processes, and continuously striving to become the best
@ -142,14 +142,14 @@ export default function AboutUsPage() {
<section className='flex flex-col items-center'>
<AnimatedText finishClass='delay-300'>
<div className='font-normal text-center p-12'>
<span className='text-6xl font-montera'>Specimens of</span>{' '}
<span className='text-8xl font-samantha'>
<span className='text-s-headline font-montera'>Specimens of</span>{' '}
<span className='text-s-headline font-samantha'>
Exquisite Craftsmanship
</span>
</div>
</AnimatedText>
<AnimatedText startClass='translate-y-8' finishClass='translate-y-0'>
<div className='text-xl text-justify pb-12'>
<div className='text-s-normal text-justify pb-12'>
Every creation of Mozimo&apos;s chocolate is a specimen of
craftsmanship of the highest quality by the finest chocolatiers.
</div>
@ -176,16 +176,16 @@ export default function AboutUsPage() {
<section className='flex flex-col items-center'>
<AnimatedText finishClass='delay-300'>
<p className='font-normal text-center p-12'>
<span className='text-6xl font-montera'>
<span className='text-s-headline font-montera'>
Immerse yourself in the
</span>{' '}
<span className='text-8xl font-samantha'>
<span className='text-s-headline font-samantha'>
Italian Chocolate Experience
</span>
</p>
</AnimatedText>
<AnimatedText startClass='translate-y-8' finishClass='translate-y-0'>
<p className='text-xl text-center pb-12'>
<p className='text-s-normal text-center pb-12'>
Indulge in the authentic artistry of the Cioccolaterias of Italy
with handcrafted artisanal chocolates by Mozimo.
</p>
@ -196,12 +196,12 @@ export default function AboutUsPage() {
className='w-full h-auto'
/>
<AnimatedText finishClass='delay-300'>
<p className='text-6xl text-center font-montera p-12'>
<p className='text-s-headline text-center font-montera p-12'>
Experience the art of gifting this Diwali
</p>
</AnimatedText>
<AnimatedText startClass='translate-y-8' finishClass='translate-y-0'>
<p className='text-xl text-center pb-12'>
<p className='text-s-normal text-center pb-12'>
It’s time to celebrate the joy of togetherness, love, and the luxury
of Mozimo’s chocolates. This Diwali, let’s embrace the sweetness of
life with our exquisite single-origin handcrafted chocolates,
@ -209,7 +209,7 @@ export default function AboutUsPage() {
</p>
</AnimatedText>
<AnimatedText startClass='translate-y-8' finishClass='translate-y-0'>
<p className='text-xl text-center pb-12'>
<p className='text-s-normal text-center pb-12'>
Let our handcrafted chocolates be a part of your Diwali rituals.
Whether you’re enjoying them during family gatherings, using them as
a centerpiece for your celebrations, or gifting them to friends or

20
src/app/(static)/page.tsx
View File

@ -18,7 +18,7 @@ export default function HomePage() {
<div className='w-full md:w-1/2 h-[90vh] md:h-auto'>
<div className='m-8 space-y-10'>
<AnimatedText finishClass='delay-300'>
<h2 className='text-6xl font-normal text-justify font-montera'>
<h2 className='text-s-title font-normal text-justify font-montera'>
Brand Story
</h2>
</AnimatedText>
@ -26,16 +26,16 @@ export default function HomePage() {
startClass='translate-y-8'
finishClass='translate-y-0'
>
<p className='text-xl text-justify'>
<p className='text-s-normal text-justify'>
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 text-justify'>
<p className='text-s-normal 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 text-justify'>
<p className='text-s-normal text-justify'>
Each chocolate is a masterpiece, capturing the essence of cocoa
in its purest form.
</p>
@ -67,10 +67,10 @@ export default function HomePage() {
<div className='w-full md:w-1/2'>
<div className='m-8 space-y-10'>
<AnimatedText finishClass='delay-300'>
<h2 className='text-6xl font-normal text-justify font-montera'>
<h2 className='text-s-title font-normal text-justify font-montera'>
Discover the delicate art of our
</h2>
<h3 className='text-8xl font-normal text-justify font-samantha'>
<h3 className='text-s-title font-normal text-justify font-samantha'>
Chocolate Tempering
</h3>
</AnimatedText>
@ -78,7 +78,7 @@ export default function HomePage() {
startClass='translate-y-8'
finishClass='translate-y-0'
>
<p className='text-xl text-justify'>
<p className='text-s-normal text-justify'>
Crafted to perfection Mozimo delivers a sublime sensory
experience with every bite. Experience the epitome of indulgence
with our perfectly tempered chocolate: velvety smooth,
@ -91,7 +91,7 @@ export default function HomePage() {
</section>
{/* Fourth Three-Column Layout (Collections) */}
<section className='flex flex-col items-center py-12 px-4 sm:px-6 lg:px-8'>
<div className='w-full text-6xl font-normal font-montera text-center py-12 px-4 sm:px-6 lg:px-8'>
<div className='w-full text-s-headline font-normal font-montera text-center py-12 px-4 sm:px-6 lg:px-8'>
Our Collections
</div>
<Collections />
@ -100,13 +100,13 @@ export default function HomePage() {
<ChocolateCategories />
{/* Sixth Layout (Instagram) */}
<section className='flex flex-col items-center py-12 px-4 sm:px-6 lg:px-8'>
<div className='w-full text-6xl font-normal font-montera text-center py-12 px-4 sm:px-6 lg:px-8'>
<div className='w-full text-s-headline font-normal font-montera text-center py-12 px-4 sm:px-6 lg:px-8'>
Follow us on Instagram
</div>
<InstagramFeed />
</section>
<section className='flex flex-col items-center bg-white py-12 px-4 sm:px-6 lg:px-8'>
<div className='w-full text-6xl font-normal font-montera text-center py-12 px-4 sm:px-6 lg:px-8'>
<div className='w-full text-s-headline font-normal font-montera text-center py-12 px-4 sm:px-6 lg:px-8'>
In the Spotlight
</div>
<Spotlight />