|
|
{% extends "base/base.jinja" %} |
|
|
|
|
|
{% block content %} |
|
|
|
|
|
<div class="relative overflow-hidden bg-super-gray"> |
|
|
<div class="absolute inset-0"> |
|
|
|
|
|
<div class="absolute inset-0 bg-gray-900/50"></div> |
|
|
<div class="absolute inset-x-0 bottom-0 h-1/2 bg-gradient-to-t from-gray-900 to-transparent"></div> |
|
|
</div> |
|
|
<div class="relative mx-auto max-w-7xl px-6 py-24 sm:py-32 lg:px-8"> |
|
|
<div class="text-center"> |
|
|
<h1 class="text-4xl font-bold tracking-tight text-white sm:text-6xl"> |
|
|
<span class="bg-gradient-to-r from-indigo-400 to-cyan-400 bg-clip-text text-transparent">Your |
|
|
Stunning Web App</span> |
|
|
</h1> |
|
|
<p class="mt-6 text-lg leading-8 text-gray-300"> |
|
|
Interactive Data Science with Marimo Notebooks |
|
|
</p> |
|
|
<div class="mt-10 flex items-center justify-center gap-x-6"> |
|
|
<a href="#marimo-container" |
|
|
class="btn btn-primary rounded-md px-8 text-base font-semibold leading-7 shadow-sm"> |
|
|
View Demo |
|
|
</a> |
|
|
<a href="#" class="text-sm font-semibold leading-6 text-white">Learn more <span |
|
|
aria-hidden="true">→</span></a> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
|
|
|
<main class="py-16 sm:py-24 lg:py-32"> |
|
|
<div class="mx-auto max-w-7xl px-6 lg:px-8"> |
|
|
<div class="mx-auto max-w-2xl lg:max-w-4xl"> |
|
|
<div class="text-center"> |
|
|
<h2 class="text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl">Interactive Data Science</h2> |
|
|
<p class="mt-4 text-lg leading-8 text-gray-600"> |
|
|
Experience the power of marimo notebooks embedded directly in your web application. |
|
|
The demo below showcases an interactive sine wave visualization. |
|
|
</p> |
|
|
</div> |
|
|
|
|
|
<div id="marimo-container" class="card mt-16"> |
|
|
<iframe |
|
|
src="/marimo/demo/" |
|
|
class="!bg-transparent" |
|
|
width="100%" |
|
|
height="800px" |
|
|
frameborder="0"></iframe> |
|
|
</div> |
|
|
</div> |
|
|
|
|
|
</div> |
|
|
|
|
|
</main> |
|
|
|
|
|
{% include "components/footer.jinja" %} |
|
|
|
|
|
{% endblock content %} |
