implement catering packages component and add styling modules for various site sections
This commit is contained in:
parent
5bb7b806e5
commit
32f7443bb8
4
package-lock.json
generated
4
package-lock.json
generated
@ -1,11 +1,11 @@
|
||||
{
|
||||
"name": "antalya-web",
|
||||
"name": "antalya-burlington",
|
||||
"version": "0.1.0",
|
||||
"lockfileVersion": 3,
|
||||
"requires": true,
|
||||
"packages": {
|
||||
"": {
|
||||
"name": "antalya-web",
|
||||
"name": "antalya-burlington",
|
||||
"version": "0.1.0",
|
||||
"dependencies": {
|
||||
"axios": "^1.13.2",
|
||||
|
||||
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB After Width: | Height: | Size: 24 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 30 KiB |
@ -106,7 +106,7 @@
|
||||
.text {
|
||||
font-size: 1.1rem;
|
||||
line-height: 1.8;
|
||||
color: var(--color-alterparagraph) !important;
|
||||
color: #441109 !important;
|
||||
margin-bottom: 1.5rem;
|
||||
opacity: 0.9;
|
||||
font-family: var(--font-lato);
|
||||
@ -123,8 +123,8 @@
|
||||
.menuButton {
|
||||
display: inline-block;
|
||||
padding: 15px 40px;
|
||||
border: 2px solid #b07c4b;
|
||||
color: var(--color-alterparagraph) !important;
|
||||
border: 2px solid #441109;
|
||||
color: #441109 !important;
|
||||
font-family: var(--font-lato);
|
||||
font-size: 1.1rem;
|
||||
text-transform: uppercase;
|
||||
@ -136,8 +136,8 @@
|
||||
}
|
||||
|
||||
.menuButton:hover {
|
||||
background-color: #c49c5c;
|
||||
color: #fff;
|
||||
background-color: #441109;
|
||||
color: #F5E6D3 !important;
|
||||
}
|
||||
|
||||
.smallHeading {
|
||||
@ -202,7 +202,7 @@
|
||||
.featureDesc {
|
||||
font-family: var(--font-lato);
|
||||
font-size: 1rem;
|
||||
color: var(--color-alterparagraph) !important;
|
||||
color: #441109 !important;
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
@ -269,7 +269,7 @@
|
||||
line-height: 1.8;
|
||||
font-style: italic;
|
||||
text-align: center;
|
||||
color: #a67c52;
|
||||
color: #441109;
|
||||
}
|
||||
|
||||
.testimonialAuthor {
|
||||
@ -560,7 +560,7 @@
|
||||
.faqSubtitle {
|
||||
font-family: var(--font-lato);
|
||||
font-size: 1.1rem;
|
||||
color: var(--color-alterparagraph) !important;
|
||||
color: #441109 !important;
|
||||
line-height: 1.6;
|
||||
margin-bottom: 1rem;
|
||||
}
|
||||
@ -573,7 +573,7 @@
|
||||
|
||||
.faqItem {
|
||||
background: #fff;
|
||||
border: 2px solid #b07c4b;
|
||||
border: 2px solid #441109;
|
||||
border-radius: 8px;
|
||||
overflow: hidden;
|
||||
transition: all 0.3s ease;
|
||||
@ -595,25 +595,25 @@
|
||||
font-family: var(--font-lato);
|
||||
font-size: 1.1rem;
|
||||
font-weight: 600;
|
||||
color: var(--color-paragraph);
|
||||
color: #441109;
|
||||
text-align: left;
|
||||
transition: all 0.3s ease;
|
||||
}
|
||||
|
||||
.faqQuestion:hover {
|
||||
background-color: #c49c5c;
|
||||
background-color: #441109;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.faqQuestionActive {
|
||||
background-color: #c49c5c;
|
||||
background-color: #441109;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.faqIcon {
|
||||
font-size: 1.5rem;
|
||||
font-weight: bold;
|
||||
color: var(--color-paragraph);
|
||||
color: #441109;
|
||||
transition: transform 0.3s ease, color 0.3s ease;
|
||||
flex-shrink: 0;
|
||||
margin-left: 1rem;
|
||||
@ -637,7 +637,7 @@
|
||||
.faqAnswer p {
|
||||
font-family: var(--font-lato);
|
||||
font-size: 1rem;
|
||||
/* color: #5d4037; */
|
||||
color: #441109;
|
||||
line-height: 1.8;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
@ -70,7 +70,7 @@
|
||||
|
||||
.description {
|
||||
font-size: var(--body-size);
|
||||
color: var(--color-alterparagraph) !important;
|
||||
color: #441109 !important;
|
||||
line-height: 1.8;
|
||||
font-family: var(--font-lato);
|
||||
max-width: 800px;
|
||||
@ -93,8 +93,8 @@
|
||||
|
||||
.tab {
|
||||
background: transparent;
|
||||
border: 2px solid #b07c4b;
|
||||
color: var(--color-paragraph);
|
||||
border: 2px solid #441109;
|
||||
color: #441109;
|
||||
padding: 12px 30px;
|
||||
font-size: var(--body-size);
|
||||
cursor: pointer;
|
||||
@ -108,7 +108,7 @@
|
||||
|
||||
.tab:hover,
|
||||
.activeTab {
|
||||
background-color: #c49c5c;
|
||||
background-color: #441109;
|
||||
color: #F5E6D3;
|
||||
}
|
||||
|
||||
|
||||
@ -96,8 +96,8 @@
|
||||
|
||||
.tab {
|
||||
background: transparent;
|
||||
border: 2px solid #b07c4b;
|
||||
color: var(--color-paragraph);
|
||||
border: 2px solid #441109;
|
||||
color: #441109;
|
||||
padding: 8px 20px 8px 8px;
|
||||
font-size: 1rem;
|
||||
cursor: pointer;
|
||||
@ -120,10 +120,10 @@
|
||||
|
||||
.tab:hover,
|
||||
.activeTab {
|
||||
background-color: #c49c5c;
|
||||
background-color: #441109;
|
||||
color: #f5e6d3;
|
||||
transform: translateY(-2px);
|
||||
border: 2px solid #b07c4b;
|
||||
border: 2px solid #441109;
|
||||
}
|
||||
|
||||
.menuGrid {
|
||||
@ -257,7 +257,7 @@
|
||||
|
||||
.descriptionMenu {
|
||||
font-size: var(--body-size);
|
||||
color: var(--color-alterparagraph) !important;
|
||||
color: #441109 !important;
|
||||
line-height: 1.5;
|
||||
font-family: var(--font-lato);
|
||||
margin: 0;
|
||||
@ -266,7 +266,7 @@
|
||||
|
||||
.description {
|
||||
font-size: 0.95rem;
|
||||
color: var(--color-alterparagraph) !important;
|
||||
color: #441109 !important;
|
||||
line-height: 1.5;
|
||||
font-family: var(--font-lato);
|
||||
margin: 0;
|
||||
|
||||
@ -70,7 +70,7 @@
|
||||
|
||||
.description {
|
||||
font-size: var(--body-size);
|
||||
color: var(--color-alterparagraph) !important;
|
||||
color: #441109 !important;
|
||||
line-height: 1.8;
|
||||
font-family: var(--font-lato);
|
||||
max-width: 800px;
|
||||
@ -123,35 +123,36 @@
|
||||
}
|
||||
|
||||
.blogTitle a {
|
||||
color: #3e2723;
|
||||
color: #200c08;
|
||||
transition: color 0.3s;
|
||||
}
|
||||
|
||||
.blogTitle a:hover {
|
||||
/* .blogTitle a:hover {
|
||||
color: var(--color-paragraph);
|
||||
}
|
||||
} */
|
||||
|
||||
.date {
|
||||
font-size: var(--small-text-size);
|
||||
margin-bottom: 1rem;
|
||||
font-family: var(--font-lato);
|
||||
font-weight: 600;
|
||||
color: #2b0b06;
|
||||
}
|
||||
|
||||
.excerpt {
|
||||
font-size: var(--body-size);
|
||||
font-size: 1.1rem;
|
||||
line-height: 1.6;
|
||||
margin-bottom: 1.5rem;
|
||||
flex-grow: 1;
|
||||
font-family: var(--font-lato);
|
||||
color: var(--color-alterparagraph) !important;
|
||||
color: #441109 !important;
|
||||
}
|
||||
|
||||
.button {
|
||||
display: inline-block;
|
||||
padding: 10px 25px;
|
||||
border: 2px solid #b07c4b;
|
||||
color: var(--color-alterparagraph) !important;
|
||||
border: 2px solid #441109;
|
||||
color: #441109 !important;
|
||||
text-align: center;
|
||||
transition: all 0.3s ease;
|
||||
align-self: flex-start;
|
||||
@ -162,7 +163,7 @@
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
background-color: #c49c5c;
|
||||
background-color: #441109;
|
||||
color: #fff !important;
|
||||
}
|
||||
|
||||
|
||||
@ -362,15 +362,15 @@ export default function CateringContent() {
|
||||
</div>
|
||||
</motion.span>
|
||||
<motion.h2 className={styles.storyTitle} variants={fadeInUp}>
|
||||
Bring Authentic Turkish Flavour to Your Event - Contact Us Today.
|
||||
Bring Authentic Turkish Flavour to Your Event - Email Us Today.
|
||||
</motion.h2>
|
||||
<motion.a
|
||||
href="tel:+15195882037"
|
||||
href="mailto:hello@antalyarestaurant.ca"
|
||||
className={styles.storydesc}
|
||||
variants={fadeInUp}
|
||||
style={{ display: "inline-block" }}
|
||||
>
|
||||
+1 519 588 2037
|
||||
hello@antalyarestaurant.ca
|
||||
</motion.a>
|
||||
|
||||
{/* <motion.button className={styles.storyButton} variants={fadeInUp}>
|
||||
|
||||
@ -7,9 +7,9 @@ const packages = [
|
||||
{
|
||||
id: 'silver',
|
||||
name: 'SILVER PACKAGE',
|
||||
price: '$19',
|
||||
perPerson: 'PER PERSON',
|
||||
minPeople: '(MIN 20PPL)',
|
||||
// price: '$19',
|
||||
// perPerson: 'PER PERSON',
|
||||
minPeople: 'MIN 20PPL',
|
||||
image: '/images/catering/packages/silver.webp', // Placeholder
|
||||
items: [
|
||||
'Choice of two kebabs (Adana, Kofta, Chicken Shish, Meat Doner, Chicken Doner)',
|
||||
@ -23,9 +23,9 @@ const packages = [
|
||||
{
|
||||
id: 'gold',
|
||||
name: 'GOLD PACKAGE',
|
||||
price: '$23',
|
||||
perPerson: 'PER PERSON',
|
||||
minPeople: '(MIN 25PPL)',
|
||||
// price: '$23',
|
||||
// perPerson: 'PER PERSON',
|
||||
minPeople: 'MIN 25PPL',
|
||||
image: '/images/catering/packages/gold.webp', // Placeholder
|
||||
items: [
|
||||
'Choice of two kebabs (Adana, Kofta, Chicken Shish, Meat Doner, Chicken Doner)',
|
||||
@ -41,9 +41,9 @@ const packages = [
|
||||
{
|
||||
id: 'platinum',
|
||||
name: 'PLATINUM PACKAGE',
|
||||
price: '$25',
|
||||
perPerson: 'PER PERSON',
|
||||
minPeople: '(MIN 30PPL)',
|
||||
// price: '$25',
|
||||
// perPerson: 'PER PERSON',
|
||||
minPeople: 'MIN 30PPL',
|
||||
image: '/images/catering/packages/platinum.webp', // Placeholder
|
||||
items: [
|
||||
'Choice of 2 kebabs (Adana, Kofta, Chicken Shish, Meat Doner, Chicken Doner)',
|
||||
@ -87,8 +87,8 @@ const CateringPackages = () => {
|
||||
</div>
|
||||
|
||||
<div className={styles.priceTag}>
|
||||
<span className={styles.priceAmount}>{pkg.price}</span>
|
||||
<span className={styles.priceDetail}>{pkg.perPerson} {pkg.minPeople}</span>
|
||||
{/* <span className={styles.priceAmount}>{pkg?.price ? pkg.price : ''}</span> */}
|
||||
<span className={styles.priceDetail}>{pkg.minPeople}</span>
|
||||
</div>
|
||||
|
||||
<ul className={styles.itemsList}>
|
||||
|
||||
@ -115,7 +115,7 @@
|
||||
|
||||
.description1 {
|
||||
font-size: var(--body-size);
|
||||
color: var(--color-alterparagraph) !important;
|
||||
color: #441109 !important;
|
||||
line-height: 1.8;
|
||||
font-family: var(--font-lato);
|
||||
/* max-width: 800px; */
|
||||
@ -684,7 +684,7 @@
|
||||
|
||||
.servingDescription {
|
||||
font-size: var(--body-size);
|
||||
color: var(--color-alterparagraph) !important;
|
||||
color: #441109 !important;
|
||||
line-height: 1.8;
|
||||
font-family: var(--font-lato);
|
||||
/* max-width: 800px; */
|
||||
|
||||
@ -79,7 +79,7 @@
|
||||
.excerpt {
|
||||
font-family: var(--font-playfair);
|
||||
font-size: 0.95rem;
|
||||
color: var(--color-alterparagraph) !important;
|
||||
color: #441109 !important;
|
||||
margin-bottom: 25px;
|
||||
line-height: 1.6;
|
||||
max-width: 90%;
|
||||
|
||||
@ -104,18 +104,18 @@ export default function Footer() {
|
||||
</div>
|
||||
|
||||
{/* Kitchener Location */}
|
||||
<div className={styles.locationItem}>
|
||||
{/* <div className={styles.locationItem}>
|
||||
<h4 className={styles.cityHeading}>Kitchener</h4>
|
||||
<div className={styles.contactRow}>
|
||||
<img src="/images/maps-and-flags.png" alt="Location Icon" className={styles.iconImage} />
|
||||
<span>1187 Fischer-Hallman Rd #435, Kitchener, ON N2E 4H9</span>
|
||||
</div>
|
||||
{/* <h4 className={styles.cityHeading}>Call us</h4> */}
|
||||
<h4 className={styles.cityHeading}>Call us</h4>
|
||||
<div className={styles.contactRow}>
|
||||
<img src="/images/phone-call.png" alt="Phone Icon" className={styles.iconImage} />
|
||||
<a href="tel:5195816363">519-581-6363</a>
|
||||
</div>
|
||||
</div>
|
||||
</div> */}
|
||||
|
||||
<h4 className={styles.cityHeading}>Email us</h4>
|
||||
|
||||
|
||||
@ -206,8 +206,8 @@
|
||||
}
|
||||
|
||||
.description {
|
||||
font-size: var(--body-size);
|
||||
color: var(--color-paragraph);
|
||||
font-size: 16px;
|
||||
color: #430f0c;
|
||||
line-height: 1.5;
|
||||
font-family: var(--font-lato);
|
||||
margin: 0;
|
||||
|
||||
@ -64,7 +64,7 @@
|
||||
.dishName {
|
||||
font-family: var(--font-playfair);
|
||||
font-size: 1.8rem;
|
||||
color: var(--color-paragraph);
|
||||
color: #410d0a;
|
||||
/* Dark brown text */
|
||||
margin-bottom: 15px;
|
||||
font-weight: 600;
|
||||
@ -74,7 +74,7 @@
|
||||
font-family: var(--font-cinzel), serif;
|
||||
/* Using serif as per image look */
|
||||
font-size: 1rem;
|
||||
color: var(--color-alterparagraph) !important;
|
||||
color: #410d0a !important;
|
||||
margin-bottom: 30px;
|
||||
line-height: 1.6;
|
||||
max-width: 90%;
|
||||
@ -84,8 +84,8 @@
|
||||
.button {
|
||||
display: inline-block;
|
||||
padding: 12px 30px;
|
||||
border: 2px solid #b07c4b;
|
||||
color: var(--color-paragraph);
|
||||
border: 2px solid #410d0a;
|
||||
color: #410d0a;
|
||||
font-family: var(--font-inter), sans-serif;
|
||||
text-transform: uppercase;
|
||||
font-size: 0.9rem;
|
||||
@ -96,7 +96,7 @@
|
||||
}
|
||||
|
||||
.button:hover {
|
||||
background-color: #c49c5c;
|
||||
background-color: #410d0a;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user