bender/a64c10c2-a96b-46cd-b3ed-bfbfa3647678
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Compare commits

merge into: bender:version_1
Branches Tags
bender:main bender:version_4 bender:version_3 bender:version_2 bender:version_1
...
pull from: bender:version_2
Branches Tags
bender:main bender:version_4 bender:version_3 bender:version_2 bender:version_1

6 Commits
version_1 ... version_2

Author SHA1 Message Date
bender
7c5b7c2518 Update theme fonts 2026-03-04 13:26:30 +00:00
bender
0288d65e91 Update theme fonts 2026-03-04 13:26:29 +00:00
bender
4bc6305152 Update src/app/page.tsx 2026-03-04 13:25:14 +00:00
bender
aea1827dec Update src/app/styles/variables.css 2026-03-04 13:23:38 +00:00
bender
fd90789b44 Update src/app/page.tsx 2026-03-04 13:23:37 +00:00
bender
cb4b3d5dbd Merge version_1 into main 
Merge version_1 into main
 2026-03-04 13:11:09 +00:00
4 changed files with 76 additions and 122 deletions
Expand all files Collapse all files

97
src/app/layout.tsx
View File

@@ -4,14 +4,9 @@ import { Inter } from "next/font/google";
import "./globals.css"; import "./globals.css";
import { ServiceWrapper } from "@/components/ServiceWrapper"; import { ServiceWrapper } from "@/components/ServiceWrapper";
import Tag from "@/tag/Tag"; import Tag from "@/tag/Tag";
import { Roboto } from "next/font/google";
const dmSans = DM_Sans({
variable: "--font-dm-sans", subsets: ["latin"],
});
const inter = Inter({
variable: "--font-inter", subsets: ["latin"],
});
export const metadata: Metadata = { export const metadata: Metadata = {
title: "Pet Adoption & Shelter | Paws & Care", description: "Find your perfect pet companion at Paws & Care. Adopt rescue dogs, cats, and small animals. Learn about our adoption process, volunteer, and support our mission to save lives.", keywords: "pet adoption, animal shelter, rescue dogs, rescue cats, pet rescue, adopt a pet, animal welfare", robots: { title: "Pet Adoption & Shelter | Paws & Care", description: "Find your perfect pet companion at Paws & Care. Adopt rescue dogs, cats, and small animals. Learn about our adoption process, volunteer, and support our mission to save lives.", keywords: "pet adoption, animal shelter, rescue dogs, rescue cats, pet rescue, adopt a pet, animal welfare", robots: {
@@ -29,6 +24,12 @@ export const metadata: Metadata = {
}, },
}; };
const roboto = Roboto({
variable: "--font-roboto",
subsets: ["latin"],
weight: ["100", "300", "400", "500", "700", "900"],
});
export default function RootLayout({ export default function RootLayout({
children, children,
}: Readonly<{ }: Readonly<{
@@ -37,7 +38,7 @@ export default function RootLayout({
return ( return (
<html lang="en" suppressHydrationWarning> <html lang="en" suppressHydrationWarning>
<ServiceWrapper> <ServiceWrapper>
<body className={`${dmSans.variable} ${inter.variable} antialiased`}> <body className={`${roboto.variable} antialiased`}>
<Tag /> <Tag />
{children} {children}
@@ -282,9 +283,7 @@ export default function RootLayout({
const getElementInfo = (element, assignId = false) => { const getElementInfo = (element, assignId = false) => {
const rect = element.getBoundingClientRect(); const rect = element.getBoundingClientRect();
const tagName = element.tagName.toLowerCase(); const tagName = element.tagName.toLowerCase();
const selector = getUniqueSelector(element, assignId);
const sectionId = getSectionId(element);
let className = undefined; let className = undefined;
try { try {
if (element.className) { if (element.className) {
@@ -312,8 +311,7 @@ export default function RootLayout({
}; };
if (tagName === 'img') { if (tagName === 'img') {
const originalSrc = extractOriginalUrl(element.src); info.imageData = {
info.imageData = {
src: originalSrc, src: originalSrc,
alt: element.alt || undefined, alt: element.alt || undefined,
naturalWidth: element.naturalWidth, naturalWidth: element.naturalWidth,
@@ -324,8 +322,7 @@ export default function RootLayout({
if (tagName === 'video') { if (tagName === 'video') {
const rawSrc = element.src || element.currentSrc || (element.querySelector('source') && element.querySelector('source').src) || ''; const rawSrc = element.src || element.currentSrc || (element.querySelector('source') && element.querySelector('source').src) || '';
const resolvedSrc = extractOriginalUrl(rawSrc); info.imageData = {
info.imageData = {
src: resolvedSrc, src: resolvedSrc,
alt: element.getAttribute('aria-label') || undefined, alt: element.getAttribute('aria-label') || undefined,
isBackground: false, isBackground: false,
@@ -338,8 +335,7 @@ export default function RootLayout({
if (backgroundImage && backgroundImage !== 'none') { if (backgroundImage && backgroundImage !== 'none') {
const urlMatch = backgroundImage.match(/url(['"]?([^'")]+)['"]?)/); const urlMatch = backgroundImage.match(/url(['"]?([^'")]+)['"]?)/);
if (urlMatch) { if (urlMatch) {
const originalBgSrc = extractOriginalUrl(urlMatch[1]); if (tagName !== 'img') {
if (tagName !== 'img') {
info.imageData = { info.imageData = {
src: originalBgSrc, src: originalBgSrc,
isBackground: true isBackground: true
@@ -351,8 +347,7 @@ export default function RootLayout({
} }
} }
const elementType = getElementType(element); info.elementType = elementType;
info.elementType = elementType;
if (elementType === 'Button') { if (elementType === 'Button') {
const buttonText = element.textContent?.trim() || element.value || element.getAttribute('aria-label') || ''; const buttonText = element.textContent?.trim() || element.value || element.getAttribute('aria-label') || '';
@@ -445,13 +440,11 @@ export default function RootLayout({
}; };
const isTextElement = (element) => { const isTextElement = (element) => {
const elementType = getElementType(element); return elementType === 'Text';
return elementType === 'Text';
}; };
const isButtonElement = (element) => { const isButtonElement = (element) => {
const elementType = getElementType(element); return elementType === 'Button';
return elementType === 'Button';
}; };
const updateButtonText = (element, newText) => { const updateButtonText = (element, newText) => {
@@ -526,8 +519,7 @@ export default function RootLayout({
}; };
const handleInput = () => { const handleInput = () => {
const elementInfo = getElementInfo(element); let currentText = element.textContent;
let currentText = element.textContent;
// Ensure there's always at least a space to keep the element editable // Ensure there's always at least a space to keep the element editable
if (currentText === '' || currentText === null || currentText.length === 0) { if (currentText === '' || currentText === null || currentText.length === 0) {
@@ -640,8 +632,7 @@ export default function RootLayout({
}, '*'); }, '*');
if (save && originalContent !== element.textContent) { if (save && originalContent !== element.textContent) {
const elementInfo = getElementInfo(element); let finalText = element.textContent;
let finalText = element.textContent;
// Trim the final text and convert space-only to empty string for saving // Trim the final text and convert space-only to empty string for saving
if (finalText === ' ' || finalText.trim() === '') { if (finalText === ' ' || finalText.trim() === '') {
@@ -770,7 +761,7 @@ export default function RootLayout({
lastMouseX = e.clientX; lastMouseX = e.clientX;
lastMouseY = e.clientY; lastMouseY = e.clientY;
const target = getMostSpecificElement(e.clientX, e.clientY) || e.target; || e.target;
if (!isValidElement(target) || target === hoveredElement || target === selectedElement) { if (!isValidElement(target) || target === hoveredElement || target === selectedElement) {
return; return;
@@ -802,8 +793,7 @@ export default function RootLayout({
hoverOverlay = createHoverOverlay(target); hoverOverlay = createHoverOverlay(target);
} }
const elementType = getElementType(target); showElementTypeLabel(target, elementType);
showElementTypeLabel(target, elementType);
window.parent.postMessage({ window.parent.postMessage({
type: 'webild-element-hover', type: 'webild-element-hover',
@@ -845,7 +835,7 @@ export default function RootLayout({
e.preventDefault(); e.preventDefault();
e.stopPropagation(); e.stopPropagation();
const target = getMostSpecificElement(e.clientX, e.clientY) || e.target; || e.target;
if (!isValidElement(target)) return; if (!isValidElement(target)) return;
if (selectedElement && selectedElement !== target) { if (selectedElement && selectedElement !== target) {
@@ -890,8 +880,7 @@ export default function RootLayout({
hoveredElement = null; hoveredElement = null;
} }
const elementInfo = getElementInfo(target, true); selectedElement.dataset.webildSelector = elementInfo.selector;
selectedElement.dataset.webildSelector = elementInfo.selector;
showElementTypeLabel(target, elementInfo.elementType); showElementTypeLabel(target, elementInfo.elementType);
window.parent.postMessage({ window.parent.postMessage({
@@ -974,8 +963,7 @@ export default function RootLayout({
isScrolling = false; isScrolling = false;
if (lastMouseX > 0 && lastMouseY > 0) { if (lastMouseX > 0 && lastMouseY > 0) {
const target = getMostSpecificElement(lastMouseX, lastMouseY); if (target && isValidElement(target) && target !== selectedElement) {
if (target && isValidElement(target) && target !== selectedElement) {
hoveredElement = target; hoveredElement = target;
const computedStyle = window.getComputedStyle(target); const computedStyle = window.getComputedStyle(target);
@@ -989,8 +977,7 @@ export default function RootLayout({
hoveredElement.classList.add(hoverClass); hoveredElement.classList.add(hoverClass);
hoverOverlay = createHoverOverlay(target); hoverOverlay = createHoverOverlay(target);
const elementType = getElementType(target); showElementTypeLabel(target, elementType);
showElementTypeLabel(target, elementType);
window.parent.postMessage({ window.parent.postMessage({
type: 'webild-element-hover', type: 'webild-element-hover',
@@ -1013,8 +1000,7 @@ export default function RootLayout({
const saveChangeToStorage = (change) => { const saveChangeToStorage = (change) => {
try { try {
const storageKey = getStorageKey(); const existingChanges = JSON.parse(localStorage.getItem(storageKey) || '[]');
const existingChanges = JSON.parse(localStorage.getItem(storageKey) || '[]');
const filteredChanges = existingChanges.filter(c => { const filteredChanges = existingChanges.filter(c => {
return !(c.oldValue === change.oldValue && c.sectionId === change.sectionId); return !(c.oldValue === change.oldValue && c.sectionId === change.sectionId);
@@ -1034,8 +1020,7 @@ export default function RootLayout({
const clearLocalChanges = () => { const clearLocalChanges = () => {
try { try {
const storageKey = getStorageKey(); localStorage.removeItem(storageKey);
localStorage.removeItem(storageKey);
window.parent.postMessage({ window.parent.postMessage({
type: 'webild-local-changes-cleared', type: 'webild-local-changes-cleared',
data: {} data: {}
@@ -1084,8 +1069,7 @@ export default function RootLayout({
if (e.data.type === 'webild-cancel-changes') { if (e.data.type === 'webild-cancel-changes') {
try { try {
const storageKey = getStorageKey(); const savedChanges = localStorage.getItem(storageKey);
const savedChanges = localStorage.getItem(storageKey);
if (savedChanges) { if (savedChanges) {
const changes = JSON.parse(savedChanges); const changes = JSON.parse(savedChanges);
changes.forEach(change => { changes.forEach(change => {
@@ -1107,8 +1091,7 @@ export default function RootLayout({
if (isBackground) { if (isBackground) {
element.style.backgroundImage = change.oldValue ? 'url(' + change.oldValue + ')' : ''; element.style.backgroundImage = change.oldValue ? 'url(' + change.oldValue + ')' : '';
} else { } else {
const oldMediaType = getMediaTypeFromUrl(change.oldValue); if (revertTag === 'video' && oldMediaType === 'image') {
if (revertTag === 'video' && oldMediaType === 'image') {
swapMediaElement(element, 'img', change.oldValue); swapMediaElement(element, 'img', change.oldValue);
} else if (revertTag === 'img' && oldMediaType === 'video') { } else if (revertTag === 'img' && oldMediaType === 'video') {
swapMediaElement(element, 'video', change.oldValue); swapMediaElement(element, 'video', change.oldValue);
@@ -1156,8 +1139,7 @@ export default function RootLayout({
const el = textElements[i]; const el = textElements[i];
if (isTextElement(el) && el.textContent.trim() === (oldValue || '').trim()) { if (isTextElement(el) && el.textContent.trim() === (oldValue || '').trim()) {
element = el; element = el;
const newSelector = getUniqueSelector(element, true); if (newSelector) {
if (newSelector) {
element.dataset.webildSelector = newSelector; element.dataset.webildSelector = newSelector;
} }
break; break;
@@ -1248,10 +1230,8 @@ export default function RootLayout({
replaced = true; replaced = true;
} else if (element.tagName.toLowerCase() === 'img') { } else if (element.tagName.toLowerCase() === 'img') {
oldValue = element.src; oldValue = element.src;
const newMediaType = getMediaTypeFromUrl(newSrc); if (newMediaType === 'video' && allowMediaTypeSwap) {
if (newMediaType === 'video' && allowMediaTypeSwap) { if (selectedElement === element) selectedElement = swapped;
const swapped = swapMediaElement(element, 'video', newSrc);
if (selectedElement === element) selectedElement = swapped;
element = swapped; element = swapped;
} else { } else {
element.src = newSrc; element.src = newSrc;
@@ -1259,11 +1239,9 @@ export default function RootLayout({
replaced = true; replaced = true;
} else if (element.tagName.toLowerCase() === 'video') { } else if (element.tagName.toLowerCase() === 'video') {
oldValue = element.src || element.currentSrc || ''; oldValue = element.src || element.currentSrc || '';
const newMediaType = getMediaTypeFromUrl(newSrc); const sources = element.querySelectorAll('source');
const sources = element.querySelectorAll('source');
if (newMediaType === 'image' && allowMediaTypeSwap) { if (newMediaType === 'image' && allowMediaTypeSwap) {
const swapped = swapMediaElement(element, 'img', newSrc); if (selectedElement === element) selectedElement = swapped;
if (selectedElement === element) selectedElement = swapped;
element = swapped; element = swapped;
} else { } else {
if (sources.length > 0) { if (sources.length > 0) {
@@ -1285,8 +1263,7 @@ export default function RootLayout({
} }
if (replaced) { if (replaced) {
const elementInfo = getElementInfo(element);
let cleanOldValue = oldValue; let cleanOldValue = oldValue;
if (oldValue.includes('url(')) { if (oldValue.includes('url(')) {
const urlMatch = oldValue.match(/url(['"]?([^'")]+)['"]?)/); const urlMatch = oldValue.match(/url(['"]?([^'")]+)['"]?)/);
@@ -1357,13 +1334,7 @@ export default function RootLayout({
} }
}, true); }, true);
const urlCheckInterval = setInterval(() => {
if (lastPathname !== window.location.pathname) {
lastPathname = window.location.pathname;
notifyPageChange();
}
}, 500);
notifyPageChange(); notifyPageChange();
window.webildCleanup = () => { window.webildCleanup = () => {

69
src/app/page.tsx
View File

@@ -2,7 +2,7 @@
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider"; import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay"; import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import HeroBillboard from "@/components/sections/hero/HeroBillboard"; import HeroBillboardCarousel from "@/components/sections/hero/HeroBillboardCarousel";
import TextAbout from "@/components/sections/about/TextAbout"; import TextAbout from "@/components/sections/about/TextAbout";
import ProductCardOne from "@/components/sections/product/ProductCardOne"; import ProductCardOne from "@/components/sections/product/ProductCardOne";
import FeatureCardTwentySeven from "@/components/sections/feature/FeatureCardTwentySeven"; import FeatureCardTwentySeven from "@/components/sections/feature/FeatureCardTwentySeven";
@@ -42,7 +42,7 @@ export default function LandingPage() {
</div> </div>
<div id="hero" data-section="hero"> <div id="hero" data-section="hero">
<HeroBillboard <HeroBillboardCarousel
title="Give a Loving Pet a Forever Home" title="Give a Loving Pet a Forever Home"
description="Meet our adorable animals waiting for their perfect family. Every adoption saves lives and opens homes to joy, companionship, and unconditional love." description="Meet our adorable animals waiting for their perfect family. Every adoption saves lives and opens homes to joy, companionship, and unconditional love."
tag="Adopt Today" tag="Adopt Today"
@@ -54,9 +54,13 @@ export default function LandingPage() {
{ text: "Learn More", href: "#about" }, { text: "Learn More", href: "#about" },
]} ]}
buttonAnimation="slide-up" buttonAnimation="slide-up"
imageSrc="http://img.b2bpic.net/free-photo/woman-interacting-with-rescue-dogs-shelter_23-2148682952.jpg" mediaItems={[
imageAlt="Happy pets at our shelter" { imageSrc: "http://img.b2bpic.net/free-photo/woman-interacting-with-rescue-dogs-shelter_23-2148682952.jpg", imageAlt: "Happy pets at our shelter" },
mediaAnimation="slide-up" { imageSrc: "http://img.b2bpic.net/free-photo/what-good-boy-beautiful-golden-labrador-with-leash-sitting-with-his-owners-park_496169-2472.jpg?_wi=1", imageAlt: "Golden Retriever in park" },
{ imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-woman-holding-tabby-cat_23-2148045665.jpg?_wi=1", imageAlt: "Woman with tabby cat" },
{ imageSrc: "http://img.b2bpic.net/free-photo/selective-focus-shot-adorable-german-shepherd-puppy-with-chew-toy_181624-26888.jpg?_wi=1", imageAlt: "German Shepherd puppy" },
{ imageSrc: "http://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg", imageAlt: "Family with dog" },
]}
/> />
</div> </div>
@@ -77,12 +81,9 @@ export default function LandingPage() {
tag="Available Now" tag="Available Now"
tagIcon={Sparkles} tagIcon={Sparkles}
products={[ products={[
{ { id: "1", name: "Max - Golden Retriever", price: "Adoption Fee: $150", imageSrc: "http://img.b2bpic.net/free-photo/what-good-boy-beautiful-golden-labrador-with-leash-sitting-with-his-owners-park_496169-2472.jpg?_wi=2", imageAlt: "Max the Golden Retriever"},
id: "1", name: "Max - Golden Retriever", price: "Adoption Fee: $150", imageSrc: "http://img.b2bpic.net/free-photo/what-good-boy-beautiful-golden-labrador-with-leash-sitting-with-his-owners-park_496169-2472.jpg", imageAlt: "Max the Golden Retriever"}, { id: "2", name: "Luna - Tabby Cat", price: "Adoption Fee: $75", imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-woman-holding-tabby-cat_23-2148045665.jpg?_wi=2", imageAlt: "Luna the Tabby Cat"},
{ { id: "3", name: "Charlie - Puppy", price: "Adoption Fee: $120", imageSrc: "http://img.b2bpic.net/free-photo/selective-focus-shot-adorable-german-shepherd-puppy-with-chew-toy_181624-26888.jpg?_wi=2", imageAlt: "Charlie the Puppy"},
id: "2", name: "Luna - Tabby Cat", price: "Adoption Fee: $75", imageSrc: "http://img.b2bpic.net/free-photo/young-beautiful-woman-holding-tabby-cat_23-2148045665.jpg", imageAlt: "Luna the Tabby Cat"},
{
id: "3", name: "Charlie - Puppy", price: "Adoption Fee: $120", imageSrc: "http://img.b2bpic.net/free-photo/selective-focus-shot-adorable-german-shepherd-puppy-with-chew-toy_181624-26888.jpg", imageAlt: "Charlie the Puppy"},
]} ]}
gridVariant="three-columns-all-equal-width" gridVariant="three-columns-all-equal-width"
animationType="slide-up" animationType="slide-up"
@@ -99,14 +100,10 @@ export default function LandingPage() {
tag="Simple Steps" tag="Simple Steps"
tagIcon={CheckCircle} tagIcon={CheckCircle}
features={[ features={[
{ { id: "1", title: "Browse & Meet", description: "Explore our available pets online or visit us in person. Spend time with the animals to find your perfect match.", imageSrc: "http://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg?_wi=1", imageAlt: "Browse pets"},
id: "1", title: "Browse & Meet", description: "Explore our available pets online or visit us in person. Spend time with the animals to find your perfect match.", imageSrc: "http://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg?_wi=1", imageAlt: "Browse pets"}, { id: "2", title: "Application", description: "Complete our adoption application. We ask a few questions to ensure a good fit between you and your new pet.", imageSrc: "http://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg?_wi=2", imageAlt: "Application process"},
{ { id: "3", title: "Home Visit", description: "Our team may schedule a quick home visit to ensure a safe environment for your new companion.", imageSrc: "http://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg?_wi=3", imageAlt: "Home visit"},
id: "2", title: "Application", description: "Complete our adoption application. We ask a few questions to ensure a good fit between you and your new pet.", imageSrc: "http://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg?_wi=2", imageAlt: "Application process"}, { id: "4", title: "Welcome Home", description: "Complete the adoption paperwork and take your new family member home to start your wonderful journey together.", imageSrc: "http://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg?_wi=4", imageAlt: "Happy adoption"},
{
id: "3", title: "Home Visit", description: "Our team may schedule a quick home visit to ensure a safe environment for your new companion.", imageSrc: "http://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg?_wi=3", imageAlt: "Home visit"},
{
id: "4", title: "Welcome Home", description: "Complete the adoption paperwork and take your new family member home to start your wonderful journey together.", imageSrc: "http://img.b2bpic.net/free-photo/young-parents-their-small-daughter-enjoying-with-dog-home-grandparents-are-standing-background_637285-5542.jpg?_wi=4", imageAlt: "Happy adoption"},
]} ]}
gridVariant="four-items-2x2-equal-grid" gridVariant="four-items-2x2-equal-grid"
animationType="slide-up" animationType="slide-up"
@@ -123,18 +120,10 @@ export default function LandingPage() {
tag="Happy Homes" tag="Happy Homes"
tagIcon={Heart} tagIcon={Heart}
testimonials={[ testimonials={[
{ { id: "1", name: "Sarah Johnson", role: "Pet Parent", company: "New York", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-young-woman-with-her-dog-park_23-2147902250.jpg", imageAlt: "Sarah with her dog"},
id: "1", name: "Sarah Johnson", role: "Pet Parent", company: "New York", rating: 5, { id: "2", name: "Michael Chen", role: "Cat Lover", company: "California", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/brunette-man-looking-his-cat-embracing-wife-indoor-portrait-happy-family-posing-with-pet_197531-12215.jpg", imageAlt: "Michael with his cat"},
imageSrc: "http://img.b2bpic.net/free-photo/portrait-smiling-young-woman-with-her-dog-park_23-2147902250.jpg", imageAlt: "Sarah with her dog"}, { id: "3", name: "Emily Rodriguez", role: "Dog Rescuer", company: "Texas", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/teenage-girl-her-dog-making-selfie_329181-20369.jpg", imageAlt: "Emily with her rescue dog"},
{ { id: "4", name: "David & Lisa Kim", role: "Family", company: "Seattle", rating: 5, imageSrc: "http://img.b2bpic.net/free-photo/young-couple-walking-their-french-bulldogs-park_1303-17965.jpg", imageAlt: "David and Lisa with their pet"},
id: "2", name: "Michael Chen", role: "Cat Lover", company: "California", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/brunette-man-looking-his-cat-embracing-wife-indoor-portrait-happy-family-posing-with-pet_197531-12215.jpg", imageAlt: "Michael with his cat"},
{
id: "3", name: "Emily Rodriguez", role: "Dog Rescuer", company: "Texas", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/teenage-girl-her-dog-making-selfie_329181-20369.jpg", imageAlt: "Emily with her rescue dog"},
{
id: "4", name: "David & Lisa Kim", role: "Family", company: "Seattle", rating: 5,
imageSrc: "http://img.b2bpic.net/free-photo/young-couple-walking-their-french-bulldogs-park_1303-17965.jpg", imageAlt: "David and Lisa with their pet"},
]} ]}
kpiItems={[ kpiItems={[
{ value: "500+", label: "Pets Adopted This Year" }, { value: "500+", label: "Pets Adopted This Year" },
@@ -173,18 +162,12 @@ export default function LandingPage() {
sideTitle="Frequently Asked Questions" sideTitle="Frequently Asked Questions"
sideDescription="Find answers to common questions about adoption, our facilities, and how to support our mission." sideDescription="Find answers to common questions about adoption, our facilities, and how to support our mission."
faqs={[ faqs={[
{ { id: "1", title: "What is your adoption process?", content: "Our adoption process includes browsing available pets, completing an application, a potential home visit, and finalizing paperwork. The entire process typically takes 3-7 business days."},
id: "1", title: "What is your adoption process?", content: "Our adoption process includes browsing available pets, completing an application, a potential home visit, and finalizing paperwork. The entire process typically takes 3-7 business days."}, { id: "2", title: "What are the adoption fees?", content: "Adoption fees vary based on the animal's age and health status, typically ranging from $50-$200. Fees help cover vaccinations, spaying/neutering, and initial medical care."},
{ { id: "3", title: "Can I volunteer at the shelter?", content: "Yes! We welcome volunteers. Visit our facility or contact us to learn about available volunteer positions in animal care, adoption support, and administrative roles."},
id: "2", title: "What are the adoption fees?", content: "Adoption fees vary based on the animal's age and health status, typically ranging from $50-$200. Fees help cover vaccinations, spaying/neutering, and initial medical care."}, { id: "4", title: "Do you accept donations?", content: "Absolutely. We accept monetary donations, pet supplies, and in-kind contributions. Every donation directly helps us care for our animals and find them loving homes."},
{ { id: "5", title: "What animals do you have available?", content: "We rescue and care for dogs, cats, and small animals including rabbits and guinea pigs. Our available animals are listed on our website with full profiles and photos."},
id: "3", title: "Can I volunteer at the shelter?", content: "Yes! We welcome volunteers. Visit our facility or contact us to learn about available volunteer positions in animal care, adoption support, and administrative roles."}, { id: "6", title: "Are your animals vaccinated and neutered?", content: "Yes, all adopted animals are vaccinated, spayed/neutered, and microchipped. We provide complete medical records with each adoption."},
{
id: "4", title: "Do you accept donations?", content: "Absolutely. We accept monetary donations, pet supplies, and in-kind contributions. Every donation directly helps us care for our animals and find them loving homes."},
{
id: "5", title: "What animals do you have available?", content: "We rescue and care for dogs, cats, and small animals including rabbits and guinea pigs. Our available animals are listed on our website with full profiles and photos."},
{
id: "6", title: "Are your animals vaccinated and neutered?", content: "Yes, all adopted animals are vaccinated, spayed/neutered, and microchipped. We provide complete medical records with each adoption."},
]} ]}
textPosition="left" textPosition="left"
useInvertedBackground={false} useInvertedBackground={false}

4
src/app/styles/base.css
View File

@@ -11,7 +11,7 @@ html {
body { body {
background-color: var(--background); background-color: var(--background);
color: var(--foreground); color: var(--foreground);
font-family: var(--font-inter), sans-serif; font-family: var(--font-roboto), sans-serif;
position: relative; position: relative;
min-height: 100vh; min-height: 100vh;
overscroll-behavior: none; overscroll-behavior: none;
@@ -24,5 +24,5 @@ h3,
h4, h4,
h5, h5,
h6 { h6 {
font-family: var(--font-dm-sans), sans-serif; font-family: var(--font-roboto), sans-serif;
} }

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

@@ -2,23 +2,23 @@
/* Base units */ /* Base units */
/* --vw is set by ThemeProvider */ /* --vw is set by ThemeProvider */
/* --background: #f7f6f7;; /* --background: #0a0a0a;;
--card: #ffffff;; --card: #1a1a1a;;
--foreground: #0c1325;; --foreground: #fffffae6;;
--primary-cta: #0b07ff;; --primary-cta: #fde047;;
--secondary-cta: #ffffff;; --secondary-cta: #1a1a1a;;
--accent: #93b7ff;; --accent: #737373;;
--background-accent: #a8bae8;; */ --background-accent: #737373;; */
--background: #f7f6f7;; --background: #0a0a0a;;
--card: #ffffff;; --card: #1a1a1a;;
--foreground: #0c1325;; --foreground: #fffffae6;;
--primary-cta: #0b07ff;; --primary-cta: #fde047;;
--primary-cta-text: #f7f6f7;; --primary-cta-text: #f7f6f7;;
--secondary-cta: #ffffff;; --secondary-cta: #1a1a1a;;
--secondary-cta-text: #0c1325;; --secondary-cta-text: #0c1325;;
--accent: #93b7ff;; --accent: #737373;;
--background-accent: #a8bae8;; --background-accent: #737373;;
/* text sizing - set by ThemeProvider */ /* text sizing - set by ThemeProvider */
/* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem); /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);