Waida Studio
GreenAxis - Astro 7 Theme for Renewable Energy and Sustainability
A clean-tech site with a working storefront, and not one byte of framework JavaScript. GreenAxis is a complete renewable energy and sustainability theme built on Astro 7. Every page pre-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://greenaxis-astro.vercel.app
WHAT'S INSIDE
24 page templates — 53 static pages per build: home, about, project grid, project detail, service list, service detail, news, news article, careers board, job listing, pricing, plan category, plan detail, contact, checkout, PayPal checkout, order confirmation, style guide, license, changelog, privacy, terms, password (401) and 404
Newsroom — 8 articles as Markdown, in the two card shapes the design draws: two featured across the top of the directory with a published date above the headline, six below them with an author row, three on the home page and a related strip under every article
Projects — 8 solar and clean-energy case studies as Markdown, each with a client, location and year, a full-width hero, an approach paragraph and a technology summary
Services and careers — 5 service pages numbered 01 to 05, and an 8-role openings board where every row links to a full job listing with its category, location, salary and terms
Commerce pages — three plans, each sold on two billing terms and each with its own product page and category page, plus a cart drawer, checkout, PayPal checkout and order confirmation with quantity editing, line totals, subtotals and validation that only tests fields a visitor can actually see (localStorage-based; wire up Stripe or Lemon Squeezy when you're ready to sell)
Motion that earns its keep — 1,320 scroll reveals at the design's own offsets and delays, five scroll-linked timelines, a heading that lights up character by character, eleven statistics counters, three carousels, eighteen FAQ disclosures, seven tab sets and two background films with a play/pause control — all in one vanilla script, all respecting prefers-reduced-motion
Edit content, not code — add a Markdown file with an order, and the listing, the card and the detail page all follow
Design-token system — the whole palette and type scale are 65 CSS custom properties in one :root block; change them there and every page follows
Self-hosted fonts — Urbanist as a single variable woff2 covering weights 100–900, no CDN requests
Responsive imagery — every picture ships with the srcset rungs the design gives it, so it arrives 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
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