This reverts commit 4d70993817, reversing
changes made to 32ccd49d78.
This commit is contained in:
2026-05-07 08:04:13 +12:00
parent 4d70993817
commit 0d86f450ec
3 changed files with 110 additions and 775 deletions
+90 -725
View File
@@ -1,153 +1,35 @@
<script lang="ts"> <script lang="ts">
import { reveal } from '$lib/actions/reveal'; import { reveal } from '$lib/actions/reveal';
import Icon from '$lib/components/Icon.svelte';
import ServicesSection from '$lib/components/ServicesSection.svelte'; import ServicesSection from '$lib/components/ServicesSection.svelte';
import { getImageMetadata } from '$lib/image-metadata'; import { getImageMetadata } from '$lib/image-metadata';
import type { AboutPageContent, SiteSharedContent } from '$lib/types'; import type { AboutPageContent, SiteSharedContent } from '$lib/types';
export let content: SiteSharedContent; export let content: SiteSharedContent;
export let pageContent: AboutPageContent; export let pageContent: AboutPageContent;
const leadSection = pageContent.sections[0];
const storySections = pageContent.sections.slice(1);
const storyPillars = ['Small and medium dogs', 'Auckland Central', 'Positive reinforcement'];
const careStripItems = [
{ label: 'Vaccinated dogs', icon: 'fas fa-shield-heart' },
{ label: 'Well-mannered groups', icon: 'fas fa-award' },
{ label: 'Comfortable with people', icon: 'fas fa-handshake-angle' },
{ label: 'Social with other dogs', icon: 'fas fa-paw' },
{ label: 'Structured adventures', icon: 'fas fa-tree' },
{ label: 'Small-pack focus', icon: 'fas fa-users' }
];
const trustItems = [
{
icon: 'fas fa-shield-heart',
title: 'First aid trained',
body: 'All walkers hold a current First Aid training certificate.'
},
{
icon: 'fas fa-user-shield',
title: 'Insured and police-checked',
body: 'We are covered by public liability insurance, and each dog walker is police checked.'
},
{
icon: 'fas fa-camera',
title: 'Clear updates',
body: 'Clients get social media updates, photos, and practical feedback after outings.'
},
{
icon: 'fas fa-clipboard-check',
title: 'Thoughtful onboarding',
body: 'Every new dog starts with a Meet & Greet and assessment walks before joining the routine.'
}
];
const workflowItems = [
{
icon: 'fas fa-users',
title: 'Small groups, not chaos',
body: 'Tiny Gang walks are kept to 4-8 dogs, designed specifically for small and medium breeds.'
},
{
icon: 'fas fa-person-walking',
title: 'Solo support when needed',
body: 'One-on-one walks are available for dogs that need more space, more focus, or a different pace.'
},
{
icon: 'fas fa-car-side',
title: 'Pick-up, drop-off, and adventure',
body: 'We collect dogs, head to Auckland parks and beaches, and build outings around movement, sniffing, and manners.'
},
{
icon: 'fas fa-shield-heart',
title: 'Weather and emergency plans',
body: 'We walk in most conditions when it is safe, and if there is an emergency we contact you and follow your vet protocol.'
}
];
const proofItems = content.testimonials.slice(0, 6);
</script> </script>
<main class="about-page"> <main class="about-page">
<section class="about-page-hero"> <section class="about-hero">
<div class="about-inner"> <div class="about-inner">
<h1>{pageContent.title}</h1> <h1>{pageContent.title}</h1>
</div> </div>
</section> </section>
<section class="about-hero"> {#each pageContent.sections as section}
<div class="about-inner"> <section
<div class="about-hero-grid"> use:reveal
<div class="about-hero-copy"> class:about-section-gradient={section.accent === 'gradient'}
<span class="about-kicker">About GoodWalk</span> class="about-section reveal-block"
<h2>{leadSection.title}</h2> >
<p class="about-hero-intro">{leadSection.body[0]}</p> <div class:about-section-reverse={section.reverse} class="about-inner about-section-grid">
<div class="about-copy">
<div class="about-pillars" aria-label="What shapes GoodWalk">
{#each storyPillars as pillar}
<span>{pillar}</span>
{/each}
</div>
</div>
<div class="about-hero-media">
<img
src={leadSection.imageUrl}
alt={leadSection.imageAlt}
width={getImageMetadata(leadSection.imageUrl)?.width}
height={getImageMetadata(leadSection.imageUrl)?.height}
fetchpriority="high"
decoding="async"
/>
</div>
</div>
</div>
</section>
<section class="about-ribbon">
<div class="about-inner">
<div class="about-ribbon-track" aria-label="GoodWalk pack standards">
{#each careStripItems as item, index}
<span class={`about-ribbon-chip about-ribbon-chip-${(index % 3) + 1}`}>
<Icon name={item.icon} />
{item.label}
</span>
{/each}
</div>
</div>
</section>
<section use:reveal class="about-intro-band reveal-block">
<div class="about-inner">
<div class="about-intro-grid">
<div class="about-intro-main">
<span class="about-kicker">Our story</span>
<p>{leadSection.body[1]}</p>
</div>
<aside class="about-intro-aside">
<span class="about-kicker">What clients are choosing</span>
<ul>
<li>Small-group pack walks built for the right dogs</li>
<li>One-on-one walks for dogs needing more space or focus</li>
<li>Puppy visits that build confidence before pack life</li>
</ul>
</aside>
</div>
</div>
</section>
{#each storySections as section, index}
<section use:reveal class={`about-editorial reveal-block ${index % 2 === 0 ? 'about-editorial-tint' : ''}`}>
<div class="about-inner">
<div class:about-editorial-reverse={section.reverse} class="about-editorial-grid">
<div class="about-editorial-copy">
<span class="about-kicker">0{index + 2}</span>
<h2>{section.title}</h2> <h2>{section.title}</h2>
{#each section.body as paragraph} {#each section.body as paragraph}
<p>{paragraph}</p> <p>{paragraph}</p>
{/each} {/each}
</div> </div>
<div class="about-editorial-media"> <div class="about-media">
<img <img
src={section.imageUrl} src={section.imageUrl}
alt={section.imageAlt} alt={section.imageAlt}
@@ -158,97 +40,24 @@
/> />
</div> </div>
</div> </div>
</div>
</section> </section>
{/each} {/each}
<section use:reveal class="about-credentials reveal-block">
<div class="about-inner">
<div class="about-credentials-head">
<span class="about-kicker about-kicker-light">Experience and safety</span>
<h2>Practical trust signals, not filler.</h2>
</div>
<div class="about-credentials-list">
{#each trustItems as item}
<article class="about-credential-row">
<div class="about-credential-mark" aria-hidden="true">
<Icon name={item.icon} />
</div>
<div>
<h3>{item.title}</h3>
<p>{item.body}</p>
</div>
</article>
{/each}
</div>
</div>
</section>
<section use:reveal class="about-workflow reveal-block">
<div class="about-inner">
<div class="about-workflow-head">
<span class="about-kicker">How we work</span>
<h2>Clear standards, calm handling, and a routine dogs can settle into.</h2>
</div>
<div class="about-workflow-lines">
{#each workflowItems as item, index}
<article class="about-workflow-row">
<div class="about-workflow-index">0{index + 1}</div>
<div class="about-workflow-icon" aria-hidden="true">
<Icon name={item.icon} />
</div>
<h3>{item.title}</h3>
<p>{item.body}</p>
</article>
{/each}
</div>
</div>
</section>
{#if proofItems.length > 0}
<section use:reveal class="about-proof reveal-block">
<div class="about-inner">
<div class="about-proof-head">
<span class="about-kicker">Proof</span>
<h2>Dogs who drag their people to the gate tell the story better than we can.</h2>
</div>
<div class="about-proof-grid">
{#each proofItems as item, index}
<article class={`about-proof-card about-proof-card-${(index % 3) + 1}`}>
<p class="about-proof-quote">{item.quote}</p>
<p class="about-proof-meta">{item.reviewer} · {item.detail}</p>
</article>
{/each}
</div>
</div>
</section>
{/if}
<ServicesSection services={content.services} heading={pageContent.servicesTitle} /> <ServicesSection services={content.services} heading={pageContent.servicesTitle} />
<section use:reveal={{ delay: 70 }} class="about-contact reveal-block"> <section use:reveal={{ delay: 70 }} class="about-contact reveal-block">
<div class="about-inner"> <div class="about-inner">
<div class="about-contact-band"> <div class="about-contact-card">
<div class="about-contact-copy">
<span class="about-kicker">Get in touch</span>
<h2>{pageContent.contact.title}</h2> <h2>{pageContent.contact.title}</h2>
<p>Tell us a little about your dog and well help you figure out the right fit.</p> <div class="about-contact-grid">
</div>
<div class="about-contact-actions">
<a class="about-contact-link" href={`mailto:${pageContent.contact.email}`}> <a class="about-contact-link" href={`mailto:${pageContent.contact.email}`}>
<span>Email</span> {pageContent.contact.email}
<strong>{pageContent.contact.email}</strong>
</a> </a>
<a class="btn btn-yellow" href={pageContent.contact.cta.href}> <a class="btn btn-yellow" href={pageContent.contact.cta.href}>
{pageContent.contact.cta.label} {pageContent.contact.cta.label}
</a> </a>
<a class="about-contact-link" href={`tel:${pageContent.contact.phone.replace(/[^0-9+]/g, '')}`}> <a class="about-contact-link" href={`tel:${pageContent.contact.phone.replace(/[^0-9+]/g, '')}`}>
<span>Phone</span> {pageContent.contact.phone}
<strong>{pageContent.contact.phone}</strong>
</a> </a>
</div> </div>
</div> </div>
@@ -258,9 +67,7 @@
<style> <style>
.about-page { .about-page {
background: background: var(--off-white);
radial-gradient(circle at top left, rgba(255, 209, 0, 0.14), transparent 24%),
linear-gradient(180deg, #fffdfa 0%, #fbfbfb 28%, #f7f4ed 100%);
} }
.about-inner { .about-inner {
@@ -269,17 +76,13 @@
padding: 0 50px; padding: 0 50px;
} }
.about-page-hero { .about-hero {
padding: 72px 0 26px; padding: 72px 0 40px;
} }
.about-page-hero h1, .about-hero h1,
.about-hero h2, .about-copy h2,
.about-editorial-copy h2, .about-contact-card h2 {
.about-credentials h2,
.about-workflow h2,
.about-proof h2,
.about-contact h2 {
margin: 0; margin: 0;
font-family: var(--font-head); font-family: var(--font-head);
font-size: clamp(34px, 4vw, 56px); font-size: clamp(34px, 4vw, 56px);
@@ -288,360 +91,62 @@
color: #000; color: #000;
} }
.about-page-hero h1 { .about-hero h1 {
text-align: center; text-align: center;
} }
.about-kicker { .about-section {
display: inline-flex; padding: 0 0 88px;
align-items: center;
gap: 8px;
font-size: 12px;
font-weight: 700;
letter-spacing: 0.12em;
text-transform: uppercase;
color: rgba(33, 48, 33, 0.64);
} }
.about-kicker-light { .about-section-gradient {
color: rgba(255, 255, 255, 0.64); margin: 0 24px 88px;
padding: 40px 0;
border-radius: 28px;
background: linear-gradient(180deg, #f5efe6 0%, #f9f6ef 100%);
} }
.about-hero { .about-section-grid {
padding: 0 0 20px;
}
.about-hero-grid {
display: grid; display: grid;
grid-template-columns: minmax(0, 0.95fr) minmax(380px, 1.05fr); grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
gap: 44px; gap: 44px;
align-items: center; align-items: center;
} }
.about-hero-copy h2 { .about-section-reverse {
margin-top: 12px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
max-width: 11ch;
} }
.about-hero-intro { .about-section-reverse .about-copy {
margin: 22px 0 0;
max-width: 35rem;
color: #34363a;
font-size: clamp(18px, 1.8vw, 20px);
line-height: 1.85;
}
.about-pillars {
display: flex;
flex-wrap: wrap;
gap: 12px;
margin-top: 28px;
}
.about-pillars span {
padding: 10px 16px;
border-radius: 999px;
background: rgba(33, 48, 33, 0.06);
color: var(--green);
font-size: 14px;
font-weight: 700;
}
.about-hero-media img {
display: block;
width: 100%;
aspect-ratio: 16 / 11;
border-radius: 34px;
object-fit: cover;
box-shadow: 0 24px 60px rgba(17, 20, 24, 0.12);
}
.about-ribbon {
padding: 6px 0 28px;
}
.about-ribbon-track {
display: flex;
flex-wrap: wrap;
gap: 12px;
padding: 0;
}
.about-ribbon-chip {
display: inline-flex;
align-items: center;
gap: 10px;
min-height: 44px;
padding: 10px 16px;
border-radius: 999px;
color: var(--green);
font-size: 14px;
font-weight: 700;
box-shadow: inset 0 0 0 1px rgba(33, 48, 33, 0.08);
}
.about-ribbon-chip-1 {
background: #f3efe7;
}
.about-ribbon-chip-2 {
background: #fff7d5;
}
.about-ribbon-chip-3 {
background: #e7efe0;
}
.about-intro-band {
padding: 0 0 52px;
}
.about-intro-grid {
display: grid;
grid-template-columns: minmax(0, 1.25fr) minmax(280px, 0.75fr);
gap: 34px;
align-items: start;
padding-top: 22px;
border-top: 1px solid rgba(33, 48, 33, 0.12);
}
.about-intro-main p {
margin: 12px 0 0;
font-size: clamp(22px, 2.4vw, 31px);
line-height: 1.45;
letter-spacing: -0.03em;
color: #1f2328;
}
.about-intro-aside {
padding-left: 26px;
border-left: 3px solid rgba(33, 48, 33, 0.14);
}
.about-intro-aside ul {
margin: 12px 0 0;
padding: 0;
list-style: none;
}
.about-intro-aside li {
color: #40444a;
font-size: 15px;
line-height: 1.7;
}
.about-intro-aside li + li {
margin-top: 10px;
}
.about-editorial,
.about-workflow,
.about-proof {
padding: 0 0 72px;
}
.about-editorial-tint {
background: linear-gradient(180deg, rgba(245, 239, 230, 0.66) 0%, rgba(245, 239, 230, 0) 100%);
}
.about-editorial-grid {
display: grid;
grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
gap: 52px;
align-items: center;
}
.about-editorial-reverse .about-editorial-copy {
order: 2; order: 2;
} }
.about-editorial-reverse .about-editorial-media { .about-section-reverse .about-media {
order: 1; order: 1;
} }
.about-editorial-copy h2 { .about-copy h2 {
margin-top: 12px; font-size: clamp(28px, 3vw, 40px);
font-size: clamp(28px, 3vw, 42px);
} }
.about-editorial-copy p { .about-copy p {
margin: 18px 0 0; margin: 18px 0 0;
color: #34363a; color: #34363a;
font-size: 17px; font-size: 17px;
line-height: 1.8;
}
.about-editorial-media img {
display: block;
width: 100%;
border-radius: 32px;
object-fit: cover;
box-shadow: 0 18px 44px rgba(17, 20, 24, 0.12);
}
.about-credentials {
padding: 68px 0 72px;
background: var(--green);
color: #fff;
}
.about-credentials-head {
display: grid;
grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
gap: 28px;
align-items: end;
margin-bottom: 28px;
}
.about-credentials h2 {
color: #fff;
font-size: clamp(30px, 3.2vw, 46px);
}
.about-credentials-list {
border-top: 1px solid rgba(255, 255, 255, 0.14);
}
.about-credential-row {
display: grid;
grid-template-columns: 54px minmax(0, 1fr);
gap: 18px;
align-items: start;
padding: 24px 0;
border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.about-credential-mark {
display: inline-flex;
align-items: center;
justify-content: center;
width: 54px;
height: 54px;
border-radius: 18px;
background: rgba(255, 255, 255, 0.08);
color: var(--yellow);
font-size: 18px;
}
.about-credential-row h3 {
margin: 0;
font-family: var(--font-head);
font-size: 20px;
line-height: 1.2;
color: #fff;
}
.about-credential-row p {
margin: 10px 0 0;
max-width: 52rem;
color: rgba(255, 255, 255, 0.8);
font-size: 15px;
line-height: 1.7;
}
.about-workflow-head,
.about-proof-head {
margin-bottom: 28px;
}
.about-workflow-head h2,
.about-proof-head h2 {
margin-top: 12px;
max-width: 16ch;
font-size: clamp(28px, 3vw, 42px);
}
.about-workflow-lines {
border-top: 1px solid rgba(33, 48, 33, 0.12);
}
.about-workflow-row {
display: grid;
grid-template-columns: 70px 54px minmax(220px, 0.45fr) minmax(0, 1fr);
gap: 18px;
align-items: start;
padding: 24px 0;
border-bottom: 1px solid rgba(33, 48, 33, 0.12);
}
.about-workflow-index {
font-family: var(--font-head);
font-size: 18px;
line-height: 1;
color: rgba(33, 48, 33, 0.38);
}
.about-workflow-icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 54px;
height: 54px;
border-radius: 18px;
background: #fff;
color: var(--green);
font-size: 18px;
box-shadow: 0 12px 28px rgba(17, 20, 24, 0.08);
}
.about-workflow-row h3 {
margin: 0;
font-family: var(--font-head);
font-size: 20px;
line-height: 1.25;
color: #000;
}
.about-workflow-row p {
margin: 0;
color: #40444a;
font-size: 15px;
line-height: 1.7;
}
.about-proof-grid {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 20px;
align-items: start;
}
.about-proof-card {
padding: 24px 22px;
border-radius: 26px;
background: rgba(255, 255, 255, 0.84);
box-shadow:
inset 0 0 0 1px rgba(33, 48, 33, 0.06),
0 14px 34px rgba(17, 20, 24, 0.07);
}
.about-proof-card-1 {
transform: rotate(-1.2deg);
background: #fffdfa;
}
.about-proof-card-2 {
transform: translateY(18px);
background: #f7f4ed;
}
.about-proof-card-3 {
transform: rotate(1deg);
background: #f4f7f1;
}
.about-proof-quote {
margin: 0;
color: #2e3033;
font-size: 15px;
line-height: 1.75; line-height: 1.75;
} }
.about-proof-meta { .about-media img {
margin: 16px 0 0; display: block;
color: var(--green); width: 100%;
font-size: 14px; max-width: 460px;
font-weight: 700; aspect-ratio: 4 / 3;
height: auto;
margin-left: auto;
margin-right: auto;
border-radius: 28px;
object-fit: cover;
box-shadow: 0 16px 40px rgba(17, 20, 24, 0.08);
} }
:global(.reveal-ready.reveal-block) { :global(.reveal-ready.reveal-block) {
@@ -662,89 +167,47 @@
padding: 0 0 88px; padding: 0 0 88px;
} }
.about-contact-band { .about-contact-card {
display: grid; border-radius: 28px;
grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); background: #fff;
gap: 28px; padding: 42px 48px;
align-items: center; box-shadow: 0 14px 34px rgba(17, 20, 24, 0.05);
padding: 38px 0 0; text-align: center;
border-top: 1px solid rgba(33, 48, 33, 0.12);
} }
.about-contact-copy h2 { .about-contact-card h2 {
margin-top: 12px;
font-size: clamp(28px, 3vw, 42px); font-size: clamp(28px, 3vw, 42px);
} }
.about-contact-copy p { .about-contact-grid {
margin: 14px 0 0;
color: #4a4e54;
font-size: 16px;
line-height: 1.75;
}
.about-contact-actions {
display: grid; display: grid;
grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 18px; gap: 20px;
align-items: center; align-items: center;
margin-top: 28px;
} }
.about-contact-link { .about-contact-link {
display: grid;
gap: 6px;
padding: 18px 20px;
border-radius: 24px;
background: rgba(255, 255, 255, 0.72);
color: #34363a; color: #34363a;
text-decoration: none;
box-shadow: inset 0 0 0 1px rgba(33, 48, 33, 0.06);
}
.about-contact-link span {
font-size: 12px;
font-weight: 700;
letter-spacing: 0.12em;
text-transform: uppercase;
color: rgba(33, 48, 33, 0.52);
}
.about-contact-link strong {
font-size: 20px; font-size: 20px;
line-height: 1.3; font-weight: 600;
} text-decoration: none;
.about-contact-actions .btn {
min-height: 62px;
padding-inline: 32px;
} }
@media (max-width: 1024px) { @media (max-width: 1024px) {
.about-hero-grid, .about-section-grid,
.about-intro-grid, .about-section-reverse {
.about-editorial-grid,
.about-credentials-head,
.about-contact-band,
.about-contact-actions {
grid-template-columns: 1fr; grid-template-columns: 1fr;
} }
.about-workflow-row { .about-section-reverse .about-copy,
grid-template-columns: 70px 54px minmax(0, 1fr); .about-section-reverse .about-media {
}
.about-workflow-row p {
grid-column: 2 / -1;
}
.about-proof-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.about-editorial-reverse .about-editorial-copy,
.about-editorial-reverse .about-editorial-media {
order: initial; order: initial;
} }
.about-contact-grid {
grid-template-columns: 1fr;
}
} }
@media (max-width: 768px) { @media (max-width: 768px) {
@@ -752,142 +215,44 @@
padding: 0 24px; padding: 0 24px;
} }
.about-page-hero { .about-hero {
padding: 56px 0 20px; padding: 56px 0 24px;
} }
.about-page-hero h1, .about-section,
.about-hero h2 { .about-contact {
font-size: 34px; padding-bottom: 64px;
} }
.about-ribbon { .about-section-gradient {
padding-bottom: 18px; margin: 0 12px 64px;
padding: 28px 0;
border-radius: 28px;
} }
.about-ribbon .about-inner { .about-section-grid {
padding-right: 0;
}
.about-ribbon-track {
flex-wrap: nowrap;
gap: 10px;
overflow-x: auto;
padding: 0 24px 10px 0;
scroll-snap-type: x proximity;
scrollbar-width: none;
-webkit-overflow-scrolling: touch;
}
.about-ribbon-track::-webkit-scrollbar {
display: none;
}
.about-ribbon-chip {
flex: 0 0 auto;
scroll-snap-align: start;
font-size: 13px;
}
.about-hero,
.about-intro-band,
.about-editorial,
.about-workflow,
.about-proof {
padding-bottom: 56px;
}
.about-hero-grid,
.about-intro-grid,
.about-editorial-grid {
gap: 24px; gap: 24px;
} }
.about-hero-intro, .about-copy h2,
.about-editorial-copy p, .about-contact-card h2 {
.about-contact-copy p { font-size: 30px;
}
.about-copy p {
font-size: 16px; font-size: 16px;
line-height: 1.7; line-height: 1.7;
} }
.about-intro-main p { .about-contact-card {
font-size: 22px; padding: 30px 24px;
} }
.about-intro-aside { .about-contact-grid {
padding-left: 18px; margin-top: 22px;
border-left-width: 2px;
} }
.about-credentials { .about-contact-link {
padding: 52px 0 56px;
}
.about-workflow .about-inner,
.about-proof .about-inner {
padding-right: 0;
}
.about-workflow-row {
grid-template-columns: 1fr;
gap: 14px;
min-width: 280px;
padding: 22px 20px;
border: none;
border-radius: 26px;
background: rgba(255, 255, 255, 0.84);
box-shadow:
inset 0 0 0 1px rgba(33, 48, 33, 0.06),
0 12px 28px rgba(17, 20, 24, 0.06);
scroll-snap-align: start;
}
.about-workflow-row p {
grid-column: auto;
}
.about-workflow-lines {
display: grid;
grid-auto-flow: column;
grid-auto-columns: minmax(280px, 82vw);
gap: 14px;
overflow-x: auto;
padding: 2px 24px 10px 0;
border-top: none;
scroll-snap-type: x proximity;
scrollbar-width: none;
-webkit-overflow-scrolling: touch;
}
.about-workflow-lines::-webkit-scrollbar {
display: none;
}
.about-proof-grid {
display: grid;
grid-auto-flow: column;
grid-auto-columns: minmax(286px, 84vw);
gap: 14px;
overflow-x: auto;
padding: 2px 24px 10px 0;
scroll-snap-type: x proximity;
scrollbar-width: none;
-webkit-overflow-scrolling: touch;
}
.about-proof-grid::-webkit-scrollbar {
display: none;
}
.about-proof-card,
.about-proof-card-1,
.about-proof-card-2,
.about-proof-card-3 {
transform: none;
scroll-snap-align: start;
}
.about-contact-link strong {
font-size: 18px; font-size: 18px;
} }
} }
+10 -10
View File
@@ -6,17 +6,17 @@ export const aboutPageContent: AboutPageContent = {
{ {
title: 'Who we are', title: 'Who we are',
body: [ body: [
'GoodWalk is led by Alessandra, who was born in Italy and is now a New Zealand citizen. Before dog walking full time, she worked in corporate retail as a store manager for a major supermarket chain and also ran cafes in different parts of the world. That background shows up in the way GoodWalk is run: organised, hands-on, people-focused, and calm under pressure.', "At GoodWalk, we're not your average dog walking service. We're a team of passionate dog lovers dedicated to providing top-notch care for your furry friends. Specialising in small dogs, we understand their unique needs firsthand, being small dog owners ourselves!",
'That focus shapes everything we do across Auckland Central: small-group Tiny Gang adventures for the right dogs, one-on-one walks when a dog needs more space, and puppy visits that help younger dogs build confidence before they are ready for the pack.' "Our commitment to excellence has quickly made us a leader in Auckland Central's dog-walking scene. From pack walks to one-on-one sessions, we ensure the happiness and well-being of every dog in our care."
], ],
imageUrl: '/images/auckland-dog-group-outing.jpg', imageUrl: '/images/auckland-pack-walk-dog.jpg',
imageAlt: 'Group of GoodWalk dogs on an outing together' imageAlt: 'Dog on a Goodwalk pack walk'
}, },
{ {
title: 'Our philosophy', title: 'Our impact',
body: [ body: [
'We believe good dog walking is part handling, part communication, and part good judgement. We use positive reinforcement, clear routines, and carefully matched groups so dogs can learn, socialise, and enjoy the outing without being overwhelmed.', "At GoodWalk, we believe in positive reinforcement training to help your dog thrive in the world. Safety, professionalism, well-being, fun, structure, and compassion are the cornerstones of our business ethos.",
'For us, a great walk is not just exercise. It is confidence-building, enrichment, practice around other dogs and people, and a reliable routine that helps your dog come home happier and more settled.' "When you choose GoodWalk, you're choosing a partner who will treat your dog like family, because that's exactly what they are to us."
], ],
imageUrl: '/images/auckland-dog-group-outing.jpg', imageUrl: '/images/auckland-dog-group-outing.jpg',
imageAlt: 'Goodwalk dogs enjoying an outing together', imageAlt: 'Goodwalk dogs enjoying an outing together',
@@ -24,10 +24,10 @@ export const aboutPageContent: AboutPageContent = {
accent: 'gradient' accent: 'gradient'
}, },
{ {
title: 'Meet Aless and Maya', title: 'Meet the team',
body: [ body: [
'Behind GoodWalk is Alessandra, whose approach is hands-on, observant, and relationship-led. She gets to know each dog properly: their pace, their confidence level, their social skills, and what helps them feel safe and successful out on a walk.', 'Behind GoodWalk is Alessandra, an Italian who has a deep passion for dogs. With her love for animals and years of experience, Alessandra leads our team with dedication and expertise, ensuring that every dog receives the love and attention they deserve.',
"Maya, the resident Cavalier King Charles cross Shih Tzu, keeps the brand honest. She is part mascot, part quality control, and a daily reminder that small dogs deserve walks designed around their size, temperament, and personality." "And let's not forget about Maya, our marketing manager! A Cavalier King Charles cross Shih Tzu, Maya is full of sass and personality, bringing a touch of charm and flair to everything we do."
], ],
imageUrl: '/images/goodwalk-dog-walker-alessandra.png', imageUrl: '/images/goodwalk-dog-walker-alessandra.png',
imageAlt: 'Goodwalk staff member Aless' imageAlt: 'Goodwalk staff member Aless'
-30
View File
@@ -146,36 +146,6 @@ export const homepageContent: HomePageContent = {
} }
], ],
testimonials: [ testimonials: [
{
quote:
'Fully professionally run company with the most caring and kind Aless at the lead. I trust my most beloved dog with her completely. She is selective where she goes and is all about fun and adventure and care. Love love love GoodWalk.',
reviewer: 'Jo',
detail: "Dog mum"
},
{
quote:
'Aless has been amazing with my pup. Shes taken the time to bond and he LOVES her. I can go to work with absolutely no worries and my favourite part of my day are the updates and seeing how happy he is. Highly recommend this service!',
reviewer: 'Brigid',
detail: "Dog mum"
},
{
quote:
'My dog has an amazing time each week on his adventure walk with Aless and comes home pooped! Aless is a lovely and super friendly person and she runs a fantastic dog walking business which I highly recommend.',
reviewer: 'Kate',
detail: "Dog mum"
},
{
quote:
'Alessandra is amazing. Not only she looked after my dog but since I left him with her, he has improved on his behaviour. If I could rate 6 stars I would. I couldn\'t imagine a better person to leave my lovely Rusty with. Thank you Alessandra.',
reviewer: 'Sara',
detail: "Rusty's mum"
},
{
quote:
'Aless is top notch, you and your dog would be lucky to have her. Aless took the time to get to know Buddys personality to make sure he was a good fit for the pack and went above to work with him on recall and obedience training. Reliable, trustworthy and all around awesome.',
reviewer: 'Lori',
detail: "Buddy's mum"
},
{ {
quote: quote:
'Love Aless! She is so amazing with my slightly hyper and anxious dog. She is great with communication if anything on either of our ends need to change. Archie love his walks, and I love the photos she posts of him.', 'Love Aless! She is so amazing with my slightly hyper and anxious dog. She is great with communication if anything on either of our ends need to change. Archie love his walks, and I love the photos she posts of him.',