| --- | |
| import Container from "./Container.astro"; | |
| --- | |
| <div class="bg-yellow-300"> | |
| <Container> | |
| <div class="py-10 md:py-14 lg:py-20 flex justify-start items-center gap-4"> | |
| <div class="flex-grow" data-hero-text> | |
| <h1 data-driver-name class="text-7xl md:text-8xl lg:text-9xl mb-2 md:mb-3 lg:mb-4 font-bold">driver.js</h1> | |
| <p data-driver-tagline class="text-md md:text-2xl lg:text-3xl">Product tours, highlights, contextual help and more.</p> | |
| <div class="mt-4 md:mt-8 lg:mt-10 flex flex-col sm:flex-row gap-2 items-stretch"> | |
| <button data-demo-tour class="bg-black rounded-xl py-2 md:py-3 px-6 font-medium text-white text-lg md:text-xl focus:outline-0"> | |
| Show Demo Tour | |
| </button> | |
| <a href="/docs/installation" | |
| data-docs-link | |
| class="bg-white rounded-xl py-2 md:py-3 px-6 font-medium text-black text-lg md:text-xl focus:outline-0 border-4 border-black text-center"> | |
| Get Started | |
| </a> | |
| </div> | |
| </div> | |
| <div class="flex-shrink-0 hidden sm:flex"> | |
| <img src="/driver.svg" alt="Hero Image" class="sm:h-48 md:h-60 lg:h-72" /> | |
| </div> | |
| </div> | |
| </Container> | |
| </div> |