MetatroncubeSoftwareSolutions/Antalya-Restaurant
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

color code & font family updated

Browse Source
This commit is contained in:
akash 2025-11-26 22:58:15 +07:00
parent 53051c4be0
commit f832c93caa
27 changed files with 336 additions and 305 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/images/footer.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 964 KiB

48
src/app/about-us/about.module.css
View File

@ -30,7 +30,7 @@
.breadcrumb { .breadcrumb {
font-size: 1.1rem; font-size: 1.1rem;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
} }
@ -96,7 +96,7 @@
.sectionTitleCenter { .sectionTitleCenter {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 3.5rem; font-size: 3.5rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 3rem; margin-bottom: 3rem;
text-align: center; text-align: center;
text-transform: uppercase; text-transform: uppercase;
@ -117,14 +117,14 @@
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
max-width: 100%; max-width: 100%;
height: auto; height: auto;
border: 4px solid #C5A059; border: 2px solid #b07c4b
} }
.menuButton { .menuButton {
display: inline-block; display: inline-block;
padding: 15px 40px; padding: 15px 40px;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
font-size: 1.1rem; font-size: 1.1rem;
text-transform: uppercase; text-transform: uppercase;
@ -136,7 +136,7 @@
} }
.menuButton:hover { .menuButton:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #000; color: #000;
} }
@ -153,7 +153,7 @@
background-color: #F5E6D3; background-color: #F5E6D3;
padding: 2.5rem 2rem; padding: 2.5rem 2rem;
text-align: center; text-align: center;
border: 4px solid #C5A059; border: 2px solid #b07c4b;
transition: transform 0.3s ease; transition: transform 0.3s ease;
} }
@ -168,7 +168,7 @@
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
border-radius: 8px; border-radius: 8px;
overflow: hidden; overflow: hidden;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
} }
.featureImage { .featureImage {
@ -203,8 +203,8 @@
.sliderBtn { .sliderBtn {
background: transparent; background: transparent;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-size: 2.5rem; font-size: 2.5rem;
width: 50px; width: 50px;
height: 50px; height: 50px;
@ -217,14 +217,14 @@
} }
.sliderBtn:hover { .sliderBtn:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #000; color: #000;
} }
.testimonialCard { .testimonialCard {
background-color: #F5E6D3; background-color: #F5E6D3;
padding: 3rem 2.5rem; padding: 3rem 2.5rem;
border: 4px solid #C5A059; border: 2px solid #b07c4b;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 2rem; gap: 2rem;
@ -254,7 +254,7 @@
height: 70px; height: 70px;
border-radius: 50%; border-radius: 50%;
overflow: hidden; overflow: hidden;
border: 3px solid #C5A059; border: 3px solid #c49c5c;
flex-shrink: 0; flex-shrink: 0;
} }
@ -293,7 +293,7 @@
height: 12px; height: 12px;
border-radius: 50%; border-radius: 50%;
background: transparent; background: transparent;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
cursor: pointer; cursor: pointer;
transition: all 0.3s; transition: all 0.3s;
padding: 0; padding: 0;
@ -301,7 +301,7 @@
.dot:hover, .dot:hover,
.activeDot { .activeDot {
background-color: #C5A059; background-color: #c49c5c;
} }
/* Call to Action Section */ /* Call to Action Section */
@ -320,13 +320,13 @@
padding: 4rem 2rem; padding: 4rem 2rem;
max-width: 800px; max-width: 800px;
margin: 0 auto; margin: 0 auto;
border: 4px solid #C5A059; border: 2px solid #b07c4b
} }
.ctaTitle { .ctaTitle {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 3rem; font-size: 3rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 1rem; margin-bottom: 1rem;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 2px; letter-spacing: 2px;
@ -342,8 +342,8 @@
.ctaButton { .ctaButton {
display: inline-block; display: inline-block;
padding: 15px 40px; padding: 15px 40px;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
font-size: 1.1rem; font-size: 1.1rem;
text-transform: uppercase; text-transform: uppercase;
@ -354,7 +354,7 @@
} }
.ctaButton:hover { .ctaButton:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #000; color: #000;
} }
@ -498,7 +498,7 @@
.faqItem { .faqItem {
background: #fff; background: #fff;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
border-radius: 8px; border-radius: 8px;
overflow: hidden; overflow: hidden;
transition: all 0.3s ease; transition: all 0.3s ease;
@ -526,18 +526,18 @@
} }
.faqQuestion:hover { .faqQuestion:hover {
background-color: #C5A059; background-color: #c49c5c;
} }
.faqQuestionActive { .faqQuestionActive {
background-color: #C5A059; background-color: #c49c5c;
color: #fff; color: #fff;
} }
.faqIcon { .faqIcon {
font-size: 1.5rem; font-size: 1.5rem;
font-weight: bold; font-weight: bold;
color: #C5A059; color: #c49c5c;
transition: transform 0.3s ease; transition: transform 0.3s ease;
flex-shrink: 0; flex-shrink: 0;
margin-left: 1rem; margin-left: 1rem;

20
src/app/about-us/about_temp.css
View File

@ -30,7 +30,7 @@
.breadcrumb { .breadcrumb {
font-size: 1.1rem; font-size: 1.1rem;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
} }
@ -83,7 +83,7 @@
.sectionTitle { .sectionTitle {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 3rem; font-size: 3rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 2px; letter-spacing: 2px;
@ -92,7 +92,7 @@
.sectionTitleCenter { .sectionTitleCenter {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 3.5rem; font-size: 3.5rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 3rem; margin-bottom: 3rem;
text-align: center; text-align: center;
text-transform: uppercase; text-transform: uppercase;
@ -102,7 +102,7 @@
.text { .text {
font-size: 1.1rem; font-size: 1.1rem;
line-height: 1.8; line-height: 1.8;
color: #C5A059; color: #c49c5c;
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
opacity: 0.9; opacity: 0.9;
font-family: var(--font-lato); font-family: var(--font-lato);
@ -113,14 +113,14 @@
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
max-width: 100%; max-width: 100%;
height: auto; height: auto;
border: 4px solid #C5A059; border: 2px solid #b07c4b
} }
.menuButton { .menuButton {
display: inline-block; display: inline-block;
padding: 15px 40px; padding: 15px 40px;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
font-size: 1.1rem; font-size: 1.1rem;
text-transform: uppercase; text-transform: uppercase;
@ -132,7 +132,7 @@
} }
.menuButton:hover { .menuButton:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #000; color: #000;
} }
@ -149,7 +149,7 @@
background-color: #F5E6D3; background-color: #F5E6D3;
padding: 2.5rem 2rem; padding: 2.5rem 2rem;
text-align: center; text-align: center;
border: 4px solid #C5A059; border: 2px solid #b07c4b;
transition: transform 0.3s ease; transition: transform 0.3s ease;
} }
@ -164,5 +164,5 @@
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
border-radius: 8px; border-radius: 8px;
overflow: hidden; overflow: hidden;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
} }

60
src/app/about/about.module.css
View File

@ -30,7 +30,7 @@
.breadcrumb { .breadcrumb {
font-size: 1.1rem; font-size: 1.1rem;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
} }
@ -96,7 +96,7 @@
.sectionTitleCenter { .sectionTitleCenter {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 3.5rem; font-size: 3.5rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 3rem; margin-bottom: 3rem;
text-align: center; text-align: center;
text-transform: uppercase; text-transform: uppercase;
@ -106,7 +106,7 @@
.text { .text {
font-size: 1.1rem; font-size: 1.1rem;
line-height: 1.8; line-height: 1.8;
color: #5d4037; /* color: #5d4037; */
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
opacity: 0.9; opacity: 0.9;
font-family: var(--font-lato); font-family: var(--font-lato);
@ -117,14 +117,14 @@
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
max-width: 100%; max-width: 100%;
height: auto; height: auto;
border: 4px solid #C5A059; border: 2px solid #b07c4b
} }
.menuButton { .menuButton {
display: inline-block; display: inline-block;
padding: 15px 40px; padding: 15px 40px;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
font-size: 1.1rem; font-size: 1.1rem;
text-transform: uppercase; text-transform: uppercase;
@ -136,7 +136,7 @@
} }
.menuButton:hover { .menuButton:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #000; color: #000;
} }
@ -153,7 +153,7 @@
background-color: #F5E6D3; background-color: #F5E6D3;
padding: 2.5rem 2rem; padding: 2.5rem 2rem;
text-align: center; text-align: center;
border: 4px solid #C5A059; border: 2px solid #b07c4b;
transition: transform 0.3s ease; transition: transform 0.3s ease;
} }
@ -168,7 +168,7 @@
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
border-radius: 8px; border-radius: 8px;
overflow: hidden; overflow: hidden;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
} }
.featureImage { .featureImage {
@ -203,8 +203,8 @@
.sliderBtn { .sliderBtn {
background: transparent; background: transparent;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-size: 2.5rem; font-size: 2.5rem;
width: 50px; width: 50px;
height: 50px; height: 50px;
@ -217,14 +217,14 @@
} }
.sliderBtn:hover { .sliderBtn:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #000; color: #000;
} }
.testimonialCard { .testimonialCard {
background-color: #F5E6D3; background-color: #F5E6D3;
padding: 3rem 2.5rem; padding: 3rem 2.5rem;
border: 4px solid #C5A059; border: 2px solid #b07c4b;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 2rem; gap: 2rem;
@ -254,7 +254,7 @@
height: 70px; height: 70px;
border-radius: 50%; border-radius: 50%;
overflow: hidden; overflow: hidden;
border: 3px solid #C5A059; border: 3px solid #c49c5c;
flex-shrink: 0; flex-shrink: 0;
} }
@ -293,7 +293,7 @@
height: 12px; height: 12px;
border-radius: 50%; border-radius: 50%;
background: transparent; background: transparent;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
cursor: pointer; cursor: pointer;
transition: all 0.3s; transition: all 0.3s;
padding: 0; padding: 0;
@ -301,7 +301,7 @@
.dot:hover, .dot:hover,
.activeDot { .activeDot {
background-color: #C5A059; background-color: #c49c5c;
} }
/* Call to Action Section */ /* Call to Action Section */
@ -320,13 +320,13 @@
padding: 4rem 2rem; padding: 4rem 2rem;
max-width: 800px; max-width: 800px;
margin: 0 auto; margin: 0 auto;
border: 4px solid #C5A059; border: 2px solid #b07c4b
} }
.ctaTitle { .ctaTitle {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 3rem; font-size: 3rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 1rem; margin-bottom: 1rem;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 2px; letter-spacing: 2px;
@ -342,8 +342,8 @@
.ctaButton { .ctaButton {
display: inline-block; display: inline-block;
padding: 15px 40px; padding: 15px 40px;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
font-size: 1.1rem; font-size: 1.1rem;
text-transform: uppercase; text-transform: uppercase;
@ -354,7 +354,7 @@
} }
.ctaButton:hover { .ctaButton:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #000; color: #000;
} }
@ -445,8 +445,8 @@
.ctaButton { .ctaButton {
display: inline-block; display: inline-block;
padding: 12px 20px; padding: 12px 20px;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
font-size: 12px; font-size: 12px;
text-transform: uppercase; text-transform: uppercase;
@ -516,7 +516,7 @@
.faqItem { .faqItem {
background: #fff; background: #fff;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
border-radius: 8px; border-radius: 8px;
overflow: hidden; overflow: hidden;
transition: all 0.3s ease; transition: all 0.3s ease;
@ -544,18 +544,18 @@
} }
.faqQuestion:hover { .faqQuestion:hover {
background-color: #C5A059; background-color: #c49c5c;
} }
.faqQuestionActive { .faqQuestionActive {
background-color: #C5A059; background-color: #c49c5c;
color: #fff; color: #fff;
} }
.faqIcon { .faqIcon {
font-size: 1.5rem; font-size: 1.5rem;
font-weight: bold; font-weight: bold;
color: #C5A059; color: #c49c5c;
transition: transform 0.3s ease; transition: transform 0.3s ease;
flex-shrink: 0; flex-shrink: 0;
margin-left: 1rem; margin-left: 1rem;
@ -614,14 +614,14 @@
height: auto !important; height: auto !important;
object-fit: cover !important; object-fit: cover !important;
border-radius: 12px; border-radius: 12px;
border: 4px solid #c5a059; border: 2px solid #b07c4b
} }
.ctaButton { .ctaButton {
display: inline-block; display: inline-block;
padding: 12px 20px; padding: 12px 20px;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
font-size: 12px; font-size: 12px;
text-transform: uppercase; text-transform: uppercase;

76
src/app/about/about.module.css.backup
View File

@ -30,7 +30,7 @@
.breadcrumb { .breadcrumb {
font-size: 1.1rem; font-size: 1.1rem;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
} }
@ -83,7 +83,7 @@
.sectionTitle { .sectionTitle {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 3rem; font-size: 3rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 2px; letter-spacing: 2px;
@ -92,7 +92,7 @@
.sectionTitleCenter { .sectionTitleCenter {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 3.5rem; font-size: 3.5rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 3rem; margin-bottom: 3rem;
text-align: center; text-align: center;
text-transform: uppercase; text-transform: uppercase;
@ -102,7 +102,7 @@
.text { .text {
font-size: 1.1rem; font-size: 1.1rem;
line-height: 1.8; line-height: 1.8;
color: #C5A059; color: #c49c5c;
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
opacity: 0.9; opacity: 0.9;
font-family: var(--font-lato); font-family: var(--font-lato);
@ -113,14 +113,14 @@
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
max-width: 100%; max-width: 100%;
height: auto; height: auto;
border: 4px solid #C5A059; border: 2px solid #b07c4b
} }
.menuButton { .menuButton {
display: inline-block; display: inline-block;
padding: 15px 40px; padding: 15px 40px;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
font-size: 1.1rem; font-size: 1.1rem;
text-transform: uppercase; text-transform: uppercase;
@ -132,7 +132,7 @@
} }
.menuButton:hover { .menuButton:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #000; color: #000;
} }
@ -149,7 +149,7 @@
background-color: #F5E6D3; background-color: #F5E6D3;
padding: 2.5rem 2rem; padding: 2.5rem 2rem;
text-align: center; text-align: center;
border: 4px solid #C5A059; border: 2px solid #b07c4b
transition: transform 0.3s ease; transition: transform 0.3s ease;
} }
@ -164,7 +164,7 @@
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
border-radius: 8px; border-radius: 8px;
overflow: hidden; overflow: hidden;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
} }
.featureImage { .featureImage {
@ -199,8 +199,8 @@
.sliderBtn { .sliderBtn {
background: transparent; background: transparent;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-size: 2.5rem; font-size: 2.5rem;
width: 50px; width: 50px;
height: 50px; height: 50px;
@ -213,14 +213,14 @@
} }
.sliderBtn:hover { .sliderBtn:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #000; color: #000;
} }
.testimonialCard { .testimonialCard {
background-color: #F5E6D3; background-color: #F5E6D3;
padding: 3rem 2.5rem; padding: 3rem 2.5rem;
border: 4px solid #C5A059; border: 2px solid #b07c4b
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 2rem; gap: 2rem;
@ -250,7 +250,7 @@
height: 70px; height: 70px;
border-radius: 50%; border-radius: 50%;
overflow: hidden; overflow: hidden;
border: 3px solid #C5A059; border: 3px solid #c49c5c;
flex-shrink: 0; flex-shrink: 0;
} }
@ -289,7 +289,7 @@
height: 12px; height: 12px;
border-radius: 50%; border-radius: 50%;
background: transparent; background: transparent;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
cursor: pointer; cursor: pointer;
transition: all 0.3s; transition: all 0.3s;
padding: 0; padding: 0;
@ -297,7 +297,7 @@
.dot:hover, .dot:hover,
.activeDot { .activeDot {
background-color: #C5A059; background-color: #c49c5c;
} }
/* Call to Action Section */ /* Call to Action Section */
@ -316,13 +316,13 @@
padding: 4rem 2rem; padding: 4rem 2rem;
max-width: 800px; max-width: 800px;
margin: 0 auto; margin: 0 auto;
border: 4px solid #C5A059; border: 2px solid #b07c4b
} }
.ctaTitle { .ctaTitle {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 3rem; font-size: 3rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 1rem; margin-bottom: 1rem;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 2px; letter-spacing: 2px;
@ -338,8 +338,8 @@
.ctaButton { .ctaButton {
display: inline-block; display: inline-block;
padding: 15px 40px; padding: 15px 40px;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
font-size: 1.1rem; font-size: 1.1rem;
text-transform: uppercase; text-transform: uppercase;
@ -350,7 +350,7 @@
} }
.ctaButton:hover { .ctaButton:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #000; color: #000;
} }
@ -394,8 +394,8 @@
.sliderBtn { .sliderBtn {
background: transparent; background: transparent;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-size: 2.5rem; font-size: 2.5rem;
width: 50px; width: 50px;
height: 50px; height: 50px;
@ -408,14 +408,14 @@
} }
.sliderBtn:hover { .sliderBtn:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #000; color: #000;
} }
.testimonialCard { .testimonialCard {
background-color: #F5E6D3; background-color: #F5E6D3;
padding: 3rem 2.5rem; padding: 3rem 2.5rem;
border: 4px solid #C5A059; border: 2px solid #b07c4b
display: flex; display: flex;
flex-direction: column; flex-direction: column;
gap: 2rem; gap: 2rem;
@ -445,7 +445,7 @@
height: 70px; height: 70px;
border-radius: 50%; border-radius: 50%;
overflow: hidden; overflow: hidden;
border: 3px solid #C5A059; border: 3px solid #c49c5c;
flex-shrink: 0; flex-shrink: 0;
} }
@ -484,7 +484,7 @@
height: 12px; height: 12px;
border-radius: 50%; border-radius: 50%;
background: transparent; background: transparent;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
cursor: pointer; cursor: pointer;
transition: all 0.3s; transition: all 0.3s;
padding: 0; padding: 0;
@ -492,7 +492,7 @@
.dot:hover, .dot:hover,
.activeDot { .activeDot {
background-color: #C5A059; background-color: #c49c5c;
} }
/* Call to Action Section */ /* Call to Action Section */
@ -511,13 +511,13 @@
padding: 4rem 2rem; padding: 4rem 2rem;
max-width: 800px; max-width: 800px;
margin: 0 auto; margin: 0 auto;
border: 4px solid #C5A059; border: 2px solid #b07c4b
} }
.ctaTitle { .ctaTitle {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 3rem; font-size: 3rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 1rem; margin-bottom: 1rem;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 2px; letter-spacing: 2px;
@ -533,8 +533,8 @@
.ctaButton { .ctaButton {
display: inline-block; display: inline-block;
padding: 15px 40px; padding: 15px 40px;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
font-size: 1.1rem; font-size: 1.1rem;
text-transform: uppercase; text-transform: uppercase;
@ -545,7 +545,7 @@
} }
.ctaButton:hover { .ctaButton:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #000; color: #000;
} }
@ -655,7 +655,7 @@
.faqItem { .faqItem {
background: #fff; background: #fff;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
border-radius: 8px; border-radius: 8px;
overflow: hidden; overflow: hidden;
transition: all 0.3s ease; transition: all 0.3s ease;
@ -683,18 +683,18 @@
} }
.faqQuestion:hover { .faqQuestion:hover {
background-color: #C5A059; background-color: #c49c5c;
} }
.faqQuestionActive { .faqQuestionActive {
background-color: #C5A059; background-color: #c49c5c;
color: #fff; color: #fff;
} }
.faqIcon { .faqIcon {
font-size: 1.5rem; font-size: 1.5rem;
font-weight: bold; font-weight: bold;
color: #C5A059; color: #c49c5c;
transition: transform 0.3s ease; transition: transform 0.3s ease;
flex-shrink: 0; flex-shrink: 0;
margin-left: 1rem; margin-left: 1rem;

20
src/app/about/about_temp.css
View File

@ -30,7 +30,7 @@
.breadcrumb { .breadcrumb {
font-size: 1.1rem; font-size: 1.1rem;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
} }
@ -83,7 +83,7 @@
.sectionTitle { .sectionTitle {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 3rem; font-size: 3rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 2px; letter-spacing: 2px;
@ -92,7 +92,7 @@
.sectionTitleCenter { .sectionTitleCenter {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 3.5rem; font-size: 3.5rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 3rem; margin-bottom: 3rem;
text-align: center; text-align: center;
text-transform: uppercase; text-transform: uppercase;
@ -102,7 +102,7 @@
.text { .text {
font-size: 1.1rem; font-size: 1.1rem;
line-height: 1.8; line-height: 1.8;
color: #C5A059; color: #c49c5c;
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
opacity: 0.9; opacity: 0.9;
font-family: var(--font-lato); font-family: var(--font-lato);
@ -113,14 +113,14 @@
box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3); box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
max-width: 100%; max-width: 100%;
height: auto; height: auto;
border: 4px solid #C5A059; border: 2px solid #b07c4b
} }
.menuButton { .menuButton {
display: inline-block; display: inline-block;
padding: 15px 40px; padding: 15px 40px;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
font-size: 1.1rem; font-size: 1.1rem;
text-transform: uppercase; text-transform: uppercase;
@ -132,7 +132,7 @@
} }
.menuButton:hover { .menuButton:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #000; color: #000;
} }
@ -149,7 +149,7 @@
background-color: #F5E6D3; background-color: #F5E6D3;
padding: 2.5rem 2rem; padding: 2.5rem 2rem;
text-align: center; text-align: center;
border: 4px solid #C5A059; border: 2px solid #b07c4b;
transition: transform 0.3s ease; transition: transform 0.3s ease;
} }
@ -164,5 +164,5 @@
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
border-radius: 8px; border-radius: 8px;
overflow: hidden; overflow: hidden;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
} }

34
src/app/blog/[id]/blogDetail.module.css
View File

@ -19,7 +19,7 @@
.heroTitle { .heroTitle {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 4rem; font-size: 4rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 1rem; margin-bottom: 1rem;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 2px; letter-spacing: 2px;
@ -27,7 +27,7 @@
.breadcrumb { .breadcrumb {
font-size: 1.1rem; font-size: 1.1rem;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
} }
@ -50,7 +50,7 @@
margin: 0 auto; margin: 0 auto;
background: #fff; background: #fff;
padding: 3rem; padding: 3rem;
border: 4px solid #C5A059; border: 2px solid #b07c4b
} }
.meta { .meta {
@ -63,7 +63,7 @@
} }
.category { .category {
background: #C5A059; background: #c49c5c;
color: #fff; color: #fff;
padding: 0.5rem 1rem; padding: 0.5rem 1rem;
border-radius: 4px; border-radius: 4px;
@ -89,7 +89,7 @@
margin-bottom: 2.5rem; margin-bottom: 2.5rem;
border-radius: 8px; border-radius: 8px;
overflow: hidden; overflow: hidden;
border: 3px solid #C5A059; border: 3px solid #c49c5c;
} }
.featuredImage img { .featuredImage img {
@ -111,7 +111,7 @@
color: #5d4037; color: #5d4037;
margin: 2rem 0 1rem; margin: 2rem 0 1rem;
padding-bottom: 0.5rem; padding-bottom: 0.5rem;
border-bottom: 2px solid #C5A059; border-bottom: 2px solid #c49c5c;
} }
.content h3 { .content h3 {
@ -148,7 +148,7 @@
} }
.content a { .content a {
color: #C5A059; color: #c49c5c;
text-decoration: underline; text-decoration: underline;
transition: color 0.3s; transition: color 0.3s;
} }
@ -179,7 +179,7 @@
content: "✓"; content: "✓";
position: absolute; position: absolute;
left: 0; left: 0;
color: #C5A059; color: #c49c5c;
font-weight: bold; font-weight: bold;
font-size: 1.2rem; font-size: 1.2rem;
} }
@ -188,13 +188,13 @@
.content blockquote { .content blockquote {
text-align: center; text-align: center;
background: linear-gradient(135deg, #faf6f0 0%, #f5ede0 100%); background: linear-gradient(135deg, #faf6f0 0%, #f5ede0 100%);
border-left: 6px solid #c5a059; border-left: 6px solid #c49c5c;
/* border-right: 6px solid #c5a059; */ /* border-right: 6px solid #c49c5c; */
/* max-width: 800px; */ /* max-width: 800px; */
margin: 3rem 0px; margin: 3rem 0px;
padding: 10px 20px 10px 20px; padding: 10px 20px 10px 20px;
position: relative; position: relative;
box-shadow: 0 8px 24px #c5a05926; box-shadow: 0 8px 24px #c49c5c26;
} }
.content blockquote p { .content blockquote p {
@ -214,7 +214,7 @@
font-family: var(--font-lato); font-family: var(--font-lato);
font-size: 1rem; font-size: 1rem;
font-style: normal; font-style: normal;
color: #C5A059; color: #c49c5c;
font-weight: 600; font-weight: 600;
} }
@ -232,8 +232,8 @@
display: inline-block; display: inline-block;
padding: 12px 30px; padding: 12px 30px;
background: transparent; background: transparent;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
font-size: 1rem; font-size: 1rem;
font-weight: 600; font-weight: 600;
@ -244,7 +244,7 @@
} }
.backButton:hover { .backButton:hover {
background: #C5A059; background: #c49c5c;
color: #fff; color: #fff;
} }
@ -260,12 +260,12 @@
.errorTitle { .errorTitle {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 3rem; font-size: 3rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 2rem; margin-bottom: 2rem;
} }
.backLink { .backLink {
color: #C5A059; color: #c49c5c;
font-size: 1.2rem; font-size: 1.2rem;
text-decoration: underline; text-decoration: underline;
} }

17
src/app/blog/[id]/page.tsx
View File

@ -1,6 +1,3 @@
'use client'
import { useParams } from 'next/navigation';
import Navbar from "@/components/Navbar/Navbar"; import Navbar from "@/components/Navbar/Navbar";
import Footer from "@/components/Footer/Footer"; import Footer from "@/components/Footer/Footer";
import FAQ from "@/components/FAQ/FAQ"; import FAQ from "@/components/FAQ/FAQ";
@ -9,9 +6,16 @@ import Link from "next/link";
import styles from "./blogDetail.module.css"; import styles from "./blogDetail.module.css";
import { blogData } from "@/utils/constant"; import { blogData } from "@/utils/constant";
export default function BlogDetailPage() { // Generate static paths for all blog posts
const params = useParams(); export function generateStaticParams() {
const slug = params.id as string; return blogData.map((blog) => ({
id: blog.slug,
}));
}
export default async function BlogDetailPage({ params }: { params: Promise<{ id: string }> }) {
const { id } = await params;
const slug = id;
const blog = blogData.find((b) => b.slug === slug); const blog = blogData.find((b) => b.slug === slug);
if (!blog) { if (!blog) {
@ -41,6 +45,7 @@ export default function BlogDetailPage() {
</div> </div>
</section> </section>
{/* Blog Content */} {/* Blog Content */}
<article className={styles.article}> <article className={styles.article}>
<div className={styles.contentContainer}> <div className={styles.contentContainer}>

14
src/app/blog/blog.module.css
View File

@ -21,7 +21,7 @@
.heroTitle { .heroTitle {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 4rem; font-size: 4rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 1rem; margin-bottom: 1rem;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 2px; letter-spacing: 2px;
@ -29,7 +29,7 @@
.breadcrumb { .breadcrumb {
font-size: 1.1rem; font-size: 1.1rem;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
} }
@ -57,7 +57,7 @@
.card { .card {
background-color: #F5E6D3; background-color: #F5E6D3;
border: 4px solid #C5A059; border: 2px solid #b07c4b;
overflow: hidden; overflow: hidden;
transition: transform 0.3s ease, box-shadow 0.3s ease; transition: transform 0.3s ease, box-shadow 0.3s ease;
} }
@ -71,7 +71,7 @@
position: relative; position: relative;
width: 100%; width: 100%;
height: 250px; height: 250px;
border-bottom: 1px solid #C5A059; border-bottom: 1px solid #c49c5c;
} }
.cardContent { .cardContent {
@ -93,7 +93,7 @@
} }
.blogTitle a:hover { .blogTitle a:hover {
color: #C5A059; color: #c49c5c;
} }
.date { .date {
@ -116,7 +116,7 @@
.button { .button {
display: inline-block; display: inline-block;
padding: 10px 25px; padding: 10px 25px;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #5d4037; color: #5d4037;
text-align: center; text-align: center;
transition: all 0.3s ease; transition: all 0.3s ease;
@ -128,7 +128,7 @@
} }
.button:hover { .button:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #fff; color: #fff;
} }

24
src/app/contact/contact.module.css
View File

@ -20,7 +20,7 @@
.heroTitle { .heroTitle {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 4rem; font-size: 4rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 1rem; margin-bottom: 1rem;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 2px; letter-spacing: 2px;
@ -28,7 +28,7 @@
.breadcrumb { .breadcrumb {
font-size: 1.1rem; font-size: 1.1rem;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
} }
@ -61,7 +61,7 @@
.formBlock { .formBlock {
background-color: #F5E6D3; background-color: #F5E6D3;
padding: 2.5rem; padding: 2.5rem;
border: 4px solid #C5A059; border: 2px solid #b07c4b
} }
.title { .title {
@ -70,7 +70,7 @@
color: #5d4037; color: #5d4037;
margin-bottom: 1rem; margin-bottom: 1rem;
font-weight: 600; font-weight: 600;
border-bottom: 3px solid #C5A059; border-bottom: 3px solid #c49c5c;
padding-bottom: 0.5rem; padding-bottom: 0.5rem;
display: inline-block; display: inline-block;
} }
@ -103,7 +103,7 @@
.formLabel { .formLabel {
font-family: var(--font-lato); font-family: var(--font-lato);
color: #C5A059; color: #c49c5c;
font-size: 0.95rem; font-size: 0.95rem;
font-weight: 600; font-weight: 600;
} }
@ -113,7 +113,7 @@
background: #fff; background: #fff;
border: 1px solid #d4c5b0; border: 1px solid #d4c5b0;
padding: 0.9rem; padding: 0.9rem;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
font-size: 0.95rem; font-size: 0.95rem;
transition: border-color 0.3s; transition: border-color 0.3s;
@ -128,7 +128,7 @@
.input:focus, .input:focus,
.textarea:focus { .textarea:focus {
outline: none; outline: none;
border-color: #C5A059; border-color: #c49c5c;
} }
.textarea { .textarea {
@ -144,7 +144,7 @@
} }
.submitButton { .submitButton {
background: #C5A059; background: #c49c5c;
border: none; border: none;
color: #fff; color: #fff;
padding: 15px 40px; padding: 15px 40px;
@ -209,7 +209,7 @@
.locationCard { .locationCard {
background: #F5E6D3; background: #F5E6D3;
padding: 1.5rem; padding: 1.5rem;
border: 4px solid #C5A059; border: 2px solid #b07c4b;
display: flex; display: flex;
align-items: flex-start; align-items: flex-start;
gap: 1.5rem; gap: 1.5rem;
@ -221,7 +221,7 @@
} }
.iconWrapper { .iconWrapper {
background: #C5A059; background: #c49c5c;
width: 50px; width: 50px;
height: 50px; height: 50px;
border-radius: 50%; border-radius: 50%;
@ -267,11 +267,11 @@
.locationPhone { .locationPhone {
font-size: 1.2rem; font-size: 1.2rem;
font-weight: 600; font-weight: 600;
color: #C5A059; color: #c49c5c;
} }
.mapContainer { .mapContainer {
border: 4px solid #C5A059; border: 2px solid #b07c4b;
overflow: hidden; overflow: hidden;
margin-top: 0.5rem; margin-top: 0.5rem;
} }

22
src/app/gallery/gallery.module.css
View File

@ -21,7 +21,7 @@
.heroTitle { .heroTitle {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 4rem; font-size: 4rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 1rem; margin-bottom: 1rem;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 2px; letter-spacing: 2px;
@ -29,7 +29,7 @@
.breadcrumb { .breadcrumb {
font-size: 1.1rem; font-size: 1.1rem;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
} }
@ -58,8 +58,8 @@
.tab { .tab {
background: transparent; background: transparent;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
padding: 12px 30px; padding: 12px 30px;
font-size: 1rem; font-size: 1rem;
cursor: pointer; cursor: pointer;
@ -72,7 +72,7 @@
.tab:hover, .tab:hover,
.activeTab { .activeTab {
background-color: #C5A059; background-color: #c49c5c;
color: #F5E6D3; color: #F5E6D3;
} }
@ -87,7 +87,7 @@
aspect-ratio: 4/3; aspect-ratio: 4/3;
cursor: pointer; cursor: pointer;
overflow: hidden; overflow: hidden;
border: 4px solid #C5A059; border: 2px solid #b07c4b
} }
.image { .image {
@ -118,9 +118,9 @@
} }
.viewText { .viewText {
color: #C5A059; color: #c49c5c;
font-size: 1.2rem; font-size: 1.2rem;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
padding: 0.5rem 1.5rem; padding: 0.5rem 1.5rem;
font-family: var(--font-lato); font-family: var(--font-lato);
text-transform: uppercase; text-transform: uppercase;
@ -163,7 +163,7 @@
right: 0; right: 0;
background: none; background: none;
border: none; border: none;
color: #C5A059; color: #c49c5c;
font-size: 2.5rem; font-size: 2.5rem;
cursor: pointer; cursor: pointer;
transition: color 0.3s; transition: color 0.3s;
@ -178,8 +178,8 @@
top: 50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
background: rgba(197, 160, 89, 0.2); background: rgba(197, 160, 89, 0.2);
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-size: 2rem; font-size: 2rem;
padding: 1rem; padding: 1rem;
cursor: pointer; cursor: pointer;

51
src/app/globals.css
View File

@ -1,11 +1,26 @@
:root { :root {
--color-gold: #b28839; /* Color Variables */
--color-heading: #d3cab3;
--color-button: #d28839;
--color-paragraph: #c49c5c;
--color-border: #b07c4b;
--color-dark: #0a0a0a; --color-dark: #0a0a0a;
--color-input-bg: #e8e0d5; --color-input-bg: #e8e0d5;
--color-text-light: #f5f5f5; --color-text-light: #f5f5f5;
/* Legacy color support (mapped to new colors) */
--color-gold: #d28839;
/* Updated to button color */
/* Font Family Variables */
--font-menu: 'Canva Sans', sans-serif;
--font-heading: 'Playfair Display', serif;
--font-paragraph: 'Canva Sans', sans;
/* Legacy font support */
--font-playfair: 'Playfair Display', serif; --font-playfair: 'Playfair Display', serif;
--font-lato: 'Lato', sans-serif; --font-lato: 'Canva Sans', sans;
--font-cormorant: 'Cormorant Garamond', serif; --font-cormorant: 'Canva Sans', sans-serif;
} }
* { * {
@ -20,7 +35,7 @@ body {
overflow-x: hidden; overflow-x: hidden;
background-color: var(--color-dark); background-color: var(--color-dark);
color: var(--color-text-light); color: var(--color-text-light);
font-family: var(--font-cormorant); font-family: var(--font-paragraph);
font-weight: 300; font-weight: 300;
/* Ensure default font is applied */ /* Ensure default font is applied */
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
@ -31,3 +46,31 @@ a {
color: inherit; color: inherit;
text-decoration: none; text-decoration: none;
} }
/* Global Heading Styles */
h1,
h2,
h3,
h4,
h5,
h6 {
font-family: var(--font-heading);
color: var(--color-heading);
}
/* Global Paragraph Styles */
p {
font-family: var(--font-paragraph);
color: var(--color-paragraph);
}
/* Global Button Styles */
button {
font-family: var(--font-paragraph);
background-color: var(--color-button);
}
/* Global Border Utility */
.border-standard {
border-color: var(--color-border);
}

41
src/app/layout.tsx
View File

@ -1,39 +1,16 @@
import type { Metadata } from "next"; import type { Metadata } from "next";
import { Playfair_Display, Lato, Cinzel, Inter, Cormorant_Garamond } from "next/font/google"; import { Playfair_Display } from "next/font/google";
import "./globals.css"; import "./globals.css";
import ScrollToTop from "@/components/ScrollToTop/ScrollToTop"; import ScrollToTop from "@/components/ScrollToTop/ScrollToTop";
const playfair = Playfair_Display({ const playfairDisplay = Playfair_Display({
subsets: ["latin"], subsets: ["latin"],
variable: "--font-playfair", variable: "--font-heading",
display: "swap", display: "swap",
}); });
const lato = Lato({ // Note: Canva Sans is loaded via CDN in the head section below
weight: ["300", "400", "700"], // We'll use system fonts as fallback in the CSS variables
subsets: ["latin"],
variable: "--font-lato",
display: "swap",
});
const cinzel = Cinzel({
subsets: ["latin"],
variable: "--font-cinzel",
display: "swap",
});
const inter = Inter({
subsets: ["latin"],
variable: "--font-inter",
display: "swap",
});
const cormorantGaramond = Cormorant_Garamond({
weight: ["300", "400"],
subsets: ["latin"],
variable: "--font-cormorant",
display: "swap",
});
export const metadata: Metadata = { export const metadata: Metadata = {
title: "Antalya Restaurant - Book A Table", title: "Antalya Restaurant - Book A Table",
@ -48,8 +25,12 @@ export default function RootLayout({
children: React.ReactNode children: React.ReactNode
}) { }) {
return ( return (
<html lang="en" className={`${playfair.variable} ${lato.variable} ${cinzel.variable} ${inter.variable} ${cormorantGaramond.variable}`}> <html lang="en" className={playfairDisplay.variable}>
<body className={cormorantGaramond.className}> <head>
<link rel="preconnect" href="https://fonts.cdnfonts.com" />
<link href="https://fonts.cdnfonts.com/css/canva-sans" rel="stylesheet" />
</head>
<body>
<Navbar /> <Navbar />
{children} {children}
<ScrollToTop /> <ScrollToTop />

14
src/app/menu/menu.module.css
View File

@ -22,7 +22,7 @@
.heroTitle { .heroTitle {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 4rem; font-size: 4rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 1rem; margin-bottom: 1rem;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 2px; letter-spacing: 2px;
@ -30,7 +30,7 @@
.breadcrumb { .breadcrumb {
font-size: 1.1rem; font-size: 1.1rem;
color: #C5A059; color: #c49c5c;
font-family: var(--font-lato); font-family: var(--font-lato);
} }
@ -61,8 +61,8 @@
.tab { .tab {
background: transparent; background: transparent;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
padding: 12px 30px; padding: 12px 30px;
font-size: 1rem; font-size: 1rem;
cursor: pointer; cursor: pointer;
@ -75,7 +75,7 @@
.tab:hover, .tab:hover,
.activeTab { .activeTab {
background-color: #C5A059; background-color: #c49c5c;
color: #F5E6D3; color: #F5E6D3;
transform: translateY(-2px); transform: translateY(-2px);
} }
@ -89,7 +89,7 @@
.menuCard { .menuCard {
display: flex; display: flex;
gap: 1.2rem; gap: 1.2rem;
background: #c5a059; background: #c49c5c;
padding: 1.2rem; padding: 1.2rem;
border: 1px solid rgba(197, 160, 89, 0.2); border: 1px solid rgba(197, 160, 89, 0.2);
transition: all 0.4s ease; transition: all 0.4s ease;
@ -134,7 +134,7 @@
} }
.menuCard:hover { .menuCard:hover {
background: #c5a059; background: #c49c5c;
border-color: #F5E6D3; border-color: #F5E6D3;
transform: translateY(-5px); transform: translateY(-5px);
box-shadow: 0 10px 30px rgba(197, 160, 89, 0.2); box-shadow: 0 10px 30px rgba(197, 160, 89, 0.2);

14
src/components/About/About.module.css
View File

@ -63,13 +63,13 @@
width: 60px; width: 60px;
height: auto; height: auto;
margin-bottom: 30px; margin-bottom: 30px;
color: #C5A059; color: #c49c5c;
} }
.title { .title {
font-family: var(--font-cinzel), serif; font-family: var(--font-cinzel), serif;
font-size: 3.5rem; font-size: 3.5rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 10px; margin-bottom: 10px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 2px; letter-spacing: 2px;
@ -79,7 +79,7 @@
.subtitle { .subtitle {
font-family: var(--font-cinzel), serif; font-family: var(--font-cinzel), serif;
font-size: 1.4rem; font-size: 1.4rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 40px; margin-bottom: 40px;
font-weight: 400; font-weight: 400;
} }
@ -87,7 +87,7 @@
.text { .text {
font-family: var(--font-inter), sans-serif; font-family: var(--font-inter), sans-serif;
/* Or specific font from image */ /* Or specific font from image */
color: #C5A059; color: #c49c5c;
/* Goldish text color as seen in image */ /* Goldish text color as seen in image */
line-height: 1.8; line-height: 1.8;
margin-bottom: 50px; margin-bottom: 50px;
@ -99,8 +99,8 @@
.button { .button {
display: inline-block; display: inline-block;
padding: 15px 40px; padding: 15px 40px;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-family: var(--font-cinzel), serif; font-family: var(--font-cinzel), serif;
font-size: 1.1rem; font-size: 1.1rem;
text-transform: uppercase; text-transform: uppercase;
@ -111,7 +111,7 @@
} }
.button:hover { .button:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #000; color: #000;
} }

8
src/components/About/AboutTailwind.tsx
View File

@ -6,7 +6,7 @@ export default function AboutSection() {
return ( return (
<section className="relative w-full bg-[#0a0a0a] py-20 px-4 sm:px-6 lg:px-8 flex justify-center items-center"> <section className="relative w-full bg-[#0a0a0a] py-20 px-4 sm:px-6 lg:px-8 flex justify-center items-center">
{/* Main Container with Gold Border */} {/* Main Container with Gold Border */}
<div className="relative w-full max-w-7xl border-4 border-[#C5A059] p-2 sm:p-4"> <div className="relative w-full max-w-7xl border-4 border-[#c49c5c] p-2 sm:p-4">
{/* Inner Flex Container */} {/* Inner Flex Container */}
<div className="flex flex-col lg:flex-row w-full h-full"> <div className="flex flex-col lg:flex-row w-full h-full">
@ -31,12 +31,12 @@ export default function AboutSection() {
{/* Ornamental Icon */} {/* Ornamental Icon */}
<div className="mb-6"> <div className="mb-6">
<svg width="40" height="40" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"> <svg width="40" height="40" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M12 2L14.5 9.5L22 12L14.5 14.5L12 22L9.5 14.5L2 12L9.5 9.5L12 2Z" fill="#C5A059" /> <path d="M12 2L14.5 9.5L22 12L14.5 14.5L12 22L9.5 14.5L2 12L9.5 9.5L12 2Z" fill="#c49c5c" />
</svg> </svg>
</div> </div>
{/* Title */} {/* Title */}
<h2 className="text-[#C5A059] font-serif text-4xl lg:text-6xl uppercase tracking-widest mb-4"> <h2 className="text-[#c49c5c] font-serif text-4xl lg:text-6xl uppercase tracking-widest mb-4">
About Antalya About Antalya
</h2> </h2>
@ -53,7 +53,7 @@ export default function AboutSection() {
</p> </p>
{/* Button */} {/* Button */}
<button className="px-8 py-3 border-2 border-[#C5A059] text-[#C5A059] uppercase tracking-wider hover:bg-[#C5A059] hover:text-black transition-all duration-300 font-medium"> <button className="px-8 py-3 border-2 border-[#c49c5c] text-[#c49c5c] uppercase tracking-wider hover:bg-[#c49c5c] hover:text-black transition-all duration-300 font-medium">
Learn More Learn More
</button> </button>
</div> </div>

17
src/components/Blogs/Blogs.module.css
View File

@ -12,7 +12,7 @@
.title { .title {
font-family: var(--font-cinzel), serif; font-family: var(--font-cinzel), serif;
font-size: 3.5rem; font-size: 3.5rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 60px; margin-bottom: 60px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 2px; letter-spacing: 2px;
@ -33,7 +33,7 @@
background-color: #F5E6D3; background-color: #F5E6D3;
/* Cream background */ /* Cream background */
padding: 20px; padding: 20px;
border: 4px solid #C5A059; border: 2px solid #b07c4b;
/* Gold border */ /* Gold border */
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -53,7 +53,7 @@
width: 100%; width: 100%;
height: 250px; height: 250px;
margin-bottom: 25px; margin-bottom: 25px;
border: 1px solid #C5A059; border: 1px solid #c49c5c;
/* Inner border for image */ /* Inner border for image */
} }
@ -80,7 +80,7 @@
.button { .button {
display: inline-block; display: inline-block;
padding: 10px 25px; padding: 10px 25px;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #5d4037; color: #5d4037;
font-family: var(--font-inter), sans-serif; font-family: var(--font-inter), sans-serif;
text-transform: uppercase; text-transform: uppercase;
@ -93,7 +93,7 @@
} }
.button:hover { .button:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #fff; color: #fff;
} }
@ -101,7 +101,7 @@
position: absolute; position: absolute;
top: 50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
color: #C5A059; color: #c49c5c;
font-size: 3rem; font-size: 3rem;
cursor: pointer; cursor: pointer;
background: none; background: none;
@ -129,7 +129,7 @@
.viewMoreButton { .viewMoreButton {
display: inline-block; display: inline-block;
padding: 15px 40px; padding: 15px 40px;
border: 1px solid #C5A059; border: 1px solid #c49c5c;
color: #fff; color: #fff;
font-family: var(--font-inter), sans-serif; font-family: var(--font-inter), sans-serif;
text-transform: uppercase; text-transform: uppercase;
@ -141,7 +141,7 @@
} }
.viewMoreButton:hover { .viewMoreButton:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #000; color: #000;
} }
@ -231,6 +231,7 @@
.card:nth-child(2) { .card:nth-child(2) {
display: none; display: none;
} }
.card:nth-child(3) { .card:nth-child(3) {
display: none; display: none;
} }

6
src/components/BookTable/BookTable.tsx
View File

@ -153,7 +153,7 @@ export default function BookTable() {
name="name" name="name"
required required
className={styles.input} className={styles.input}
placeholder="Your Full Name" placeholder="Name"
value={formData.name} value={formData.name}
onChange={handleChange} onChange={handleChange}
/> />
@ -169,7 +169,7 @@ export default function BookTable() {
name="phone" name="phone"
required required
className={styles.input} className={styles.input}
placeholder="(519) 000-0000" placeholder="Phone"
value={formData.phone} value={formData.phone}
onChange={handleChange} onChange={handleChange}
/> />
@ -197,7 +197,7 @@ export default function BookTable() {
id="message" id="message"
name="message" name="message"
className={styles.textarea} className={styles.textarea}
placeholder="Any special requests..." placeholder="Message..."
maxLength={500} maxLength={500}
value={formData.message} value={formData.message}
onChange={handleChange} onChange={handleChange}

8
src/components/FAQ/FAQ.module.css
View File

@ -23,7 +23,7 @@
.faqItem { .faqItem {
background: #fff; background: #fff;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
border-radius: 8px; border-radius: 8px;
overflow: hidden; overflow: hidden;
transition: all 0.3s ease; transition: all 0.3s ease;
@ -51,14 +51,14 @@
} }
.faqQuestion.active { .faqQuestion.active {
background-color: #C5A059; background-color: #c49c5c;
color: #fff; color: #fff;
} }
.icon { .icon {
font-size: 1.5rem; font-size: 1.5rem;
font-weight: bold; font-weight: bold;
color: #C5A059; color: #c49c5c;
transition: transform 0.3s ease; transition: transform 0.3s ease;
flex-shrink: 0; flex-shrink: 0;
margin-left: 1rem; margin-left: 1rem;
@ -89,7 +89,7 @@
} }
.faqContent a { .faqContent a {
color: #C5A059; color: #c49c5c;
text-decoration: underline; text-decoration: underline;
transition: color 0.3s; transition: color 0.3s;
} }

30
src/components/Footer/Footer.module.css
View File

@ -1,22 +1,22 @@
.footer { .footer {
position: relative; position: relative;
background-color: #2a0a0a; background-color: #2a0a0a;
background-image: url('/images/footer-bg.png'); background-image: url('/images/footer.png');
background-size: cover; background-size: cover;
background-position: center; background-position: center;
background-repeat: no-repeat; background-repeat: no-repeat;
color: #C5A059; color: #d3cab3;
padding: 60px 40px; padding: 60px 40px;
font-family: var(--font-lato); font-family: var(--font-lato);
} }
/* The Gold Border Container */ /* The Gold Border Container */
.borderWrapper { .borderWrapper {
/* border: 2px solid #8B6E38; */ border: 4px solid #b07c4b;
/* Darker gold/bronze border */ /* Darker gold/bronze border */
padding: 40px; padding: 40px;
position: relative; position: relative;
max-width: 1600px; max-width: 1900px;
margin: 0 auto; margin: 0 auto;
} }
@ -56,7 +56,7 @@
font-size: 0.95rem; font-size: 0.95rem;
line-height: 1.6; line-height: 1.6;
margin-bottom: 2rem; margin-bottom: 2rem;
color: #C5A059; color: #c49c5c;
opacity: 0.9; opacity: 0.9;
max-width: 400px; max-width: 400px;
} }
@ -74,7 +74,7 @@
width: 40px; width: 40px;
height: 40px; height: 40px;
border-radius: 50%; border-radius: 50%;
background-color: #C5A059; background-color: #c49c5c;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
@ -99,7 +99,7 @@
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 1.5rem; font-size: 1.5rem;
margin-bottom: 1.5rem; margin-bottom: 1.5rem;
color: #C5A059; color: #d3cab3;
text-transform: capitalize; text-transform: capitalize;
} }
@ -116,7 +116,7 @@
.link { .link {
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 1.1rem; font-size: 1.1rem;
color: #C5A059; color: #c49c5c;
text-decoration: none; text-decoration: none;
transition: color 0.3s ease; transition: color 0.3s ease;
} }
@ -133,7 +133,7 @@
.contactInfo { .contactInfo {
font-size: 1rem; font-size: 1rem;
line-height: 1.8; line-height: 1.8;
color: #C5A059; color: #c49c5c;
} }
.address { .address {
@ -149,7 +149,7 @@
} }
.contactRow a { .contactRow a {
color: #C5A059; color: #c49c5c;
text-decoration: none; text-decoration: none;
transition: color 0.3s; transition: color 0.3s;
} }
@ -167,13 +167,13 @@
font-family: var(--font-playfair); font-family: var(--font-playfair);
font-size: 1.3rem; font-size: 1.3rem;
margin: 2rem 0 1rem; margin: 2rem 0 1rem;
color: #C5A059; color: #d3cab3;
} }
.hours { .hours {
font-size: 1rem; font-size: 1rem;
line-height: 1.8; line-height: 1.8;
color: #C5A059; color: #c49c5c;
} }
/* Copyright */ /* Copyright */
@ -183,18 +183,18 @@
padding-top: 1.5rem; padding-top: 1.5rem;
/* border-top: 1px solid rgba(197, 160, 89, 0.3); */ /* border-top: 1px solid rgba(197, 160, 89, 0.3); */
font-size: 0.9rem; font-size: 0.9rem;
color: #C5A059; color: #c49c5c;
opacity: 0.8; opacity: 0.8;
} }
.copyright a { .copyright a {
color: #fff; color: #d3cab3;
text-decoration: none; text-decoration: none;
transition: color 0.3s; transition: color 0.3s;
} }
.copyright a:hover { .copyright a:hover {
color: #C5A059; color: #d3cab3;
} }
@media (max-width: 1024px) { @media (max-width: 1024px) {

9
src/components/Gallery/Gallery.module.css
View File

@ -10,7 +10,7 @@
.title { .title {
font-family: var(--font-cinzel), serif; font-family: var(--font-cinzel), serif;
font-size: 3.5rem; font-size: 3.5rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 10px; margin-bottom: 10px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 2px; letter-spacing: 2px;
@ -31,11 +31,10 @@
cursor: pointer; cursor: pointer;
overflow: hidden; overflow: hidden;
/* Outer golden border */ /* Outer golden border */
border: 4px solid #C5A059; border: 2px solid #b07c4b;
/* Inner border effect using box-shadow */ /* Inner border effect using box-shadow */
box-shadow: box-shadow: inset 0 0 0 3px #2a1810,
inset 0 0 0 3px #2a1810, inset 0 0 0 6px #c49c5c;
inset 0 0 0 6px #C5A059;
transition: transform 0.3s ease; transition: transform 0.3s ease;
background-color: #1a0f08; background-color: #1a0f08;
} }

4
src/components/Hero/Hero.module.css
View File

@ -78,9 +78,9 @@
} }
.btn { .btn {
padding: 15px 25px; padding: 25px 40px;
font-family: var(--font-lato); font-family: var(--font-lato);
font-size: 12px; font-size: 20px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 1px; letter-spacing: 1px;
cursor: pointer; cursor: pointer;

4
src/components/Navbar/Navbar.module.css
View File

@ -82,7 +82,7 @@
.bar { .bar {
width: 30px; width: 30px;
height: 3px; height: 3px;
background-color: #C5A059; background-color: #c49c5c;
transition: all 0.3s ease; transition: all 0.3s ease;
} }
@ -139,7 +139,7 @@
} }
.mobileNavLink:hover { .mobileNavLink:hover {
color: #C5A059; color: #c49c5c;
} }
@media (max-width: 1024px) { @media (max-width: 1024px) {

18
src/components/PopularDishes/PopularDishes.module.css
View File

@ -11,7 +11,7 @@
.title { .title {
font-family: var(--font-cinzel), serif; font-family: var(--font-cinzel), serif;
font-size: 3.5rem; font-size: 3.5rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 60px; margin-bottom: 60px;
text-transform: uppercase; text-transform: uppercase;
letter-spacing: 2px; letter-spacing: 2px;
@ -30,7 +30,7 @@
background-color: #F5E6D3; background-color: #F5E6D3;
/* Cream background */ /* Cream background */
padding: 20px; padding: 20px;
border: 4px solid #C5A059; border: 2px solid #b07c4b;
/* Gold border */ /* Gold border */
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -47,14 +47,14 @@
width: 100%; width: 100%;
height: 300px; height: 300px;
margin-bottom: 25px; margin-bottom: 25px;
border: 1px solid #C5A059; border: 1px solid #c49c5c;
/* Inner border for image */ /* Inner border for image */
} }
.dishName { .dishName {
font-family: var(--font-cinzel), serif; font-family: var(--font-cinzel), serif;
font-size: 1.8rem; font-size: 1.8rem;
color: #c5a059; color: #c49c5c;
/* Dark brown text */ /* Dark brown text */
margin-bottom: 15px; margin-bottom: 15px;
font-weight: 600; font-weight: 600;
@ -74,8 +74,8 @@
.button { .button {
display: inline-block; display: inline-block;
padding: 12px 30px; padding: 12px 30px;
border: 2px solid #C5A059; border: 2px solid #b07c4b;
color: #C5A059; color: #c49c5c;
font-family: var(--font-inter), sans-serif; font-family: var(--font-inter), sans-serif;
text-transform: uppercase; text-transform: uppercase;
font-size: 0.9rem; font-size: 0.9rem;
@ -86,7 +86,7 @@
} }
.button:hover { .button:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #fff; color: #fff;
} }
@ -97,7 +97,7 @@
.viewMoreButton { .viewMoreButton {
display: inline-block; display: inline-block;
padding: 15px 40px; padding: 15px 40px;
border: 1px solid #C5A059; border: 1px solid #c49c5c;
color: #fff; color: #fff;
font-family: var(--font-inter), sans-serif; font-family: var(--font-inter), sans-serif;
text-transform: uppercase; text-transform: uppercase;
@ -108,7 +108,7 @@
} }
.viewMoreButton:hover { .viewMoreButton:hover {
background-color: #C5A059; background-color: #c49c5c;
color: #000; color: #000;
} }

2
src/components/ScrollToTop/ScrollToTop.module.css
View File

@ -5,7 +5,7 @@
width: 3.5rem; width: 3.5rem;
height: 3.5rem; height: 3.5rem;
border-radius: 50%; border-radius: 50%;
background-color: #C5A059; background-color: #c49c5c;
/* Gold color matching the theme */ /* Gold color matching the theme */
color: #fff; color: #fff;
border: none; border: none;

10
src/components/Testimonials/Testimonials.module.css
View File

@ -20,7 +20,7 @@
font-family: var(--font-cinzel), serif; font-family: var(--font-cinzel), serif;
/* Assuming Cinzel is available or similar serif */ /* Assuming Cinzel is available or similar serif */
font-size: 3.5rem; font-size: 3.5rem;
color: #C5A059; color: #c49c5c;
text-align: center; text-align: center;
margin-bottom: 60px; margin-bottom: 60px;
letter-spacing: 2px; letter-spacing: 2px;
@ -104,7 +104,7 @@
font-family: var(--font-inter), sans-serif; font-family: var(--font-inter), sans-serif;
/* Assuming Inter or similar */ /* Assuming Inter or similar */
font-size: 1.1rem; font-size: 1.1rem;
color: #C5A059; color: #c49c5c;
margin-bottom: 30px; margin-bottom: 30px;
font-weight: 500; font-weight: 500;
} }
@ -119,7 +119,7 @@
} }
.stars { .stars {
color: #C5A059; color: #c49c5c;
font-size: 1.5rem; font-size: 1.5rem;
letter-spacing: 5px; letter-spacing: 5px;
} }
@ -128,7 +128,7 @@
position: absolute; position: absolute;
top: 50%; top: 50%;
transform: translateY(-50%); transform: translateY(-50%);
color: #C5A059; color: #c49c5c;
font-size: 3rem; font-size: 3rem;
cursor: pointer; cursor: pointer;
background: none; background: none;
@ -192,6 +192,7 @@
max-width: 50%; max-width: 50%;
margin: 0; margin: 0;
} }
.card:nth-child(3) { .card:nth-child(3) {
display: none; display: none;
} }
@ -246,6 +247,7 @@
.card:nth-child(2) { .card:nth-child(2) {
display: none; display: none;
} }
.card:nth-child(3) { .card:nth-child(3) {
display: none; display: none;
} }

2
src/components/Testimonials/TestimonialsTailwind.tsx
View File

@ -181,7 +181,7 @@ const TestimonialsSection: React.FC = () => {
</svg> </svg>
))} ))}
</div> </div>
<button className="px-8 py-3 border-2 border-[#C5A059] text-[#C5A059] uppercase tracking-wider hover:bg-[#C5A059] hover:text-black transition-all duration-300 font-medium"> <button className="px-8 py-3 border-2 border-[#c49c5c] text-[#c49c5c] uppercase tracking-wider hover:bg-[#c49c5c] hover:text-black transition-all duration-300 font-medium">
Learn More Learn More
</button> </button>
</div> </div>