Landing page 14
A centred heading, line and two buttons over a wide row of geometric shapes, over a dot grid. Then customer logos, a content section, customer quotes, figures, ways to get in touch, a newsletter signup and a footer on dark.
Last updated
---
/**
* Landing page 14: A centred heading, line and two buttons over a wide row of geometric shapes, over a dot grid. Then customer logos, a content section, customer quotes, figures, ways to get in touch, a newsletter signup and a footer on dark.
*
* @page landing
*/
import Divider from '@/components/apogee/Divider/Divider.astro'
import Navigation from '../../blocks/header-navigation/DropdownTwoColsWithLinksAndFooter.astro'
import Hero from '../../blocks/hero/GeometricShapes03.astro'
import Logos from '../../blocks/social-proof/FullWidth.astro'
import Article from '../../blocks/content/SectionSplitImage03.astro'
import Testimonials from '../../blocks/testimonials/AbstractImage.astro'
import Metrics from '../../blocks/metrics/SplitImage01.astro'
import Contact from '../../blocks/contact/IconsAndImage.astro'
import Newsletter from '../../blocks/newsletter/CardVertical.astro'
import Footer from '../../blocks/footers/Large15.astro'
---
<Navigation />
<main>
<Hero />
<Logos />
<Article />
<div class="mx-auto max-w-7xl px-gutter"><Divider /></div>
<Testimonials />
<div class="mx-auto max-w-7xl px-gutter"><Divider /></div>
<Metrics />
<Contact />
<Newsletter />
</main>
<div data-theme="dark" class="bg-page text-neutral"><Footer /></div>
Show codeHide code
---
/**
* Landing page 14: A centred heading, line and two buttons over a wide row of geometric shapes, over a dot grid. Then customer logos, a content section, customer quotes, figures, ways to get in touch, a newsletter signup and a footer on dark.
*
* @page landing
*/
import Divider from '@/components/apogee/Divider/Divider.astro'
import Navigation from '../../blocks/header-navigation/DropdownTwoColsWithLinksAndFooter.astro'
import Hero from '../../blocks/hero/GeometricShapes03.astro'
import Logos from '../../blocks/social-proof/FullWidth.astro'
import Article from '../../blocks/content/SectionSplitImage03.astro'
import Testimonials from '../../blocks/testimonials/AbstractImage.astro'
import Metrics from '../../blocks/metrics/SplitImage01.astro'
import Contact from '../../blocks/contact/IconsAndImage.astro'
import Newsletter from '../../blocks/newsletter/CardVertical.astro'
import Footer from '../../blocks/footers/Large15.astro'
---
<Navigation />
<main>
<Hero />
<Logos />
<Article />
<div class="mx-auto max-w-7xl px-gutter"><Divider /></div>
<Testimonials />
<div class="mx-auto max-w-7xl px-gutter"><Divider /></div>
<Metrics />
<Contact />
<Newsletter />
</main>
<div data-theme="dark" class="bg-page text-neutral"><Footer /></div>Add
npx @ava-ui/apogee add landing/landing-page-14This copies the page to src/components/apogee/pages/landing/ with the blocks it stacks and everything they use: header-navigation/dropdown-two-cols-with-links-and-footer, hero/geometric-shapes-03, social-proof/full-width, content/section-split-image-03, testimonials/abstract-image, metrics/split-image-01, contact/icons-and-image, newsletter/card-vertical, footers/large-15. Render it from a page in src/pages/ inside a layout that has no <main> of its own, or use Copy code above.
Accessibility
- The page brings its own landmarks: the header and its navigation, one
<main>, and the footer. - The heading of the first section (hero/geometric-shapes-03) is the page’s only
h1; every other section heading is anh2, with item titles one level down. - Each block keeps its own accessibility notes; follow the links above.