bender/5cbb5bca-d428-4446-b00c-a4555bd383bc
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge version_2 into main

Browse Source 
Merge version_2 into main
This commit was merged in pull request #6.
This commit is contained in:
bender
2026-03-07 13:05:31 +00:00
parent 47f178ad47 fb76c8bd37
commit d29d5bb654
8 changed files with 978 additions and 57 deletions
Download Patch File Download Diff File Expand all files Collapse all files

76
src/app/about/page.tsx Normal file
View File

@@ -0,0 +1,76 @@
"use client";
import { Mail } from "lucide-react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import InlineImageSplitTextAbout from "@/components/sections/about/InlineImageSplitTextAbout";
import ContactSplit from "@/components/sections/contact/ContactSplit";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
export default function AboutPage() {
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="smallMedium"
sizing="largeSmallSizeLargeTitles"
background="circleGradient"
cardStyle="solid"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="solid"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Rehoboth Dental"
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "/about" },
{ name: "Services", id: "services" },
{ name: "Contact", id: "contact" },
]}
button={{ text: "Book Appointment", href: "#contact" }}
animateOnLoad={true}
/>
</div>
<div id="about" data-section="about">
<InlineImageSplitTextAbout
heading={[
{ type: "text", content: "About Rehoboth Dental Clinic" },
]}
useInvertedBackground={false}
buttons={[{ text: "Contact Us", href: "#contact" }]}
buttonAnimation="slide-up"
/>
</div>
<div id="contact" data-section="contact">
<ContactSplit
tag="Get In Touch"
title="Book Your Appointment Today"
description="Join our community of satisfied patients. Schedule your appointment online or reach out directly for more information about our services."
tagIcon={Mail}
tagAnimation="slide-up"
background={{ variant: "sparkles-gradient" }}
useInvertedBackground={true}
imageSrc="http://img.b2bpic.net/free-photo/happy-female-dentist-pointing-digital-tablet-screen-female-patient-clinic_23-2147879186.jpg?_wi=4"
imageAlt="Rehoboth Dental Clinic interior"
mediaAnimation="slide-up"
mediaPosition="right"
inputPlaceholder="Enter your email address"
buttonText="Subscribe"
termsText="By subscribing, you'll receive our dental tips, clinic updates, and exclusive offers. We respect your privacy and will never share your information."
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Rehoboth Dental"
leftLink={{ text: "Privacy Policy", href: "#" }}
rightLink={{ text: "Terms of Service", href: "#" }}
/>
</div>
</ThemeProvider>
);
}

222
src/app/accessibility/page.tsx Normal file
View File

@@ -0,0 +1,222 @@
"use client";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
import { AccessibilityIcon, Eye, Ear, Zap, Heart } from "lucide-react";
export default function AccessibilityPage() {
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="smallMedium"
sizing="largeSmallSizeLargeTitles"
background="circleGradient"
cardStyle="solid"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="solid"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Rehoboth Dental"
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "about" },
{ name: "Services", id: "services" },
{ name: "Contact", id: "/contact" },
{ name: "Accessibility", id: "/accessibility" },
]}
button={{ text: "Book Appointment", href: "/contact" }}
animateOnLoad={true}
/>
</div>
<div className="min-h-screen bg-background pt-32 pb-20">
<div className="container mx-auto px-4 max-w-4xl">
{/* Header */}
<div className="text-center mb-16">
<h1 className="text-5xl md:text-6xl font-bold mb-6 text-foreground">
Accessibility Statement
</h1>
<p className="text-lg text-foreground/80 max-w-2xl mx-auto">
At Rehoboth Dental Clinic, we are committed to providing accessible and inclusive dental care for all patients.
</p>
</div>
{/* Main Content */}
<div className="space-y-12">
{/* Facility Accessibility */}
<section className="bg-card rounded-lg p-8 border border-background-accent">
<div className="flex gap-4 mb-4">
<div className="flex-shrink-0">
<Eye className="w-8 h-8 text-primary-cta" />
</div>
<div>
<h2 className="text-2xl font-bold text-foreground mb-4">
Physical Accessibility
</h2>
<ul className="space-y-2 text-foreground/80">
<li className="flex items-start gap-3">
<span className="text-primary-cta mt-1">✓</span>
<span><strong>Wheelchair Access:</strong> Our clinic features wheelchair-accessible entrance with automatic doors and ramps.</span>
</li>
<li className="flex items-start gap-3">
<span className="text-primary-cta mt-1">✓</span>
<span><strong>Accessible Parking:</strong> Reserved parking spaces close to the clinic entrance.</span>
</li>
<li className="flex items-start gap-3">
<span className="text-primary-cta mt-1">✓</span>
<span><strong>Accessible Restrooms:</strong> Wheelchair-accessible restrooms with grab bars and adequate space.</span>
</li>
<li className="flex items-start gap-3">
<span className="text-primary-cta mt-1">✓</span>
<span><strong>Elevator Access:</strong> Elevators available to all clinic levels.</span>
</li>
<li className="flex items-start gap-3">
<span className="text-primary-cta mt-1">✓</span>
<span><strong>Seating Areas:</strong> Comfortable waiting areas with various seating options.</span>
</li>
</ul>
</div>
</div>
</section>
{/* Services for Different Abilities */}
<section className="bg-card rounded-lg p-8 border border-background-accent">
<div className="flex gap-4 mb-4">
<div className="flex-shrink-0">
<Ear className="w-8 h-8 text-primary-cta" />
</div>
<div>
<h2 className="text-2xl font-bold text-foreground mb-4">
Communication Support
</h2>
<ul className="space-y-2 text-foreground/80">
<li className="flex items-start gap-3">
<span className="text-primary-cta mt-1">✓</span>
<span><strong>Sign Language Interpreters:</strong> Available upon request with at least 48 hours notice.</span>
</li>
<li className="flex items-start gap-3">
<span className="text-primary-cta mt-1">✓</span>
<span><strong>Written Materials:</strong> We provide treatment information in writing and large print upon request.</span>
</li>
<li className="flex items-start gap-3">
<span className="text-primary-cta mt-1">✓</span>
<span><strong>Visual Aids:</strong> Diagrams and videos to explain procedures and oral health information.</span>
</li>
<li className="flex items-start gap-3">
<span className="text-primary-cta mt-1">✓</span>
<span><strong>Clear Communication:</strong> Our staff is trained to communicate clearly and patiently with all patients.</span>
</li>
</ul>
</div>
</div>
</section>
{/* Medical Accommodations */}
<section className="bg-card rounded-lg p-8 border border-background-accent">
<div className="flex gap-4 mb-4">
<div className="flex-shrink-0">
<Heart className="w-8 h-8 text-primary-cta" />
</div>
<div>
<h2 className="text-2xl font-bold text-foreground mb-4">
Medical Accommodations
</h2>
<ul className="space-y-2 text-foreground/80">
<li className="flex items-start gap-3">
<span className="text-primary-cta mt-1">✓</span>
<span><strong>Extended Appointments:</strong> Extra time available for patients who need it.</span>
</li>
<li className="flex items-start gap-3">
<span className="text-primary-cta mt-1">✓</span>
<span><strong>Anxiety Management:</strong> Calming environment and sedation options for anxious patients.</span>
</li>
<li className="flex items-start gap-3">
<span className="text-primary-cta mt-1">✓</span>
<span><strong>Mobility Support:</strong> Assistance with positioning in the dental chair for patients with mobility issues.</span>
</li>
<li className="flex items-start gap-3">
<span className="text-primary-cta mt-1">✓</span>
<span><strong>Medication Management:</strong> We work with patients to accommodate necessary medical treatments.</span>
</li>
</ul>
</div>
</div>
</section>
{/* Technology & Digital Access */}
<section className="bg-card rounded-lg p-8 border border-background-accent">
<div className="flex gap-4 mb-4">
<div className="flex-shrink-0">
<Zap className="w-8 h-8 text-primary-cta" />
</div>
<div>
<h2 className="text-2xl font-bold text-foreground mb-4">
Digital Accessibility
</h2>
<ul className="space-y-2 text-foreground/80">
<li className="flex items-start gap-3">
<span className="text-primary-cta mt-1">✓</span>
<span><strong>Accessible Website:</strong> Our website is designed to be accessible to screen readers and other assistive technologies.</span>
</li>
<li className="flex items-start gap-3">
<span className="text-primary-cta mt-1">✓</span>
<span><strong>Online Booking:</strong> Easy-to-use appointment booking system accessible from any device.</span>
</li>
<li className="flex items-start gap-3">
<span className="text-primary-cta mt-1">✓</span>
<span><strong>Email & Phone Support:</strong> Multiple ways to contact us for appointments and inquiries.</span>
</li>
<li className="flex items-start gap-3">
<span className="text-primary-cta mt-1">✓</span>
<span><strong>Telehealth Options:</strong> Virtual consultations available for follow-ups and advice.</span>
</li>
</ul>
</div>
</div>
</section>
{/* How to Request Accommodations */}
<section className="bg-card rounded-lg p-8 border border-background-accent">
<h2 className="text-2xl font-bold text-foreground mb-4">Requesting Accommodations</h2>
<p className="text-foreground/80 mb-4">
We are happy to make accommodations to ensure you receive excellent dental care. To request accommodations:
</p>
<ol className="space-y-2 text-foreground/80 list-decimal list-inside">
<li>Call us at <a href="tel:+250792891566" className="text-primary-cta hover:underline">+250 792 891 566</a></li>
<li>Email us at <a href="mailto:info@rehobothdental.com" className="text-primary-cta hover:underline">info@rehobothdental.com</a></li>
<li>Visit us in person at 68 KG 208 St, Kigali, Rwanda</li>
<li>Message us on WhatsApp with your accessibility needs</li>
</ol>
<p className="text-foreground/80 mt-4 text-sm">
<em>We request at least 48 hours notice for certain accommodations to ensure we can provide the best support.</em>
</p>
</section>
{/* Commitment Statement */}
<section className="bg-primary-cta/10 rounded-lg p-8 border border-primary-cta/30">
<h2 className="text-2xl font-bold text-foreground mb-4">Our Commitment</h2>
<p className="text-foreground/80 mb-4">
Rehoboth Dental Clinic is committed to treating all patients with dignity and respect. We believe that everyone deserves quality dental care, regardless of physical, sensory, cognitive, or any other abilities. We continuously review and improve our accessibility measures to better serve our diverse patient community.
</p>
<p className="text-foreground/80">
If you have any feedback about our accessibility services or encounter any barriers, please don't hesitate to contact us. Your input helps us improve our services for all patients.
</p>
</section>
</div>
</div>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Rehoboth Dental"
leftLink={{ text: "Privacy Policy", href: "#" }}
rightLink={{ text: "Terms of Service", href: "#" }}
/>
</div>
</ThemeProvider>
);
}

352
src/app/book-appointment/page.tsx Normal file
View File

@@ -0,0 +1,352 @@
"use client";
import { useState } from "react";
import { Calendar, Phone, Mail, User, MessageSquare } from "lucide-react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
import Textarea from "@/components/form/Textarea";
interface FormData {
fullName: string;
email: string;
phone: string;
serviceType: string;
preferredDate: string;
preferredTime: string;
message: string;
}
interface FormErrors {
[key: string]: string;
}
export default function BookAppointmentPage() {
const [formData, setFormData] = useState<FormData>({
fullName: "", email: "", phone: "", serviceType: "", preferredDate: "", preferredTime: "", message: ""});
const [errors, setErrors] = useState<FormErrors>({});
const [submitted, setSubmitted] = useState(false);
const validateForm = (): boolean => {
const newErrors: FormErrors = {};
if (!formData.fullName.trim()) {
newErrors.fullName = "Full name is required";
}
if (!formData.email.trim()) {
newErrors.email = "Email is required";
} else if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(formData.email)) {
newErrors.email = "Please enter a valid email address";
}
if (!formData.phone.trim()) {
newErrors.phone = "Phone number is required";
} else if (!/^[\d\s\-\+\(\)]+$/.test(formData.phone) || formData.phone.replace(/\D/g, "").length < 9) {
newErrors.phone = "Please enter a valid phone number";
}
if (!formData.serviceType) {
newErrors.serviceType = "Please select a service";
}
if (!formData.preferredDate) {
newErrors.preferredDate = "Please select a preferred date";
}
if (!formData.preferredTime) {
newErrors.preferredTime = "Please select a preferred time";
}
setErrors(newErrors);
return Object.keys(newErrors).length === 0;
};
const handleSubmit = (e: React.FormEvent) => {
e.preventDefault();
if (validateForm()) {
setSubmitted(true);
setFormData({
fullName: "", email: "", phone: "", serviceType: "", preferredDate: "", preferredTime: "", message: ""});
setTimeout(() => {
setSubmitted(false);
}, 5000);
}
};
const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLSelectElement>) => {
const { name, value } = e.target;
setFormData((prev) => ({
...prev,
[name]: value,
}));
if (errors[name]) {
setErrors((prev) => {
const newErrors = { ...prev };
delete newErrors[name];
return newErrors;
});
}
};
const handleTextareaChange = (value: string) => {
setFormData((prev) => ({
...prev,
message: value,
}));
};
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="smallMedium"
sizing="largeSmallSizeLargeTitles"
background="circleGradient"
cardStyle="solid"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="solid"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Rehoboth Dental"
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "about" },
{ name: "Services", id: "/services" },
{ name: "Contact", id: "contact" },
]}
button={{ text: "Book Appointment", href: "/book-appointment" }}
animateOnLoad={true}
/>
</div>
<div id="booking" data-section="booking" className="min-h-screen bg-background py-20 px-4 md:px-8">
<div className="max-w-2xl mx-auto">
<div className="mb-12 text-center">
<h1 className="text-4xl md:text-5xl font-bold text-foreground mb-4">Book Your Appointment</h1>
<p className="text-lg text-foreground/70">Schedule your visit to Rehoboth Dental Clinic</p>
</div>
{submitted && (
<div className="mb-8 p-6 bg-green-50 border border-green-200 rounded-lg">
<p className="text-green-800 font-medium">✓ Your appointment request has been submitted successfully! We'll contact you shortly to confirm your booking.</p>
</div>
)}
<form onSubmit={handleSubmit} className="bg-card rounded-lg p-8 md:p-12 shadow-lg border border-background-accent">
<div className="grid grid-cols-1 md:grid-cols-2 gap-6 mb-6">
{/* Full Name */}
<div>
<label className="block text-foreground font-medium mb-2 flex items-center gap-2">
<User size={18} />
Full Name
</label>
<input
type="text"
name="fullName"
value={formData.fullName}
onChange={handleChange}
className={`w-full px-4 py-3 bg-background border rounded-lg focus:outline-none transition ${
errors.fullName
? "border-red-500 focus:ring-2 focus:ring-red-200"
: "border-background-accent focus:ring-2 focus:ring-primary-cta/20"
} text-foreground placeholder-foreground/50`}
placeholder="Enter your full name"
/>
{errors.fullName && <p className="text-red-600 text-sm mt-2">{errors.fullName}</p>}
</div>
{/* Email */}
<div>
<label className="block text-foreground font-medium mb-2 flex items-center gap-2">
<Mail size={18} />
Email Address
</label>
<input
type="email"
name="email"
value={formData.email}
onChange={handleChange}
className={`w-full px-4 py-3 bg-background border rounded-lg focus:outline-none transition ${
errors.email
? "border-red-500 focus:ring-2 focus:ring-red-200"
: "border-background-accent focus:ring-2 focus:ring-primary-cta/20"
} text-foreground placeholder-foreground/50`}
placeholder="your.email@example.com"
/>
{errors.email && <p className="text-red-600 text-sm mt-2">{errors.email}</p>}
</div>
{/* Phone */}
<div>
<label className="block text-foreground font-medium mb-2 flex items-center gap-2">
<Phone size={18} />
Phone Number
</label>
<input
type="tel"
name="phone"
value={formData.phone}
onChange={handleChange}
className={`w-full px-4 py-3 bg-background border rounded-lg focus:outline-none transition ${
errors.phone
? "border-red-500 focus:ring-2 focus:ring-red-200"
: "border-background-accent focus:ring-2 focus:ring-primary-cta/20"
} text-foreground placeholder-foreground/50`}
placeholder="+250 792 891 566"
/>
{errors.phone && <p className="text-red-600 text-sm mt-2">{errors.phone}</p>}
</div>
{/* Service Type */}
<div>
<label className="block text-foreground font-medium mb-2 flex items-center gap-2">
<Stethoscope size={18} />
Service Type
</label>
<select
name="serviceType"
value={formData.serviceType}
onChange={handleChange}
className={`w-full px-4 py-3 bg-background border rounded-lg focus:outline-none transition ${
errors.serviceType
? "border-red-500 focus:ring-2 focus:ring-red-200"
: "border-background-accent focus:ring-2 focus:ring-primary-cta/20"
} text-foreground`}
>
<option value="">Select a service...</option>
<option value="checkup">General Dental Checkup</option>
<option value="cleaning">Professional Teeth Cleaning</option>
<option value="filling">Tooth Filling & Restoration</option>
<option value="extraction">Tooth Extraction</option>
<option value="orthodontics">Braces & Orthodontics</option>
<option value="whitening">Professional Teeth Whitening</option>
<option value="emergency">Emergency Dental Care</option>
</select>
{errors.serviceType && <p className="text-red-600 text-sm mt-2">{errors.serviceType}</p>}
</div>
{/* Preferred Date */}
<div>
<label className="block text-foreground font-medium mb-2 flex items-center gap-2">
<Calendar size={18} />
Preferred Date
</label>
<input
type="date"
name="preferredDate"
value={formData.preferredDate}
onChange={handleChange}
className={`w-full px-4 py-3 bg-background border rounded-lg focus:outline-none transition ${
errors.preferredDate
? "border-red-500 focus:ring-2 focus:ring-red-200"
: "border-background-accent focus:ring-2 focus:ring-primary-cta/20"
} text-foreground`}
/>
{errors.preferredDate && <p className="text-red-600 text-sm mt-2">{errors.preferredDate}</p>}
</div>
{/* Preferred Time */}
<div>
<label className="block text-foreground font-medium mb-2">Preferred Time</label>
<select
name="preferredTime"
value={formData.preferredTime}
onChange={handleChange}
className={`w-full px-4 py-3 bg-background border rounded-lg focus:outline-none transition ${
errors.preferredTime
? "border-red-500 focus:ring-2 focus:ring-red-200"
: "border-background-accent focus:ring-2 focus:ring-primary-cta/20"
} text-foreground`}
>
<option value="">Select a time...</option>
<option value="08:00">8:00 AM</option>
<option value="09:00">9:00 AM</option>
<option value="10:00">10:00 AM</option>
<option value="11:00">11:00 AM</option>
<option value="12:00">12:00 PM</option>
<option value="13:00">1:00 PM</option>
<option value="14:00">2:00 PM</option>
<option value="15:00">3:00 PM</option>
<option value="16:00">4:00 PM</option>
<option value="17:00">5:00 PM</option>
<option value="18:00">6:00 PM</option>
<option value="19:00">7:00 PM</option>
<option value="20:00">8:00 PM</option>
</select>
{errors.preferredTime && <p className="text-red-600 text-sm mt-2">{errors.preferredTime}</p>}
</div>
</div>
{/* Message */}
<div className="mb-8">
<label className="block text-foreground font-medium mb-2 flex items-center gap-2">
<MessageSquare size={18} />
Additional Message (Optional)
</label>
<Textarea
value={formData.message}
onChange={handleTextareaChange}
placeholder="Tell us about any specific concerns or preferences..."
rows={5}
/>
</div>
{/* Submit Button */}
<div className="flex gap-4">
<button
type="submit"
className="flex-1 bg-primary-cta hover:bg-primary-cta/90 text-white font-semibold py-3 px-6 rounded-lg transition duration-200 ease-in-out"
>
Book Appointment
</button>
<button
type="reset"
onClick={() => {
setFormData({
fullName: "", email: "", phone: "", serviceType: "", preferredDate: "", preferredTime: "", message: ""});
setErrors({});
}}
className="flex-1 bg-secondary-cta hover:bg-secondary-cta/90 text-foreground font-semibold py-3 px-6 rounded-lg transition duration-200 ease-in-out border border-background-accent"
>
Clear Form
</button>
</div>
</form>
{/* Contact Info */}
<div className="mt-12 grid grid-cols-1 md:grid-cols-3 gap-6">
<div className="bg-card rounded-lg p-6 text-center">
<Phone className="w-8 h-8 text-primary-cta mx-auto mb-3" />
<h3 className="text-foreground font-semibold mb-2">Call Us</h3>
<p className="text-foreground/70">+250 792 891 566</p>
</div>
<div className="bg-card rounded-lg p-6 text-center">
<Mail className="w-8 h-8 text-primary-cta mx-auto mb-3" />
<h3 className="text-foreground font-semibold mb-2">Email Us</h3>
<p className="text-foreground/70">info@rehobothdental.rw</p>
</div>
<div className="bg-card rounded-lg p-6 text-center">
<Calendar className="w-8 h-8 text-primary-cta mx-auto mb-3" />
<h3 className="text-foreground font-semibold mb-2">Clinic Hours</h3>
<p className="text-foreground/70">Mon-Sat: 8:00 AM - 8:00 PM</p>
</div>
</div>
</div>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Rehoboth Dental"
leftLink={{ text: "Privacy Policy", href: "#" }}
rightLink={{ text: "Terms of Service", href: "#" }}
/>
</div>
</ThemeProvider>
);
}

158
src/app/contact/page.tsx Normal file
View File

@@ -0,0 +1,158 @@
"use client";
import { MapPin, Phone, Clock, Mail } from "lucide-react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import ContactSplit from "@/components/sections/contact/ContactSplit";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
export default function ContactPage() {
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="smallMedium"
sizing="largeSmallSizeLargeTitles"
background="circleGradient"
cardStyle="solid"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="solid"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Rehoboth Dental"
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "about" },
{ name: "Services", id: "services" },
{ name: "Contact", id: "/contact" },
{ name: "Accessibility", id: "/accessibility" },
]}
button={{ text: "Book Appointment", href: "#contact" }}
animateOnLoad={true}
/>
</div>
<div className="min-h-screen bg-background pt-32 pb-20">
<div className="container mx-auto px-4 max-w-4xl">
<div className="text-center mb-16">
<h1 className="text-5xl md:text-6xl font-bold mb-6 text-foreground">
Get In Touch
</h1>
<p className="text-lg text-foreground/80 max-w-2xl mx-auto">
Visit our clinic in Kigali or contact us for more information about our services and appointment availability.
</p>
</div>
<div className="grid md:grid-cols-2 gap-12 mb-16">
{/* Location & Hours */}
<div className="space-y-8">
<div className="flex gap-4">
<div className="flex-shrink-0">
<MapPin className="w-6 h-6 text-primary-cta mt-1" />
</div>
<div>
<h3 className="text-xl font-semibold text-foreground mb-2">
Visit Us
</h3>
<p className="text-foreground/80">
68 KG 208 Street<br />
Kigali, Rwanda
</p>
</div>
</div>
<div className="flex gap-4">
<div className="flex-shrink-0">
<Phone className="w-6 h-6 text-primary-cta mt-1" />
</div>
<div>
<h3 className="text-xl font-semibold text-foreground mb-2">
Call Us
</h3>
<p className="text-foreground/80">
<a href="tel:+250792891566" className="hover:text-primary-cta transition">
+250 792 891 566
</a>
</p>
</div>
</div>
<div className="flex gap-4">
<div className="flex-shrink-0">
<Mail className="w-6 h-6 text-primary-cta mt-1" />
</div>
<div>
<h3 className="text-xl font-semibold text-foreground mb-2">
Email
</h3>
<p className="text-foreground/80">
<a href="mailto:info@rehobothdental.com" className="hover:text-primary-cta transition">
info@rehobothdental.com
</a>
</p>
</div>
</div>
<div className="flex gap-4">
<div className="flex-shrink-0">
<Clock className="w-6 h-6 text-primary-cta mt-1" />
</div>
<div>
<h3 className="text-xl font-semibold text-foreground mb-2">
Clinic Hours
</h3>
<div className="text-foreground/80 space-y-1">
<p><strong>Monday - Saturday:</strong> 8:00 AM - 8:00 PM</p>
<p><strong>Sunday:</strong> Closed</p>
<p className="pt-2 text-sm"><em>Emergency services available 24/7</em></p>
</div>
</div>
</div>
</div>
{/* Google Maps Embed */}
<div className="bg-card rounded-lg overflow-hidden shadow-lg h-96 md:h-auto">
<iframe
src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3988.8182625470605!2d30.0644!3d-1.9536!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x19dca5c0a0a0a0a1%3A0x0!2sRehoboth%20Dental%20Clinic!5e0!3m2!1sen!2srw!4v1234567890"
width="100%"
height="100%"
style={{ border: 0 }}
allowFullScreen={true}
loading="lazy"
referrerPolicy="no-referrer-when-downgrade"
title="Rehoboth Dental Clinic Location"
/>
</div>
</div>
{/* Contact Form Section */}
<div className="mb-16">
<ContactSplit
tag="Book Your Appointment"
title="Schedule Your Visit"
description="Connect with us to book your dental appointment or ask any questions about our services."
tagIcon={Mail}
tagAnimation="slide-up"
background={{ variant: "sparkles-gradient" }}
useInvertedBackground={true}
mediaPosition="right"
inputPlaceholder="Enter your email address"
buttonText="Subscribe"
termsText="By subscribing, you'll receive our dental tips, clinic updates, and exclusive offers. We respect your privacy."
/>
</div>
</div>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Rehoboth Dental"
leftLink={{ text: "Privacy Policy", href: "#" }}
rightLink={{ text: "Terms of Service", href: "#" }}
/>
</div>
</ThemeProvider>
);
}

96
src/app/layout.tsx
View File

@@ -1,57 +1,78 @@
import type { Metadata } from "next";
import { Halant } from "next/font/google";
import { Inter } from "next/font/google";
import { Source_Sans_3 } from "next/font/google";
import "./globals.css";
import { ServiceWrapper } from "@/components/ServiceWrapper";
import Tag from "@/tag/Tag";
const halant = Halant({
variable: "--font-halant", subsets: ["latin"],
weight: ["300", "400", "500", "600", "700"],
});
const inter = Inter({
variable: "--font-inter", subsets: ["latin"],
});
const sourceSans3 = Source_Sans_3({
variable: "--font-source-sans-3", subsets: ["latin"],
});
const inter = Inter({ variable: "--font-inter", subsets: ["latin"] });
export const metadata: Metadata = {
title: "Rehoboth Dental Clinic - Professional Dental Care in Kigali", description: "Experience exceptional dental care at Rehoboth Dental Clinic in Kigali, Rwanda. Expert dentists, modern facilities, and comprehensive services. Open Monday-Saturday, 8AM-8PM. Book your appointment today!", keywords: "dental clinic Kigali, dentist Rwanda, dental services, teeth cleaning, orthodontics, emergency dental care, professional dentistry", metadataBase: new URL("https://rehobothdental.rw"),
alternates: {
canonical: "https://rehobothdental.rw"},
title: "Rehoboth Dental Clinic - Professional Dental Care in Kigali", description: "Experience exceptional dental care at Rehoboth Dental Clinic in Kigali. We offer comprehensive dental services including checkups, cleanings, orthodontics, teeth whitening, and emergency care. Book your appointment today!", keywords: "dental clinic, dental care, dentist in Kigali, teeth cleaning, orthodontics, teeth whitening, emergency dental care, professional dentistry", authors: [{ name: "Rehoboth Dental Clinic" }],
openGraph: {
title: "Rehoboth Dental Clinic - Your Smile, Our Priority", description: "Professional dental care in a friendly environment. Comprehensive services from checkups to emergency care.", url: "https://rehobothdental.rw", siteName: "Rehoboth Dental Clinic", type: "website", images: [
title: "Rehoboth Dental Clinic - Professional Dental Care in Kigali", description: "Experience exceptional dental care at Rehoboth Dental Clinic. Comprehensive services for your smile and oral health.", type: "website", url: "https://rehobothdental.com", images: [
{
url: "http://img.b2bpic.net/free-photo/female-patient-opening-her-mouth-doctor-look-her-throat-otolaryngologist-examines-sore-throat-patient_657921-196.jpg", alt: "smiling dentist patient dental clinic professional"},
url: "https://img.b2bpic.net/free-photo/happy-female-dentist-pointing-digital-tablet-screen-female-patient-clinic_23-2147879186.jpg", width: 1200,
height: 630,
alt: "Rehoboth Dental Clinic"},
],
},
twitter: {
card: "summary_large_image", title: "Rehoboth Dental Clinic - Professional Dental Care", description: "Experience exceptional dental care in Kigali. We go the extra mile beyond your expectations.", images: ["http://img.b2bpic.net/free-photo/happy-female-dentist-pointing-digital-tablet-screen-female-patient-clinic_23-2147879186.jpg"],
},
robots: {
index: true,
follow: true,
card: "summary_large_image", title: "Rehoboth Dental Clinic - Professional Dental Care", description: "Book your dental appointment at Rehoboth Dental Clinic in Kigali.", images: [
"https://img.b2bpic.net/free-photo/happy-female-dentist-pointing-digital-tablet-screen-female-patient-clinic_23-2147879186.jpg"],
},
robots: "index, follow", viewport: "width=device-width, initial-scale=1", alternates: {
canonical: "https://rehobothdental.com"},
};
export default function RootLayout({
children,
}: Readonly<{
}: {
children: React.ReactNode;
}>) {
}) {
return (
<html lang="en" suppressHydrationWarning>
<ServiceWrapper>
<body
className={`${halant.variable} ${inter.variable} ${sourceSans3.variable} antialiased`}
>
<Tag />
{children}
<html lang="en">
<head>
<script
type="application/ld+json"
dangerouslySetInnerHTML={{
__html: JSON.stringify({
"@context": "https://schema.org", "@type": "LocalBusiness", "@id": "https://rehobothdental.com", name: "Rehoboth Dental Clinic", description: "Professional dental clinic offering comprehensive dental services in Kigali, Rwanda", image: "https://img.b2bpic.net/free-photo/happy-female-dentist-pointing-digital-tablet-screen-female-patient-clinic_23-2147879186.jpg", url: "https://rehobothdental.com", telephone: "+250792891566", address: {
"@type": "PostalAddress", streetAddress: "68 KG 208 St", addressLocality: "Kigali", postalCode: "N/A", addressCountry: "RW"},
priceRange: "$$", openingHoursSpecification: {
"@type": "OpeningHoursSpecification", dayOfWeek: ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday"],
opens: "08:00", closes: "20:00"},
areaServed: "Kigali, Rwanda", sameAs: [
"https://www.facebook.com/rehobothdental", "https://www.instagram.com/rehobothdental", "https://www.whatsapp.com"],
serviceType: [
"General Dental Checkups", "Professional Teeth Cleaning", "Tooth Filling", "Tooth Extraction", "Orthodontics and Braces", "Teeth Whitening", "Emergency Dental Care"],
}),
}}
/>
<script
type="application/ld+json"
dangerouslySetInnerHTML={{
__html: JSON.stringify({
"@context": "https://schema.org", "@type": "FAQPage", mainEntity: [
{
"@type": "Question", name: "What are your clinic hours?", acceptedAnswer: {
"@type": "Answer", text: "We are open Monday to Saturday from 8:00 AM to 8:00 PM. We are closed on Sundays. For emergencies outside our regular hours, please call +250 792 891 566."},
},
{
"@type": "Question", name: "How do I book an appointment?", acceptedAnswer: {
"@type": "Answer", text: "You can book an appointment online through our website, call us at +250 792 891 566, or visit us in person at 68 KG 208 St, Kigali, Rwanda."},
},
{
"@type": "Question", name: "What payment methods do you accept?", acceptedAnswer: {
"@type": "Answer", text: "We accept Credit Cards, Debit Cards, and NFC Mobile Payments. All payments are processed securely."},
},
{
"@type": "Question", name: "Do you handle emergency cases?", acceptedAnswer: {
"@type": "Answer", text: "Yes, we provide emergency dental care services. Call us immediately at +250 792 891 566 if you have a dental emergency."},
},
],
}),
}}
/>
</head>
<body className={inter.variable}>{children}
<script
dangerouslySetInnerHTML={{
__html: `
@@ -1419,7 +1440,6 @@ export default function RootLayout({
}}
/>
</body>
</ServiceWrapper>
</html>
);
}
}

29
src/app/page.tsx
View File

@@ -1,5 +1,5 @@
"use client";
import { Heart, HelpCircle, Mail, Smile, Stethoscope, Crown } from "lucide-react";
import { Heart, HelpCircle, Mail, Smile, Stethoscope, Crown, Star } from "lucide-react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroSplitDoubleCarousel from "@/components/sections/hero/HeroSplitDoubleCarousel";
@@ -32,6 +32,7 @@ export default function LandingPage() {
{ name: "Home", id: "home" },
{ name: "About", id: "about" },
{ name: "Services", id: "services" },
{ name: "Testimonials", id: "testimonials" },
{ name: "Contact", id: "contact" },
]}
button={{ text: "Book Appointment", href: "#contact" }}
@@ -96,13 +97,17 @@ export default function LandingPage() {
useInvertedBackground={true}
features={[
{
id: 1, title: "General Dental Checkups", description: "Preventive examinations to maintain optimal oral health and catch any issues early", imageSrc: "http://img.b2bpic.net/free-photo/young-female-dentist-showing-patient-dental-xray-dentistry-concept_169016-67181.jpg?_wi=2", imageAlt: "General dental checkup"},
id: 1,
title: "General Dental Checkups", description: "Preventive examinations to maintain optimal oral health and catch any issues early", imageSrc: "http://img.b2bpic.net/free-photo/young-female-dentist-showing-patient-dental-xray-dentistry-concept_169016-67181.jpg?_wi=2", imageAlt: "General dental checkup"},
{
id: 2, title: "Teeth Cleaning", description: "Professional cleaning to remove plaque, tartar, and stains for a brighter smile", imageSrc: "http://img.b2bpic.net/free-photo/close-up-dentist-instruments_23-2151042868.jpg?_wi=2", imageAlt: "Professional teeth cleaning"},
id: 2,
title: "Teeth Cleaning", description: "Professional cleaning to remove plaque, tartar, and stains for a brighter smile", imageSrc: "http://img.b2bpic.net/free-photo/close-up-dentist-instruments_23-2151042868.jpg?_wi=2", imageAlt: "Professional teeth cleaning"},
{
id: 3, title: "Tooth Filling", description: "Restoration of decayed teeth with durable, natural-looking filling materials", imageSrc: "http://img.b2bpic.net/free-photo/jar-cotton-rolls-orthodontic-instruments-dental-procedure_651396-3108.jpg", imageAlt: "Tooth filling restoration"},
id: 3,
title: "Tooth Filling", description: "Restoration of decayed teeth with durable, natural-looking filling materials", imageSrc: "http://img.b2bpic.net/free-photo/jar-cotton-rolls-orthodontic-instruments-dental-procedure_651396-3108.jpg", imageAlt: "Tooth filling restoration"},
{
id: 4, title: "Tooth Extraction", description: "Safe and comfortable extraction procedures when necessary for your dental health", imageSrc: "http://img.b2bpic.net/free-photo/dentist-assistant-surgery-dental-clinic_140725-7688.jpg?_wi=2", imageAlt: "Professional tooth extraction"},
id: 4,
title: "Tooth Extraction", description: "Safe and comfortable extraction procedures when necessary for your dental health", imageSrc: "http://img.b2bpic.net/free-photo/dentist-assistant-surgery-dental-clinic_140725-7688.jpg?_wi=2", imageAlt: "Professional tooth extraction"},
]}
buttons={[{ text: "Explore All Services", href: "#services" }]}
/>
@@ -141,17 +146,17 @@ export default function LandingPage() {
useInvertedBackground={true}
testimonials={[
{
id: "1", name: "Amina Mukwaya, Nurse", date: "Date: 15 November 2024", title: "Best dental clinic in Kigali!", quote: "I have been coming to Rehoboth Dental Clinic for over 2 years now. The staff is incredibly friendly and professional. Dr. James has excellent skills and makes every visit comfortable. I highly recommend them to everyone!", tag: "Regular Patient", avatarSrc: "http://img.b2bpic.net/free-photo/woman-medic-examining-male-patient-office-routine-checkup-discussing-about-treatment-plan_482257-135628.jpg", imageSrc: "http://img.b2bpic.net/free-photo/happy-female-dentist-pointing-digital-tablet-screen-female-patient-clinic_23-2147879186.jpg?_wi=2", imageAlt: "Clinic environment"},
id: "1", name: "Amina Mukwaya, Nurse", date: "15 November 2024", title: "Best dental clinic in Kigali!", quote: "I have been coming to Rehoboth Dental Clinic for over 2 years now. The staff is incredibly friendly and professional. Dr. James has excellent skills and makes every visit comfortable. I highly recommend them to everyone!", tag: "Regular Patient", avatarSrc: "http://img.b2bpic.net/free-photo/woman-medic-examining-male-patient-office-routine-checkup-discussing-about-treatment-plan_482257-135628.jpg", imageSrc: "http://img.b2bpic.net/free-photo/happy-female-dentist-pointing-digital-tablet-screen-female-patient-clinic_23-2147879186.jpg?_wi=2", imageAlt: "Clinic environment"},
{
id: "2", name: "Emmanuel Nsanzimana, Business Owner", date: "Date: 10 November 2024", title: "Professional and reliable service", quote: "From my first visit, I felt well taken care of. The team goes extra mile as promised. My teeth have never felt better. They truly care about their patients and it shows in everything they do.", tag: "Satisfied Client", avatarSrc: "http://img.b2bpic.net/free-photo/joyful-business-woman-with-coffee-cup_23-2148095746.jpg", imageSrc: "http://img.b2bpic.net/free-photo/young-female-dentist-showing-patient-dental-xray-dentistry-concept_169016-67181.jpg?_wi=3", imageAlt: "Professional checkup service"},
id: "2", name: "Emmanuel Nsanzimana, Business Owner", date: "10 November 2024", title: "Professional and reliable service", quote: "From my first visit, I felt well taken care of. The team goes extra mile as promised. My teeth have never felt better. They truly care about their patients and it shows in everything they do.", tag: "Satisfied Client", avatarSrc: "http://img.b2bpic.net/free-photo/joyful-business-woman-with-coffee-cup_23-2148095746.jpg", imageSrc: "http://img.b2bpic.net/free-photo/young-female-dentist-showing-patient-dental-xray-dentistry-concept_169016-67181.jpg?_wi=3", imageAlt: "Professional checkup service"},
{
id: "3", name: "Grace Nyinawumwiza, Teacher", date: "Date: 5 November 2024", title: "Transformed my smile with confidence", quote: "I came in for teeth whitening and the results are amazing! The entire process was painless and quick. The team explained everything clearly. I would absolutely return and recommend to friends and family.", tag: "New Patient", avatarSrc: "http://img.b2bpic.net/free-photo/female-doctor-putting-medical-mask_23-2148757395.jpg", imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-stylish-young-woman_158538-3962.jpg?_wi=3", imageAlt: "Teeth whitening results"},
id: "3", name: "Grace Nyinawumwiza, Teacher", date: "5 November 2024", title: "Transformed my smile with confidence", quote: "I came in for teeth whitening and the results are amazing! The entire process was painless and quick. The team explained everything clearly. I would absolutely return and recommend to friends and family.", tag: "New Patient", avatarSrc: "http://img.b2bpic.net/free-photo/female-doctor-putting-medical-mask_23-2148757395.jpg", imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-stylish-young-woman_158538-3962.jpg?_wi=3", imageAlt: "Teeth whitening results"},
{
id: "4", name: "Joseph Habimana, Engineer", date: "Date: 28 October 2024", title: "Exceptional emergency care", quote: "I had a dental emergency on a weekend and Rehoboth was there for me! The emergency team responded quickly and professionally. My pain was relieved immediately. Thank you for being reliable when I needed you most.", tag: "Emergency Case", avatarSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-doctor-work_23-2149485515.jpg", imageSrc: "http://img.b2bpic.net/free-photo/happy-female-dentist-pointing-digital-tablet-screen-female-patient-clinic_23-2147879186.jpg?_wi=3", imageAlt: "Emergency care facility"},
id: "4", name: "Joseph Habimana, Engineer", date: "28 October 2024", title: "Exceptional emergency care", quote: "I had a dental emergency on a weekend and Rehoboth was there for me! The emergency team responded quickly and professionally. My pain was relieved immediately. Thank you for being reliable when I needed you most.", tag: "Emergency Case", avatarSrc: "http://img.b2bpic.net/free-photo/front-view-smiley-doctor-work_23-2149485515.jpg", imageSrc: "http://img.b2bpic.net/free-photo/happy-female-dentist-pointing-digital-tablet-screen-female-patient-clinic_23-2147879186.jpg?_wi=3", imageAlt: "Emergency care facility"},
{
id: "5", name: "Yvonne Mukamurenzi, Marketing Professional", date: "Date: 20 October 2024", title: "Top-notch dental experience", quote: "I rarely write reviews, but Rehoboth deserves it. The clinic is modern, clean, and welcoming. Prices are fair and service is exceptional. This is where I'll bring all my dental needs from now on.", tag: "Premium Care", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-orthopedic-doctor-working-help-with-recovery-healthcare-specialist-looking-camera-while-preparing-physiotherapy-with-physical-exercise-fitness-medic-clinic_482257-32901.jpg", imageSrc: "http://img.b2bpic.net/free-photo/female-patient-opening-her-mouth-doctor-look-her-throat-otolaryngologist-examines-sore-throat-patient_657921-196.jpg?_wi=3", imageAlt: "Patient satisfaction"},
id: "5", name: "Yvonne Mukamurenzi, Marketing Professional", date: "20 October 2024", title: "Top-notch dental experience", quote: "I rarely write reviews, but Rehoboth deserves it. The clinic is modern, clean, and welcoming. Prices are fair and service is exceptional. This is where I'll bring all my dental needs from now on.", tag: "Premium Care", avatarSrc: "http://img.b2bpic.net/free-photo/portrait-orthopedic-doctor-working-help-with-recovery-healthcare-specialist-looking-camera-while-preparing-physiotherapy-with-physical-exercise-fitness-medic-clinic_482257-32901.jpg", imageSrc: "http://img.b2bpic.net/free-photo/female-patient-opening-her-mouth-doctor-look-her-throat-otolaryngologist-examines-sore-throat-patient_657921-196.jpg?_wi=3", imageAlt: "Patient satisfaction"},
{
id: "6", name: "Charles Kamanzi, Entrepreneur", date: "Date: 15 October 2024", title: "Highly recommended clinic", quote: "My family now comes to Rehoboth for all our dental needs. The team remembers us by name, understands our concerns, and provides personalized care. Worth every visit. A true gem in Kigali!", tag: "Family Care", avatarSrc: "http://img.b2bpic.net/free-photo/black-businessman-happy-expression_1194-2551.jpg", imageSrc: "http://img.b2bpic.net/free-photo/close-up-dentist-instruments_23-2151042868.jpg?_wi=3", imageAlt: "Professional cleaning service"},
id: "6", name: "Charles Kamanzi, Entrepreneur", date: "15 October 2024", title: "Highly recommended clinic", quote: "My family now comes to Rehoboth for all our dental needs. The team remembers us by name, understands our concerns, and provides personalized care. Worth every visit. A true gem in Kigali!", tag: "Family Care", avatarSrc: "http://img.b2bpic.net/free-photo/black-businessman-happy-expression_1194-2551.jpg", imageSrc: "http://img.b2bpic.net/free-photo/close-up-dentist-instruments_23-2151042868.jpg?_wi=3", imageAlt: "Professional cleaning service"},
]}
/>
</div>
@@ -211,4 +216,4 @@ export default function LandingPage() {
</div>
</ThemeProvider>
);
}
}

88
src/app/services/page.tsx Normal file
View File

@@ -0,0 +1,88 @@
"use client";
import { Stethoscope } from "lucide-react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import FeatureCardEight from "@/components/sections/feature/FeatureCardEight";
import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
export default function ServicesPage() {
return (
<ThemeProvider
defaultButtonVariant="icon-arrow"
defaultTextAnimation="entrance-slide"
borderRadius="soft"
contentWidth="smallMedium"
sizing="largeSmallSizeLargeTitles"
background="circleGradient"
cardStyle="solid"
primaryButtonStyle="radial-glow"
secondaryButtonStyle="solid"
headingFontWeight="semibold"
>
<div id="nav" data-section="nav">
<NavbarLayoutFloatingInline
brandName="Rehoboth Dental"
navItems={[
{ name: "Home", id: "/" },
{ name: "About", id: "about" },
{ name: "Services", id: "/services" },
{ name: "Contact", id: "contact" },
]}
button={{ text: "Book Appointment", href: "/book-appointment" }}
animateOnLoad={true}
/>
</div>
<div id="services" data-section="services">
<FeatureCardEight
title="Our Comprehensive Dental Services"
description="Explore our full range of professional dental services designed to meet all your oral health needs. Each service is provided by our experienced team using state-of-the-art technology and techniques."
tag="Complete Dental Solutions"
tagIcon={Stethoscope}
tagAnimation="slide-up"
textboxLayout="default"
useInvertedBackground={true}
features={[
{
id: 1,
title: "General Dental Checkups", description: "Regular preventive examinations to maintain optimal oral health, identify issues early, and establish a foundation for long-term dental wellness", imageSrc: "http://img.b2bpic.net/free-photo/young-female-dentist-showing-patient-dental-xray-dentistry-concept_169016-67181.jpg?_wi=2", imageAlt: "General dental checkup"
},
{
id: 2,
title: "Professional Teeth Cleaning", description: "Deep cleaning to remove plaque, tartar, and surface stains for a brighter, healthier smile. Our hygienists use gentle techniques and modern equipment", imageSrc: "http://img.b2bpic.net/free-photo/close-up-dentist-instruments_23-2151042868.jpg?_wi=2", imageAlt: "Professional teeth cleaning"
},
{
id: 3,
title: "Tooth Filling & Restoration", description: "Restoration of decayed teeth with durable, tooth-colored filling materials that blend seamlessly with your natural teeth", imageSrc: "http://img.b2bpic.net/free-photo/jar-cotton-rolls-orthodontic-instruments-dental-procedure_651396-3108.jpg", imageAlt: "Tooth filling restoration"
},
{
id: 4,
title: "Tooth Extraction", description: "Safe and comfortable extraction procedures when necessary, performed with precision and care to ensure minimal discomfort", imageSrc: "http://img.b2bpic.net/free-photo/dentist-assistant-surgery-dental-clinic_140725-7688.jpg?_wi=2", imageAlt: "Professional tooth extraction"
},
{
id: 5,
title: "Braces & Orthodontics", description: "Professional teeth alignment and correction services to help you achieve the smile you've always wanted. Various options available", imageSrc: "http://img.b2bpic.net/free-photo/caucasian-teenage-girl-smiling-white-background-isolated_169016-48880.jpg?_wi=2", imageAlt: "Orthodontic braces"
},
{
id: 6,
title: "Professional Teeth Whitening", description: "Cosmetic brightening treatment to enhance your smile and boost your confidence with results that last. Safe and effective procedures", imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-stylish-young-woman_158538-3962.jpg?_wi=2", imageAlt: "Professional teeth whitening"
},
{
id: 7,
title: "Emergency Dental Care", description: "24/7 available urgent care services for dental emergencies. Call us immediately for pain relief and emergency treatment", imageSrc: "http://img.b2bpic.net/free-photo/female-dentist-treating-her-patient-teeth_8353-1655.jpg", imageAlt: "Emergency dental care"
},
]}
buttons={[{ text: "Book Your Service", href: "/book-appointment" }]}
/>
</div>
<div id="footer" data-section="footer">
<FooterLogoReveal
logoText="Rehoboth Dental"
leftLink={{ text: "Privacy Policy", href: "#" }}
rightLink={{ text: "Terms of Service", href: "#" }}
/>
</div>
</ThemeProvider>
);
}

14
src/app/styles/variables.css
View File

@@ -10,15 +10,15 @@
--accent: #ffffff;
--background-accent: #ffffff; */
--background: #f5f5f5;
--card: #ffffff;
--foreground: #1c1c1c;
--primary-cta: #1f514c;
--background: #ffffff;
--card: #f0f8f5;
--foreground: #0d3d2d;
--primary-cta: #0a7039;
--primary-cta-text: #f5f5f5;
--secondary-cta: #ffffff;
--secondary-cta: #e8f5f0;
--secondary-cta-text: #1c1c1c;
--accent: #159c49;
--background-accent: #a8e8ba;
--accent: #4db896;
--background-accent: #c8e6d9;
/* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);