Waida Studio
Greencore - Astro 7 Theme for Sustainability, Green Services and Eco Commerce
A sustainability site with case studies, a nine-article blog, six pricing plans and a working shop, and not one byte of framework JavaScript. Greencore is a complete green-services theme built on Astro 7. Every page renders to static HTML, so it loads instantly and deploys anywhere — and it ships zero framework JavaScript, just one small vanilla script.
Live demo: https://greencore-astro.vercel.app
WHAT'S INSIDE
22 page templates — 47 static pages per build: home, about us, services, portfolio grid, project detail, blog, article detail, shop, product detail, category, pricing, plan detail, contact, early access, checkout, PayPal checkout, order confirmation, style guide, license, changelog, password (401) and 404
Case studies — 5 projects as Markdown, each written as two regions the design drops an image gallery between, with the client, location and year printed alongside, and a lightbox that pages through the gallery
Blog — 9 articles as Markdown, each with an author, a category, a published date, a reading time, a banner and a body of headings, paragraphs and lists, plus a three-card strip under every one
Shop — 5 products, each with a photograph, a price and a buy box, listed on the shop grid and again on all five category pages
Pricing — 6 plans across a monthly/yearly tab switch: three cards per term with the design's own dark featured card, and a detail page each with its own prose
A demo storefront that works — a cart drawer in the navigation bar, add to cart with quantity, repeats that merge instead of listing twice, quantity editing, line totals and subtotals, checkout and PayPal checkout with real field validation, and an order confirmation page that prints the order that was placed; basket in localStorage, order handed on in sessionStorage, ready to point at Stripe or Lemon Squeezy
Motion that earns its keep — scroll reveals at the design's own offsets and delays, 14 counter reels, 4 scroll-linked sections that write their own progress for the stylesheet to read, a testimonial carousel with portrait navigation, 40 FAQ rows across five pages, six hovers whose target is not a descendant of the trigger, an image and video lightbox, and three background films — all in one vanilla script, all respecting prefers-reduced-motion
Edit content, not code — add a Markdown file with an order number, and the entry, its listing card and its detail page all follow; a zod schema catches a missing photograph at build time rather than on the page
Design-token system — the whole palette, type scale, spacing and radii are 83 CSS custom properties in one :root block; change them there and every page follows
Self-hosted fonts — Inter Tight as one variable woff2 covering weights 100–900, Poppins as five static weights, no CDN requests
Responsive imagery — srcset throughout, so every picture ships at the size the slot actually needs
TypeScript throughout, zod-validated content schema
TECH STACK
Astro 7 · Markdown content collections · TypeScript · the template's own CSS — no utility framework, no build-time CSS pipeline, no animation library
REQUIREMENTS
Node 22.12 or newer. npm ships with it. Nothing else to install.
LICENSE
One end product per license. You may modify the source freely; you may not resell, sublicense or redistribute it, in whole or in substantial part.
SUPPORT