fix(giveback): restore source page layout
This commit is contained in:
DeCentN2Madness committed
1 parent
6db91105da
commit
21b0ad7461
5 files changed
+260
-10
No files matched your search
@@ -38,6 +38,9 @@
|
||||
- Converted the insurance content entry to MDX so its prose, carrier data, and
|
||||
FAQ data have one editable source; reduced `InsurancePage.astro` to a
|
||||
presentation-only wrapper that renders the content slot.
|
||||
- Reconstructed the giveback page's four live-derived content bands and
|
||||
restored its Amazon wishlist and GivingFountain actions without carrying
|
||||
over HubSpot layout wrappers.
|
||||
- Restored 32 blockquotes across 15 English and Spanish blog posts, including
|
||||
source emphasis, links, and the self-hosted quote-mark decoration; fixed
|
||||
fallback extraction to preserve them.
|
||||
|
||||
@@ -25,7 +25,7 @@ Live pages inspected during the pass include:
|
||||
|
||||
- English and Spanish homepages
|
||||
- ABA Therapy, Autism Evaluations, and Learner Social Club
|
||||
- About, Team, and Client Consultation
|
||||
- About, Team, Client Consultation, and Giveback & Donate
|
||||
- English and Arabic Library indexes
|
||||
- Representative current library articles
|
||||
|
||||
@@ -47,6 +47,9 @@ Implemented fidelity work includes:
|
||||
- Rebuilt the contact page around the live two-column content/form section and
|
||||
full-width Leaflet map while retaining local clickable obfuscated phone
|
||||
links.
|
||||
- Rebuilt the giveback page as four source-faithful full-width sections with
|
||||
its original image/copy proportions, fundraiser color band, nonprofit logo,
|
||||
emphasis, and external donation calls to action.
|
||||
- Rebuilt library indexes and blog-post presentation around the live sidebar,
|
||||
article list, byline, featured-image, and counter patterns.
|
||||
- Converted FAQ-bearing posts to MDX and routed their accordions, the
|
||||
@@ -68,6 +71,8 @@ Implemented fidelity work includes:
|
||||
and the Blue Cross Blue Shield mark is emphasized at 125% of the standard
|
||||
desktop logo width, following its treatment on the live homepage rather
|
||||
than preserving the live pages' differing row spacing.
|
||||
- The Community 4 Autism logo on `/donate-autism-giveback` is horizontally
|
||||
centered on mobile instead of retaining the live page's left alignment.
|
||||
|
||||
## URLs and Redirects
|
||||
|
||||
|
||||
@@ -0,0 +1,213 @@
|
||||
---
|
||||
import Button from './Button.astro';
|
||||
|
||||
interface Props {
|
||||
variant: 'intro' | 'wishlist' | 'fundraiser' | 'community';
|
||||
heading: string;
|
||||
headingId: string;
|
||||
image?: string;
|
||||
imageAlt?: string;
|
||||
actionHref?: string;
|
||||
actionLabel?: string;
|
||||
actionRel?: string;
|
||||
}
|
||||
|
||||
const {
|
||||
variant,
|
||||
heading,
|
||||
headingId,
|
||||
image,
|
||||
imageAlt = '',
|
||||
actionHref,
|
||||
actionLabel,
|
||||
actionRel
|
||||
} = Astro.props;
|
||||
|
||||
const Heading = variant === 'intro' || variant === 'community' ? 'h2' : 'h3';
|
||||
const hasImage = Boolean(image);
|
||||
const actionIsCentered = variant === 'community';
|
||||
---
|
||||
|
||||
<section
|
||||
class:list={[
|
||||
'giveback-section',
|
||||
`giveback-section--${variant}`,
|
||||
{ 'giveback-section--split': hasImage }
|
||||
]}
|
||||
aria-labelledby={headingId}
|
||||
>
|
||||
<div class="container">
|
||||
<div class="giveback-section__grid">
|
||||
{image && variant === 'wishlist' && (
|
||||
<img
|
||||
class="giveback-section__image giveback-section__image--gift"
|
||||
src={image}
|
||||
alt={imageAlt}
|
||||
loading="lazy"
|
||||
/>
|
||||
)}
|
||||
|
||||
<div class="giveback-section__copy">
|
||||
<Heading id={headingId}>{heading}</Heading>
|
||||
<slot />
|
||||
|
||||
{actionHref && actionLabel && !actionIsCentered && (
|
||||
<div class="giveback-section__action">
|
||||
<Button href={actionHref} target="_blank" rel={actionRel}>{actionLabel}</Button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{image && variant === 'community' && (
|
||||
<img
|
||||
class="giveback-section__image giveback-section__image--community"
|
||||
src={image}
|
||||
alt={imageAlt}
|
||||
loading="lazy"
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
|
||||
{actionHref && actionLabel && actionIsCentered && (
|
||||
<div class="giveback-section__action giveback-section__action--center">
|
||||
<Button href={actionHref} target="_blank" rel={actionRel}>{actionLabel}</Button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<style>
|
||||
.giveback-section {
|
||||
color: var(--color-primary);
|
||||
padding-block: 80px;
|
||||
}
|
||||
|
||||
.giveback-section--wishlist {
|
||||
background: var(--color-tint);
|
||||
}
|
||||
|
||||
.giveback-section--fundraiser {
|
||||
background: var(--color-primary);
|
||||
color: white;
|
||||
}
|
||||
|
||||
.giveback-section__grid {
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.giveback-section--split .giveback-section__grid {
|
||||
display: grid;
|
||||
gap: 2rem;
|
||||
}
|
||||
|
||||
.giveback-section--wishlist .giveback-section__grid {
|
||||
grid-template-columns: 1fr 2fr;
|
||||
}
|
||||
|
||||
.giveback-section--community .giveback-section__grid {
|
||||
grid-template-columns: 2fr 1fr;
|
||||
}
|
||||
|
||||
.giveback-section__copy :global(h2),
|
||||
.giveback-section__copy :global(h3) {
|
||||
margin: 0 0 20px;
|
||||
}
|
||||
|
||||
.giveback-section__copy :global(h2) {
|
||||
font-size: 2.4rem;
|
||||
line-height: 3rem;
|
||||
}
|
||||
|
||||
.giveback-section__copy :global(h3) {
|
||||
font-size: 2.2rem;
|
||||
line-height: 2.8rem;
|
||||
}
|
||||
|
||||
.giveback-section__copy :global(p) {
|
||||
margin: 0 0 20px;
|
||||
}
|
||||
|
||||
.giveback-section--wishlist .giveback-section__copy :global(h3),
|
||||
.giveback-section--wishlist .giveback-section__copy :global(p),
|
||||
.giveback-section--fundraiser .giveback-section__copy :global(h3),
|
||||
.giveback-section--fundraiser .giveback-section__copy :global(p),
|
||||
.giveback-section--community .giveback-section__copy :global(h2),
|
||||
.giveback-section--community .giveback-section__copy :global(p) {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
.giveback-section--fundraiser .giveback-section__copy :global(h3),
|
||||
.giveback-section--fundraiser .giveback-section__copy :global(p) {
|
||||
color: white;
|
||||
}
|
||||
|
||||
.giveback-section__image {
|
||||
height: auto;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.giveback-section__image--gift {
|
||||
margin-inline: auto;
|
||||
max-width: 360px;
|
||||
}
|
||||
|
||||
.giveback-section__image--community {
|
||||
justify-self: start;
|
||||
max-width: 266px;
|
||||
}
|
||||
|
||||
.giveback-section__action {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.giveback-section__action--center {
|
||||
margin-top: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.giveback-section__action :global(.content-button) {
|
||||
padding: .8rem 1.2rem;
|
||||
}
|
||||
|
||||
@media (max-width: 767px) {
|
||||
.giveback-section {
|
||||
padding-block: 40px;
|
||||
}
|
||||
|
||||
.giveback-section--intro {
|
||||
padding-block: 50px;
|
||||
}
|
||||
|
||||
.giveback-section--split .giveback-section__grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.giveback-section__copy :global(h2) {
|
||||
font-size: 2rem;
|
||||
line-height: 2.5rem;
|
||||
}
|
||||
|
||||
.giveback-section__copy :global(h3) {
|
||||
font-size: 1.875rem;
|
||||
line-height: 2.375rem;
|
||||
}
|
||||
|
||||
.giveback-section__copy :global(p) {
|
||||
line-height: 1.25;
|
||||
}
|
||||
|
||||
.giveback-section--wishlist .giveback-section__copy :global(h3),
|
||||
.giveback-section--wishlist .giveback-section__copy :global(p),
|
||||
.giveback-section--fundraiser .giveback-section__copy :global(h3),
|
||||
.giveback-section--fundraiser .giveback-section__copy :global(p),
|
||||
.giveback-section--community .giveback-section__copy :global(h2),
|
||||
.giveback-section--community .giveback-section__copy :global(p) {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.giveback-section__image--community {
|
||||
margin-bottom: 20px;
|
||||
margin-inline: auto;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -8,27 +8,54 @@ translationKey: "donate-autism-giveback"
|
||||
draft: false
|
||||
---
|
||||
import ContactObfuscation from '../../../components/ContactObfuscation.astro';
|
||||
import GivebackSection from '../../../components/GivebackSection.astro';
|
||||
|
||||
## Ways to Giveback
|
||||
<GivebackSection
|
||||
variant="intro"
|
||||
heading="Ways to Giveback"
|
||||
headingId="ways-to-giveback-heading"
|
||||
>
|
||||
|
||||
Every act of generosity, no matter how big or small, makes a difference at the Arizona Institute for Autism. Whether you donate items directly, support our Amazon iGiveback Wishlist, or contribute to our 501(c)(3) public charity, your support helps improve the lives of children with autism, their families, and the communities around them.
|
||||
|
||||
|
||||
</GivebackSection>
|
||||
|
||||
### Give the Gift of a Smile!
|
||||
<GivebackSection
|
||||
variant="wishlist"
|
||||
heading="Give the Gift of a Smile!"
|
||||
headingId="give-the-gift-of-a-smile-heading"
|
||||
image="/assets/images/giveback-donation-gift.webp"
|
||||
imageAlt="giveback donation gift"
|
||||
actionHref="https://www.amazon.com/hz/wishlist/ls/17A5XHRQJN3QT"
|
||||
actionLabel="View our Amazon Wishlist"
|
||||
actionRel="nofollow noopener"
|
||||
>
|
||||
|
||||
Visit AIA’s Amazon iGiveback Wishlist today, pick an item (or two!), and help us turn everyday needs into moments of happiness and growth.
|
||||
|
||||
View our Amazon Wishlist
|
||||
</GivebackSection>
|
||||
|
||||
### Host a Fundraiser
|
||||
<GivebackSection
|
||||
variant="fundraiser"
|
||||
heading="Host a Fundraiser"
|
||||
headingId="host-a-fundraiser-heading"
|
||||
>
|
||||
|
||||
Would you like to host a fundraiser to benefit the Arizona Institute for Autism? Please contact us at <ContactObfuscation email="info@azinstitute4autism.com" obfuscatedText="moc.msitua4etutitsniza@ofni" /> and a member of our team will be in touch to discuss next steps! All potential third party events will be evaluated in terms of their alignment with Arizona Institute for Autism's mission.
|
||||
|
||||
## Community 4 Autism
|
||||
</GivebackSection>
|
||||
|
||||
A 501(c)(3) nonprofit organization (EIN 92-2808564), Community 4 Autism was established in June 2023. Your tax-deductible donation directly supports families of children and individuals diagnosed with autism.
|
||||
<GivebackSection
|
||||
variant="community"
|
||||
heading="Community 4 Autism"
|
||||
headingId="community-4-autism-heading"
|
||||
image="/assets/images/community-4-autism-logo-blue-1.png"
|
||||
imageAlt="Community 4 Autism - Nonprofit Giveback Solution"
|
||||
actionHref="https://www.givingfountain.org/directory/dc917b98-89c6-4003-bf2d-a4ac8f848c7b"
|
||||
actionLabel="Donate with GivingFountain"
|
||||
actionRel="noopener"
|
||||
>
|
||||
|
||||
|
||||
A 501(c)(3) nonprofit organization (EIN 92-2808564), **Community 4 Autism** was established in June 2023. Your tax-deductible donation directly supports families of children and individuals diagnosed with autism.
|
||||
|
||||
Donate with GivingFountain
|
||||
</GivebackSection>
|
||||
@@ -70,6 +70,8 @@ const heroImage = pageHeroImages[entry.data.slug];
|
||||
? <FaqPage><slot /></FaqPage>
|
||||
: entry.data.slug === 'insurance' && entry.data.lang === 'en'
|
||||
? <InsurancePage><slot /></InsurancePage>
|
||||
: entry.data.slug === 'donate-autism-giveback' && entry.data.lang === 'en'
|
||||
? <slot />
|
||||
: entry.data.slug === 'contact'
|
||||
? <ContactPage title={bannerTitle}><slot /></ContactPage>
|
||||
: <article class:list={['prose', 'source-page', 'container', { 'service-page': isService }]}><slot /></article>}
|
||||
|
||||
Reference in new issue
Block a user