base tabler

This commit is contained in:
JACS 2026-05-01 12:46:11 -05:00
parent ac2cfa9fe1
commit 0f84beacf1
1432 changed files with 28760 additions and 1 deletions

View file

@ -0,0 +1,22 @@
<header class="hero pb-0">
<div class="container">
<h1 class="hero-title">Develop beautiful web apps with&nbsp;Tabler</h1>
<p class="hero-description mt-4">
Tabler is a free and open source web application UI kit based on Bootstrap&nbsp;5, with hundreds responsive
components and multiple layouts.
</p>
<div class="my-5">
<div class="row g-3 justify-content-center">
<div class="col-auto">
<a href="#" class="btn btn-lg">See features</a>
</div>
<div class="col-auto">
<a href="#" class="btn btn-lg btn-primary" target="_blank" rel="noopener noreferrer">Preview template</a>
</div>
</div>
</div>
<div class="hero-img img-overlap-margin">
{% include "ui/marketing/browser.html" %}
</div>
</div>
</header>

View file

@ -0,0 +1,45 @@
<header class="hero">
<div class="container">
<div class="row g-lg-8 align-items-center">
<div class="col-md-6 text-center text-md-start">
<div class="hero-subheader">Tabler Emails</div>
<h1 class="hero-title">
Better email communication,<br />
{% include "ui/typed.html" strings="more effective|more efficient|more productive" %}
</h1>
<p class="hero-description mt-4">54 eye-catching, customizable and responsive email templates to improve your email communication. No coding skills needed.</p>
<div class="mt-6 mt-lg-7">
<div class="row justify-content-center justify-content-md-start">
<div class="col-auto"><a href="#" class="btn btn-lg btn-primary">Buy for $29</a></div>
<div class="col-auto"><a href="#" class="btn btn-lg">Browse gallery</a></div>
</div>
</div>
</div>
<div class="col-md-6">
<div class="hero-img-side">
<div id="carousel-controls" class="carousel slide" data-bs-ride="carousel" data-interval="4000">
<div class="carousel-inner">
<div class="carousel-item active">
{% include "ui/illustration.html" image="boy-with-key.svg" class="d-block mx-auto" height="350" %}
</div>
<div class="carousel-item">
{% include "ui/illustration.html" image="boy-girl.svg" class="d-block mx-auto" height="350" %}
</div>
<div class="carousel-item">
{% include "ui/illustration.html" image="computer-fix.svg" class="d-block mx-auto" height="350" %}
</div>
</div>
<a class="carousel-control-prev text-secondary" href="#carousel-controls" role="button" data-bs-slide="prev">
{% include "ui/icon.html" icon="chevron-left" class="icon-md" %}
<span class="visually-hidden">Previous</span>
</a>
<a class="carousel-control-next text-secondary" href="#carousel-controls" role="button" data-bs-slide="next">
{% include "ui/icon.html" icon="chevron-right" class="icon-md" %}
<span class="visually-hidden">Next</span>
</a>
</div>
</div>
</div>
</div>
</div>
</header>