Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
47 changes: 47 additions & 0 deletions blocks/hero-products/hero-products.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,47 @@
.hero-products-container .hero-products-wrapper {
max-width: unset;
padding: 0;
}

.hero-products {
position: relative;
padding: 40px 24px;
min-height: 300px;
}

.hero-products h1,
.hero-products h2,
.hero-products h3,
.hero-products h4,
.hero-products h5,
.hero-products h6,
.hero-products p {
max-width: 1200px;
margin-left: auto;
margin-right: auto;
color: var(--background-color);
}

.hero-products.no-image * {
color: var(--text-color);
}

.hero-products picture {
position: absolute;
z-index: -1;
inset: 0;
object-fit: cover;
box-sizing: border-box;
}

.hero-products img {
object-fit: cover;
width: 100%;
height: 100%;
}

@media (width >= 900px) {
.hero-products {
padding: 40px 32px;
}
}
5 changes: 5 additions & 0 deletions blocks/hero-products/hero-products.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
export default function decorate(block) {
if (!block.querySelector(':scope > div:first-child picture')) {
block.classList.add('no-image');
}
}
50 changes: 50 additions & 0 deletions blocks/hero-products/metadata.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,50 @@
{
"variantName": "hero-products",
"baseBlock": "hero",
"version": "1.0.0",
"created": "2025-11-05T09:58:00.000Z",
"sourceContext": {
"originUrl": "https://www.wknd-trendsetters.site/products",
"originPage": "Products page",
"blockPosition": "top"
},
"visualCharacteristics": {
"colorScheme": "dark",
"density": "spacious",
"purpose": "hero-banner",
"imagePattern": "background",
"textLength": "short"
},
"contentPattern": {
"structure": "carousel background + heading with text slider + 2 CTAs",
"headingMaxLength": 50,
"descriptionMaxLength": 0,
"buttonCount": 2,
"imageCount": 1
},
"reuseGuidance": {
"suitableFor": [
"product landing pages",
"full-width hero sections with carousel backgrounds",
"hero sections with multiple CTAs"
],
"notSuitableFor": [
"text-only hero sections",
"single CTA heroes",
"heroes with static images"
],
"similarVariants": ["hero-feature"]
},
"designTokens": {
"primaryColor": "#ffffff",
"backgroundColor": "#000000",
"fontFamily": "system-ui",
"headingSize": "3rem",
"padding": "40px 24px"
},
"usage": {
"pagesUsing": ["/products"],
"reuseCount": 1,
"lastUsed": "2025-11-05T09:58:00.000Z"
}
}
209 changes: 209 additions & 0 deletions content/content/san-francisco-opening-v4.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,209 @@
<!DOCTYPE html>
<html>
<head>
<title>San Francisco, Your Style Story Starts Here</title>
<link rel="canonical" href="https://main--sdk-5--paolomoz.aem.page/content/san-francisco-opening-v4">
<meta name="description" content="Discover our newest flagship at 1847 Market Street. Where the City&#x27;s creative spirit meets conscious fashion.">
<meta property="og:title" content="San Francisco, Your Style Story Starts Here">
<meta property="og:description" content="Discover our newest flagship at 1847 Market Street. Where the City&#x27;s creative spirit meets conscious fashion.">
<meta property="og:url" content="https://main--sdk-5--paolomoz.aem.page/content/san-francisco-opening-v4">
<meta property="og:image" content="https://main--sdk-5--paolomoz.aem.page/content/media_15b2237d556f6f9cd3b0a118c029d3ef224a88f65.avif?width=1200&#x26;format=pjpg&#x26;optimize=medium">
<meta property="og:image:secure_url" content="https://main--sdk-5--paolomoz.aem.page/content/media_15b2237d556f6f9cd3b0a118c029d3ef224a88f65.avif?width=1200&#x26;format=pjpg&#x26;optimize=medium">
<meta property="og:image:alt" content="SF store exterior">
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="San Francisco, Your Style Story Starts Here">
<meta name="twitter:description" content="Discover our newest flagship at 1847 Market Street. Where the City&#x27;s creative spirit meets conscious fashion.">
<meta name="twitter:image" content="https://main--sdk-5--paolomoz.aem.page/content/media_15b2237d556f6f9cd3b0a118c029d3ef224a88f65.avif?width=1200&#x26;format=pjpg&#x26;optimize=medium">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script nonce="aPPTuhU93feAY/dBJ28pYWz2" src="/scripts/aem.js" type="module"></script>
<script nonce="aPPTuhU93feAY/dBJ28pYWz2" src="/scripts/scripts.js" type="module"></script>
<link rel="stylesheet" href="/styles/styles.css">
</head>
<body>
<header></header>
<main>
<div>
<div class="section-metadata">
<div>
<div>style</div>
<div>dark</div>
</div>
</div>
<div class="hero-cta">
<div>
<div>
<picture>
<source type="image/webp" srcset="./media_15b2237d556f6f9cd3b0a118c029d3ef224a88f65.avif?width=2000&#x26;format=webply&#x26;optimize=medium" media="(min-width: 600px)">
<source type="image/webp" srcset="./media_15b2237d556f6f9cd3b0a118c029d3ef224a88f65.avif?width=750&#x26;format=webply&#x26;optimize=medium">
<source type="image/avif" srcset="./media_15b2237d556f6f9cd3b0a118c029d3ef224a88f65.avif?width=2000&#x26;format=avif&#x26;optimize=medium" media="(min-width: 600px)">
<img loading="lazy" alt="SF store exterior" src="./media_15b2237d556f6f9cd3b0a118c029d3ef224a88f65.avif?width=750&#x26;format=avif&#x26;optimize=medium" width="1216" height="832">
</picture>
</div>
</div>
<div>
<div>
<h2 id="san-francisco-your-style-story-starts-here">San Francisco, Your Style Story Starts Here</h2>
<p>Discover our newest flagship at 1847 Market Street. Where the City's creative spirit meets conscious fashion.</p>
<p>Grand Opening: December 15, 2025</p>
<p><strong><a href="/">RSVP for Opening Event</a></strong></p>
</div>
</div>
</div>
</div>
<div>
<div class="section-metadata">
<div>
<div>style</div>
<div>light</div>
</div>
</div>
<div class="text-feature">
<div>
<div>
<p>CELEBRATE WITH US</p>
<h2 id="find-us-in-the-heart-of-hayes-valley">Find Us in the Heart of Hayes Valley</h2>
<p>1847 Market Street, San Francisco, CA 94103 – steps from public transit, in the heart of Hayes Valley. Join us December 15-21 for special events daily, exclusive previews, and local designer showcases. Open Monday-Saturday: 10am-8pm, Sunday: 11am-7pm with extended hours during opening week.</p>
<p><strong><a href="/">Get Directions</a></strong></p>
</div>
</div>
</div>
</div>
<div>
<div class="section-metadata">
<div>
<div>style</div>
<div>secondary</div>
</div>
</div>
<p>A SPACE DESIGNED FOR SAN FRANCISCO</p>
<h2 id="where-conscious-fashion-meets-california-cool">Where Conscious Fashion Meets California Cool</h2>
<p>Our San Francisco flagship isn't just a store—it's a celebration of the City's creative soul. Designed by local architects Studio Pacific, the space honors the building's 1920s heritage while embracing modern sustainability. Every detail reflects San Francisco's values: reclaimed redwood fixtures from the old Presidio, energy-efficient systems that cut our carbon footprint by 60%, and a community events space where local artists, designers, and changemakers can gather.</p>
<p>This is where the Bay Area's fashion-forward meet earth-conscious shoppers. Where you'll find cutting-edge sustainable brands alongside classic pieces built to last. Where personal style consultations are free, alterations are done on-site, and every purchase supports local makers.</p>
<p>We've partnered with 15 Bay Area designers to create exclusive pieces you'll only find here. From Outer Sunset surf-inspired casualwear to Mission District streetwear with a conscience, this collection is San Francisco through and through.</p>
</div>
<div>
<div class="section-metadata">
<div>
<div>style</div>
<div>light</div>
</div>
</div>
<p>CURATED BY SF, FOR SF</p>
<h2 id="exclusive-bay-area-designer-collaborations">Exclusive Bay Area Designer Collaborations</h2>
<div class="cards-trends">
<div>
<div>
<picture>
<source type="image/webp" srcset="./media_18f9f5789942588789d1d4413e949c8a240b331f8.avif?width=2000&#x26;format=webply&#x26;optimize=medium" media="(min-width: 600px)">
<source type="image/webp" srcset="./media_18f9f5789942588789d1d4413e949c8a240b331f8.avif?width=750&#x26;format=webply&#x26;optimize=medium">
<source type="image/avif" srcset="./media_18f9f5789942588789d1d4413e949c8a240b331f8.avif?width=2000&#x26;format=avif&#x26;optimize=medium" media="(min-width: 600px)">
<img loading="lazy" alt="Textile pattern detail" src="./media_18f9f5789942588789d1d4413e949c8a240b331f8.avif?width=750&#x26;format=avif&#x26;optimize=medium" width="1216" height="832">
</picture>
</div>
<div>
<p><strong>SF Exclusive</strong></p>
<h3 id="ocean-beach-textiles">Ocean Beach Textiles</h3>
<p>Hand-dyed organic cotton pieces by Marina Chen, inspired by Outer Sunset fog patterns.</p>
</div>
</div>
<div>
<div>
<picture>
<source type="image/webp" srcset="./media_1d015f817426bae6aead805abe2607e9b52331845.avif?width=2000&#x26;format=webply&#x26;optimize=medium" media="(min-width: 600px)">
<source type="image/webp" srcset="./media_1d015f817426bae6aead805abe2607e9b52331845.avif?width=750&#x26;format=webply&#x26;optimize=medium">
<source type="image/avif" srcset="./media_1d015f817426bae6aead805abe2607e9b52331845.avif?width=2000&#x26;format=avif&#x26;optimize=medium" media="(min-width: 600px)">
<img loading="lazy" alt="Leather goods detail" src="./media_1d015f817426bae6aead805abe2607e9b52331845.avif?width=750&#x26;format=avif&#x26;optimize=medium" width="1216" height="832">
</picture>
</div>
<div>
<p><strong>SF Exclusive</strong></p>
<h3 id="mission-made-leather">Mission Made Leather</h3>
<p>Upcycled leather accessories by Carlos Rodriguez, crafted from reclaimed materials.</p>
</div>
</div>
<div>
<div>
<picture>
<source type="image/webp" srcset="./media_19678314946834d8742084b96eb7dcec35ed1471d.avif?width=2000&#x26;format=webply&#x26;optimize=medium" media="(min-width: 600px)">
<source type="image/webp" srcset="./media_19678314946834d8742084b96eb7dcec35ed1471d.avif?width=750&#x26;format=webply&#x26;optimize=medium">
<source type="image/avif" srcset="./media_19678314946834d8742084b96eb7dcec35ed1471d.avif?width=2000&#x26;format=avif&#x26;optimize=medium" media="(min-width: 600px)">
<img loading="lazy" alt="Knitwear detail" src="./media_19678314946834d8742084b96eb7dcec35ed1471d.avif?width=750&#x26;format=avif&#x26;optimize=medium" width="1216" height="832">
</picture>
</div>
<div>
<p><strong>SF Exclusive</strong></p>
<h3 id="golden-gate-knits">Golden Gate Knits</h3>
<p>Luxe cashmere blends by Sophia Williams in colors inspired by the Golden Gate Bridge.</p>
</div>
</div>
<div>
<div>
<picture>
<source type="image/webp" srcset="./media_1b684e86a5f90ab81cb736f5bf7789dd09cb8fe8b.avif?width=2000&#x26;format=webply&#x26;optimize=medium" media="(min-width: 600px)">
<source type="image/webp" srcset="./media_1b684e86a5f90ab81cb736f5bf7789dd09cb8fe8b.avif?width=750&#x26;format=webply&#x26;optimize=medium">
<source type="image/avif" srcset="./media_1b684e86a5f90ab81cb736f5bf7789dd09cb8fe8b.avif?width=2000&#x26;format=avif&#x26;optimize=medium" media="(min-width: 600px)">
<img loading="lazy" alt="Sustainable basics" src="./media_1b684e86a5f90ab81cb736f5bf7789dd09cb8fe8b.avif?width=750&#x26;format=avif&#x26;optimize=medium" width="1216" height="832">
</picture>
</div>
<div>
<p><strong>SF Exclusive</strong></p>
<h3 id="bay-basics-co">Bay Basics Co.</h3>
<p>Essential pieces by Alex Tanaka made from recycled ocean plastics.</p>
</div>
</div>
</div>
</div>
<div>
<div class="section-metadata">
<div>
<div>style</div>
<div>secondary</div>
</div>
</div>
<p>SEVEN DAYS OF CELEBRATION</p>
<h2 id="opening-week-events-december-15-21">Opening Week Events: December 15-21</h2>
<p><strong>Monday, Dec 15 - Grand Opening</strong><br>10am: Ribbon cutting ceremony with Mayor. 12pm-8pm: 20% off entire store. 6pm: Evening reception with light bites &#x26; local wines. RSVP required for evening event.</p>
<p><strong>Tuesday, Dec 16 - Sustainable Style Workshop</strong><br>6pm-8pm: "Building a Capsule Wardrobe" with our style team. Learn to create 30+ outfits from 15 pieces. Complimentary styling session included. Capacity: 30 people.</p>
<p><strong>Wednesday, Dec 17 - Local Designer Night</strong><br>5pm-9pm: Meet Bay Area designers. Exclusive first look at SF collection. Trunk shows and personal fittings. Light refreshments.</p>
<p><strong>Thursday, Dec 18 - Community Give-Back</strong><br>All-day: 10% of sales donated to SF-Marin Food Bank. Clothing drive for One Warm Coat. Meet representatives from local nonprofits. Free alterations on donations.</p>
<p><strong>Friday, Dec 19 - Fashion Forward Panel</strong><br>7pm: Panel discussion "Sustainable Fashion in the Bay Area" featuring local designers and sustainability experts. Q&#x26;A and networking. Free admission, RSVP required.</p>
<p><strong>Saturday, Dec 20 - Style Sessions</strong><br>10am-6pm: Free 30-minute personal styling appointments. Professional alterations at 50% off. DJ and refreshments all day. Kids' creative corner with eco-friendly crafts.</p>
<p><strong>Sunday, Dec 21 - Closing Celebration</strong><br>11am-7pm: Final day of opening week specials. 3pm: Raffle drawing for $500 gift card. 5pm: Thank you toast with the team. Extended 30% discount on select items.</p>
</div>
<div>
<div class="section-metadata">
<div>
<div>style</div>
<div>light</div>
</div>
</div>
<p>EXPERIENCE THE DIFFERENCE</p>
<h2 id="what-makes-our-sf-store-special">What Makes Our SF Store Special</h2>
<p><strong>100% Sustainable Materials</strong> – Every item meets our strict environmental standards for conscious shopping.</p>
<p><strong>15 Bay Area Designers</strong> – Exclusive collaborations you won't find anywhere else, supporting local makers.</p>
<p><strong>Free Style Consultations</strong> – Our experts help you find your perfect look with complimentary personal styling.</p>
<p><strong>Same-Day Alterations</strong> – Professional tailoring while you browse for the perfect fit.</p>
<p><strong>Events &#x26; Workshops</strong> – Regular gatherings for the style-conscious community at our event space.</p>
<p><strong>Clothing Repair Program</strong> – Extend the life of your favorite pieces with our repair services.</p>
</div>
<div>
<div class="section-metadata">
<div>
<div>style</div>
<div>secondary</div>
</div>
</div>
<div class="banner-cta">
<div>
<div>
<p>BE PART OF THE STORY</p>
<p>Join us for the grand opening of WKND Trendsetters San Francisco. RSVP for exclusive opening week events and be among the first to experience conscious fashion, California style.</p>
<p><strong><a href="/">Reserve Your Spot</a></strong></p>
</div>
</div>
</div>
</div>
</main>
<footer></footer>
</body>
</html>
Loading
Loading