jacs/goffeetabler
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

base tabler

Browse source
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
Download patch file Download diff file Expand all files Collapse all files

1
liquid/includes/marketing/brands/baremetrics.svg Normal file
View file

File diff suppressed because one or more lines are too long
Side by side

After

Width:  |  Height:  |  Size: 6.7 KiB

1
liquid/includes/marketing/brands/cgi.svg Normal file
View file

@ -0,0 +1 @@
<svg width="57" height="27" xmlns="http://www.w3.org/2000/svg"><path d="M14.115 5.218c-5.14 0-8.292 4.068-8.292 8.175 0 4.942 3.977 8.174 8.33 8.174 2.889 0 5.628-1.293 7.955-3.384v6.122c-2.44 1.482-5.779 2.395-8.368 2.395C6.31 26.7.082 20.579.082 13.393.082 5.789 6.348.086 13.777.086c2.852 0 6.192.874 8.368 1.977V8.07c-2.739-1.825-5.516-2.852-8.03-2.852zM38.485 26.7c-7.6 0-14.017-5.893-14.017-13.307 0-7.49 6.379-13.307 14.362-13.307 2.903 0 6.494.76 8.71 1.787v5.969c-2.522-1.445-5.769-2.624-8.596-2.624-5.232 0-8.632 4.068-8.632 8.175 0 4.828 4.01 8.326 8.71 8.326.992 0 1.947-.076 3.17-.532v-4.79h-4.278V11.34h9.778v13.459c-2.789 1.255-5.92 1.901-9.206 1.901zm12.691-1.157V.086h5.806v25.457h-5.806z" fill="currentColor" fill-rule="evenodd"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 754 B

1
liquid/includes/marketing/brands/docplanner.svg Normal file
View file

@ -0,0 +1 @@
<svg width="157" height="28" xmlns="http://www.w3.org/2000/svg"><path d="M149.521 9.204h2.522l.207 2.117h.026c.645-.969 2.215-2.21 4.044-2.314v2.761c-2.664.536-3.886 2.355-3.886 4.006v6.58h-2.913V9.203zm-13.407 6.615v-.054c0-4.044 1.911-6.955 5.864-6.955 3.665 0 5.367 2.183 5.367 6.766 0 .486-.033 1.156-.084 1.649h-8.092c.21 1.852 1.258 2.959 3.41 2.959 1.36 0 2.64-.132 3.825-.291v2.511c-1.332.215-2.462.344-3.902.344-4.189 0-6.388-2.157-6.388-6.929zm3.01-.83h5.263c0-2.057-.524-3.681-2.487-3.681-2.042 0-2.723 1.733-2.775 3.682zm-16.353-5.785h2.535s.117 1.305.169 1.775h.034c.702-1.133 2.177-2.17 3.96-2.17 3.011 0 4.506 1.652 4.506 5.002v8.542h-2.913V14.43c0-2.138-.799-2.976-2.37-2.862-1.422.103-3.009 1.777-3.009 3.87v6.916h-2.912V9.204zm-13.727 0h2.535s.118 1.305.17 1.775h.034c.702-1.133 2.176-2.17 3.96-2.17 3.011 0 4.506 1.652 4.506 5.002v8.542h-2.913V14.43c0-2.138-.8-2.976-2.37-2.862-1.422.103-3.01 1.777-3.01 3.87v6.916h-2.912V9.204zM97.571 8.95c1.265-.108 2.638-.14 3.963-.14 3.123 0 4.986 1.243 4.986 4.755v8.788h-2.62l-.13-1.315h-.033c-.898.996-2.203 1.578-3.873 1.578-2.213 0-3.971-1.476-3.971-4.4 0-2.72 2.202-5.253 7.714-4.048v-.792c0-1.567-.892-2.005-2.65-2.005-1.08 0-1.994.075-3.386.198v-2.62zm6.036 7.299c-2.335-.612-4.67.14-4.67 1.998 0 1.233.794 1.958 1.979 1.903.933-.042 1.961-.469 2.691-1.135V16.25zm-9.91-12.304v18.408h-2.912V4.293l2.913-.348zm-16.702 5.26h2.46l.158 1.423h.047c.854-1.064 2.284-1.818 3.933-1.818 3.274 0 5.028 2.507 5.028 6.768v.135c0 4.098-1.754 7.037-5.42 7.037-1.283 0-2.54-.512-3.3-1.105v5.77h-2.906V9.205zm2.906 3.85v6.055c.603.486 1.572.917 2.514.917 2.462 0 3.169-1.968 3.169-4.287 0-2.104-.393-4.142-2.776-4.142-1.152 0-2.266.698-2.907 1.457zm-11.8 2.724c.007 2.872 1.216 4.405 3.621 4.405 1.017 0 2.05-.13 2.988-.26v2.43a17.79 17.79 0 0 1-3.356.328c-3.588 0-6.287-2.034-6.298-6.903.011-4.87 2.71-6.904 6.298-6.904 1.31 0 2.585.17 3.356.33v2.428c-.938-.13-1.971-.26-2.988-.26-2.405 0-3.614 1.533-3.622 4.406zm-16.899.067v-.135c0-4.394 1.964-6.901 6.022-6.901 4.031 0 5.995 2.507 5.995 6.901v.135c0 4.394-1.964 6.902-5.995 6.902-4.058 0-6.022-2.508-6.022-6.902zm6.015-4.538c-2.062 0-3.014 1.44-3.014 4.451 0 3.01.952 4.425 3.014 4.425s2.987-1.41 2.987-4.425c0-3.015-.925-4.451-2.987-4.451zM35.752 22.353V3.945h4.49c6.256 0 9.168 1.935 9.168 9.204 0 7.27-2.911 9.204-9.168 9.204h-4.49zm10.314-9.204c0-4.139-.816-6.227-5.127-6.227H38.94v12.454h1.999c4.311 0 5.127-2.089 5.127-6.227zM14.87 21.254c.646-1.63 2.461-3.91 4.314-5.086l4.1 6.987-4.2 3.143-4.214-5.044zM8.813 26.29l-5.782-3.83C7.41 14.034 15.59 8.033 25.204 6.915l1.61 5.109c-7.925 1.607-14.538 6.994-18 14.266zm1.262-17.344L10.805 0H16l.66 8.09c-2.98 1.053-4.733 1.894-6.741 3.165a21.455 21.455 0 0 0-4.037 3.288L0 11.986l1.603-5.094 8.472 2.054z" fill="currentColor" fill-rule="nonzero"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 2.7 KiB

1
liquid/includes/marketing/brands/flow.svg Normal file
View file

@ -0,0 +1 @@
<svg width="106" height="28" xmlns="http://www.w3.org/2000/svg"><g fill="currentColor" fill-rule="evenodd"><path d="M46.45 4.633h12.902v3.829h-8.556v4.353h6.508v3.714h-6.508v7.315h-4.347V4.63v.004zm15.135 0h4.149v19.212h-4.15V4.632v.001zm14.137 16.074a2.996 2.996 0 0 0 2.406-1.125c.28-.348.49-.744.618-1.168.136-.431.202-.88.202-1.338.001-.454-.067-.906-.202-1.34a3.355 3.355 0 0 0-.618-1.154 3.15 3.15 0 0 0-1.022-.805 3.037 3.037 0 0 0-1.382-.301c-.517 0-.985.098-1.399.301-.396.19-.743.466-1.016.805a3.708 3.708 0 0 0-.619 1.153 4.176 4.176 0 0 0-.215 1.339c0 .46.071.906.215 1.338.142.434.348.82.616 1.167.27.345.61.619 1.022.82.413.203.88.302 1.398.302v.005h-.004zm-7.255-3.63c0-1 .177-1.936.532-2.81a7.154 7.154 0 0 1 1.483-2.29 6.842 6.842 0 0 1 2.29-1.54c.894-.374 1.878-.562 2.953-.562 1.076 0 2.054.186 2.938.56a6.851 6.851 0 0 1 2.275 1.536 7.075 7.075 0 0 1 1.482 2.29c.355.874.532 1.81.532 2.81a7.352 7.352 0 0 1-.534 2.806 7.024 7.024 0 0 1-1.481 2.291 7.07 7.07 0 0 1-2.27 1.553c-.884.386-1.862.579-2.937.579-1.076 0-2.06-.193-2.955-.579a7.008 7.008 0 0 1-2.29-1.555 7.117 7.117 0 0 1-1.478-2.291 7.44 7.44 0 0 1-.529-2.81l-.006.007-.005.005zm15.464-6.743h4.262l2.36 8.67 2.62-8.67h3.312l2.647 8.67 2.364-8.67h4.177l-4.638 13.511h-3.743l-2.536-7.548-2.503 7.548h-3.684l-4.64-13.51h.002z" fill-rule="nonzero"/><path d="M12.507.06c.494-.045.99-.065 1.486-.059 7.665 0 13.819 6.063 13.877 13.69-.052 2.36-1.7 4.236-3.943 4.236-2.265 0-4.226-1.568-4.226-4.24 0-3.058-2.695-5.474-5.933-5.474-3.234 0-5.564 2.62-5.607 5.76 0 5.5 3.23 10.673 7.739 12.979.384.237.534.26.884.452-1.004.273-2.16.367-2.793.367C6.265 27.771 0 21.643 0 13.972 0 6.855 5.43.806 12.504.06h.003z"/><path d="M21.495.282c5.225 1.986 8.666 7.817 8.712 13.69-.07 3.278-2.805 5.651-5.703 5.651-2.895 0-5.897-2.015-5.897-5.654 0-2.428-1.886-4.078-4.244-4.078-2.22 0-3.912 1.77-3.912 4.078 0 2.003.398 3.133.597 3.959.197.827.984 2.368 1.002 2.406.074.146.822 1.49 1.774 2.613a14.514 14.514 0 0 0 2.081 1.956c.077.059.687.51.92.664.086.056 1.594.995 3.083 1.465 1.492.467 2.747.74 4.403.74 7.694 0 14.01-6.123 14.01-13.8C38.323 6.291 32.197 0 24.388 0c-.831 0-2.1.142-2.894.282h.001z"/></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 2.1 KiB

1
liquid/includes/marketing/brands/fubotv.svg Normal file
View file

@ -0,0 +1 @@
<svg width="89" height="30" xmlns="http://www.w3.org/2000/svg"><path d="M77.3 1.897l-1.73 7.15-2.18.023 1.663-7.15-2.495.047L73.075 0l9.462.023.539 6.155L86.267.023h2.338l-5.147 9.024-1.978.023L80.244.278l.25 1.596-3.194.023zM.135 12.617l1.08-5.338 3.014.068C5.143 1.537 8.937-.69 15.408.184l-.99 5.315-2.429-.046c-1.202.047-1.845.714-2.024 1.894l3.149-.02-.99 5.27-3.217.045-3.261 16.837-5.646.02 3.217-16.905-3.082.023zm14.828-5.521H20.9L18.63 18.959c-.45 2.51-.922 5.293 2.025 5.818.817.119 1.658 0 2.454-.377 2.398-1.14 2.982-3.552 3.467-5.972l2.266-11.31 5.691-.02-4.364 22.243-5.218.069.225-1.095c-3.47 2.32-7.691 2.01-10.21.324-2.446-1.75-3.003-4.813-2.39-8.69l2.388-12.853zM32.099 29.41L37.677.213l5.601.02-1.507 7.849c2.84-1.787 6.951-1.676 9.874-.152 1.35.703 2.67 1.892 3.485 3.195 1.185 1.896 1.443 4.24 1.487 7.497.186 3.262 2.24 6.399 6.082 5.796 2.182-.342 3.909-1.465 4.855-3.539 1.221-2.675.767-6.073-.86-7.527-1.897-1.704-5.953-2.038-8.053.775-.403-1.933-.976-3.762-2.249-5.361 5.056-3.936 13.239-2.58 16.248 2.975 1.817 3.355 1.696 7.819-.036 11.435-1.457 3.04-4.096 5.384-7.308 6.33-2.734.807-5.688.604-8.107-.453-2.009-.878-3.898-2.596-4.856-4.62-1.609-3.399.24-6.556-2.06-10.351-1.366-1.837-4.15-2.441-6.471-1.496-1.962.798-3.305 2.635-3.739 4.71-.48 2.296-.002 4.946 1.843 6.276 1.964 1.537 5.773 1.225 7.715-1.346.244 1.99.881 3.845 2.385 5.407-2.73 2.472-10.565 3.711-13.991-.045l-.338 1.802-5.578.02z" fill="currentColor" fill-rule="evenodd"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 1.4 KiB

1
liquid/includes/marketing/brands/six-flags.svg Normal file
View file

@ -0,0 +1 @@
<svg width="94" height="41" xmlns="http://www.w3.org/2000/svg"><g fill-rule="nonzero" fill="none"><path d="M14.137 29.518L18.564 4.83 3.353 3.353 5.51 30.17l8.627-.652zM4.922 41l-1.071-8.922 14.796 3.245L4.922 41z" fill="currentColor"/><path d="M1 5.611l5.593 29.507.524-.191L2.733 8.933l5.017-1.22L1 5.61h0zM8.117 1l1.936 33.322.58.208L9.508 4.326l5.61-1.229L8.117 1h0z" stroke="currentColor" stroke-width=".515" fill="#FFF"/><path stroke="currentColor" stroke-width=".515" fill="#FFF" d="M11.85 8.059l-.262 26.85.624.209.79-23.725 5.645-1.22z"/><path d="M15.76 13.95l-1.563 20.985.546.183 1.698-17.771L21 16.113l-5.24-2.163h0zM1 18.749l4.278 16.35.511-.205-3.068-12.763 3.696-1.221L1 18.749h0zm4.793-8.337l2.929 23.396.566-.205-2.06-19.805 4.672-1.235-6.107-2.151h0z" stroke="currentColor" stroke-width=".515" fill="#FFF"/><path d="M32.31 13.477c-1.252-1.05-2.949-1.658-4.664-1.658-2.693 0-5.538 1.595-5.733 4.448-.352 5.163 6.406 3.82 6.253 6.066-.063.923-1.282 1.28-2.042 1.28-1.107 0-2.08-.378-2.723-1.155L21 25.186c1.331 1.176 3.206 1.7 5.053 1.7 3.105 0 5.819-1.574 6.039-4.806.361-5.288-6.408-3.798-6.251-6.085.052-.756 1.055-1.134 1.705-1.134 1.151 0 1.777.378 2.576 1.092l2.189-2.476zm4.423 2.421l-3.351-.008-.74 10.828 3.351.01.74-10.83zm-.293 10.86h4.022l2.383-3.208 1.758 3.208h3.932l-3.538-5.79 4.118-5.055h-3.842l-1.958 2.664-1.483-2.664H38.02l3.16 5.013-4.74 5.832zm-3.104-11.423l.32-3.312 4.929 1.659-5.249 1.653zm20.12.094h5.06l-.667-3.275h-7.86l-1.007 14.604h3.723l.333-5.202h3.67l.207-3.043h-3.67l.21-3.084zm5.928-3.505l-1.019 14.834h3.396l1.034-15.17-3.411.336zM65.61 22.94c.06-.881.857-1.406 1.79-1.406.913 0 1.637.525 1.576 1.406-.061.903-.858 1.428-1.77 1.428-.933 0-1.658-.525-1.596-1.428zm-1.43-4.176c.939-.399 1.977-.65 2.976-.65 1.455 0 2.15.314 2.048 1.804-.009.126-.014.231-.045.336a4.336 4.336 0 0 0-2.462-.819c-2.15 0-4.09 1.364-4.238 3.546-.158 2.309 1.102 3.904 3.62 3.904 1.152 0 2.148-.273 2.865-1.238h.044l-.138 1.11h3.01l.524-7.595c.182-2.665-1.654-3.777-4.434-3.777-.934 0-2.207.19-3.095.483l-.676 2.896zm20.415-3.798c-1.28.293-2.545.693-3.845.65-.996-.042-1.852-.23-2.482-.23-2.823 0-5.21 1.889-5.404 4.721-.1 1.49.844 2.918 2.168 3.547l-.329 1.007c.977-.293 1.684-.482 2.704-.482 1.217 0 2.419.524 2.334 1.762-.085 1.26-1.509 1.743-2.638 1.743-1.151 0-2.077-.441-2.849-1.218l-2.067 1.973c1.233 1.342 2.927 1.972 4.838 1.972 2.54 0 5.878-1.175 6.071-3.987.11-1.616-.504-2.476-1.816-3.316 1.259-.61 1.96-1.679 2.047-2.938.104-1.532-.475-1.952-.64-2.393l1.07-.105.838-2.706zm-8.538 5.12c.078-1.154 1.134-1.972 2.176-1.972 1.043 0 1.986.819 1.906 1.972-.08 1.176-1.134 1.994-2.176 1.994-1.043 0-1.986-.819-1.906-1.994zm7.323 5.33c1.422 1.113 2.462 1.47 4.351 1.47 2.194 0 4.473-1.26 4.636-3.631.306-4.491-5.03-2.686-4.906-4.491.038-.567.783-.65 1.196-.65.629 0 1.285.251 1.738.608l1.992-1.826c-.917-.88-2.263-1.51-3.61-1.51-2.215 0-4.31 1.112-4.476 3.525-.299 4.385 5.014 2.895 4.914 4.385-.054.777-1.016.861-1.58.861-.955 0-1.758-.336-2.386-.986l-1.87 2.246zm8.218-10.207c0 .713.552 1.172 1.171 1.172.62 0 1.171-.46 1.171-1.172 0-.71-.552-1.167-1.17-1.167-.62 0-1.172.457-1.172 1.167zm.31 0c0-.532.382-.916.861-.916.473 0 .86.384.86.916 0 .535-.387.922-.86.922-.479 0-.86-.387-.86-.922zm.406.653h.254v-.56h.158l.311.56h.266l-.342-.572c.189-.016.336-.11.336-.35 0-.285-.18-.388-.5-.388h-.482v1.31zm.254-1.107h.213c.116 0 .262.022.262.163 0 .16-.107.181-.25.181h-.226v-.344z" fill="currentColor"/></g></svg>
Side by side

After

Width:  |  Height:  |  Size: 3.4 KiB

1
liquid/includes/marketing/brands/vocus.svg Normal file
View file

File diff suppressed because one or more lines are too long
Side by side

After

Width:  |  Height:  |  Size: 6.4 KiB

22
liquid/includes/marketing/hero/browser.html Normal file
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>

45
liquid/includes/marketing/hero/side.html Normal file
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>

46
liquid/includes/marketing/navbar.html Normal file
View file

@ -0,0 +1,46 @@
<header class="navbar navbar-expand-lg navbar-transparent py-3">
<div class="container">
{% include "layout/navbar-logo.html" %}
<button
class="navbar-toggler"
type="button"
data-bs-toggle="collapse"
data-bs-target="#navbarTogglerDemo01"
aria-controls="navbarTogglerDemo01"
aria-expanded="false"
aria-label="Toggle primary navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarTogglerDemo01">
<nav aria-label="Primary">
<ul class="navbar-nav ms-auto">
<li class="nav-item">
<a class="nav-link active" href="{{ page | relative }}/marketing"><span class="nav-link-title">Home</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="{{ page | relative }}/marketing/testimonials.html"><span class="nav-link-title">Testimonials</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="{{ page | relative }}/marketing/pricing.html"><span class="nav-link-title">Pricing</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="{{ page | relative }}/marketing/about.html"><span class="nav-link-title">About</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="{{ page | relative }}/marketing/text.html"><span class="nav-link-title">Text</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="{{ page | relative }}/marketing/hero.html"><span class="nav-link-title">App</span></a>
</li>
<li class="nav-item">
<a class="nav-link" href="{{ page | relative }}/marketing/real-estate.html"><span class="nav-link-title">Real estate</span></a>
</li>
<li class="nav-item ms-4">
<a href="#" class="btn btn-primary">Buy now</a>
</li>
</ul>
</nav>
</div>
</div>
</header>

11
liquid/includes/marketing/section-divider.html Normal file
View file

@ -0,0 +1,11 @@
{% if include.divider == 'waves' %}
<svg class="section-divider" xmlns="http://www.w3.org/2000/svg" viewBox="0 24 150 28" preserveAspectRatio="none">
<path class="wave-1" d="M-110 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z"></path>
<path class="wave-2" d="M-110 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z"></path>
<path class="wave-3" d="M-110 44c30 0 58-18 88-18s 58 18 88 18 58-18 88-18 58 18 88 18 v44h-352z"></path>
</svg>
{% elsif include.divider == 'arc' %}
<svg class="section-divider" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 145 36" preserveAspectRatio="none">
<path d="M 145 36 m -145 -18 s 32.36 18 72.27 18 s 72.73 -18 72.73 -18 v 18 h -145 z"></path>
</svg>
{% endif %}

17
liquid/includes/marketing/sections/companies.html Normal file
View file

@ -0,0 +1,17 @@
<section class="section{% if include.background %} section-{{ include.background }}{% endif %}{% if include.class %} {{ include.class }}{% endif %}">
{% include "marketing/section-divider.html" divider=include.divider %}
<div class="container">
<div class="section-header mb-6">
<h2 class="section-title text-secondary">Trusted by over 3,000 companies</h2>
</div>
<div class="row g-lg-8 align-items-center justify-content-center">
<div class="col-auto"><a href="#" class="link-secondary">{% include "marketing/brands/baremetrics.svg" %}</a></div>
<div class="col-auto"><a href="#" class="link-secondary">{% include "marketing/brands/cgi.svg" %}</a></div>
<div class="col-auto"><a href="#" class="link-secondary">{% include "marketing/brands/docplanner.svg" %}</a></div>
<div class="col-auto"><a href="#" class="link-secondary">{% include "marketing/brands/flow.svg" %}</a></div>
<div class="col-auto"><a href="#" class="link-secondary">{% include "marketing/brands/fubotv.svg" %}</a></div>
<div class="col-auto"><a href="#" class="link-secondary">{% include "marketing/brands/six-flags.svg" %}</a></div>
<div class="col-auto"><a href="#" class="link-secondary">{% include "marketing/brands/vocus.svg" %}</a></div>
</div>
</div>
</section>

33
liquid/includes/marketing/sections/counters.html Normal file
View file

@ -0,0 +1,33 @@
<section class="section{% if include.background %} section-{{ include.background }}{% endif %}{% if include.class %} {{ include.class }}{% endif %}">
<div class="container">
<div class="row justify-content-lg-center">
<div class="col-sm-6 col-lg-3">
<div class="text-center">
<h2 class="display-5 m-0 fw-bold">48</h2>
<p class="text-secondary m-0">templates</p>
</div>
</div>
<div class="col-sm-6 col-lg-3">
<div class="text-center">
<h2 class="display-5 m-0 fw-bold">12</h2>
<p class="text-secondary m-0">years in business</p>
</div>
</div>
<div class="col-sm-6 col-lg-3">
<div class="text-center">
<h2 class="display-5 m-0 fw-bold">2,5k+</h2>
<p class="text-secondary m-0">copies sold</p>
</div>
</div>
<div class="col-sm-6 col-lg-3">
<div class="text-center">
<h2 class="display-5 m-0 fw-bold">99%</h2>
<p class="text-secondary m-0">happy customers</p>
</div>
</div>
</div>
</div>
</section>

10
liquid/includes/marketing/sections/cta.html Normal file
View file

@ -0,0 +1,10 @@
<section class="section{% if include.background %} section-{{ include.background }}{% endif %}{% if include.class %} {{ include.class }}{% endif %}">
<div class="container-narrow text-center">
<h3 class="h1">Enhance your efficiency with our application,<br />available for use immediately.</h3>
<p class="text-secondary">Lorem ipsum dolor sit amet consectetur adipisicing elit. Sunt, ipsa? Voluptates sunt, ipsum esse quis obcaecati atque placeat consectetur beatae, tenetur ducimus iure minima expedita recusandae doloribus nam. Pariatur, facilis?</p>
<div class="btn-list justify-content-center mt-6">
{% include "ui/button.html" text="Get started" color="primary" %}
{% include "ui/button.html" text="Learn more" ghost=true icon-end="chevron-right" %}
</div>
</div>
</section>

33
liquid/includes/marketing/sections/faq-2.html Normal file
View file

@ -0,0 +1,33 @@
<section class="section{% if include.background %} section-{{ include.background }}{% endif %}{% if include.class %} {{ include.class }}{% endif %}">
<div class="container">
<div class="row g-xl-6">
<div class="col-lg-4">
<div class="section-header text-start sticky-top">
<div class="section-title">Frequently asked questions</div>
<p class="section-description">Can’t find the answer you’re looking for? Reach out to our customer support team.</p>
</div>
</div>
<div class="col-lg">
<div class="space-y-5">
<div>
<div class="h3 mb-1">Can I use Tabler in commercial projects?</div>
<div class="text-secondary">Of course! Tabler is under MIT license, so you can confidently use it in commercial projects. However, remember to include a note that your project uses Tabler.</div>
</div>
<div>
<div class="h3 mb-1">How do I get notified of new Tabler versions?</div>
<div class="text-secondary">You may watch the releases on GitHub or follow me on Twitter.</div>
</div>
<div>
<div class="h3 mb-1">Can Tabler be used with WordPress?</div>
<div class="text-secondary">
Tabler is an HTML template that can be used for any purpose. However, it is not made to be easily installed on WordPress. It will require some effort and enough knowledge of the WordPress script to do so.
</div>
</div>
</div>
<div class="mt-5">
<a class="btn" href="#">Read more questions</a>
</div>
</div>
</div>
</div>
</section>

40
liquid/includes/marketing/sections/faq.html Normal file
View file

@ -0,0 +1,40 @@
<section class="section{% if include.background %} section-{{ include.background }}{% endif %}{% if include.class %} {{ include.class }}{% endif %}">
<div class="container">
<div class="section-header">
<h2 class="section-title">Frequently Asked Questions</h2>
</div>
<div class="row g-lg-4">
<div class="col-md-4 prose">
<h3 class="h2">How is Tabler Pro different from Tabler?</h3>
<p class="text-secondary">Tabler offers fundamental components that you can piece together to build your app or website. However, Tabler Pro offers an elevated convenience by providing pre-assembled components and page templates, acting as ready-to-use building blocks that can be swiftly integrated into your app, thereby saving development time.</p>
</div>
<div class="col-md-4 prose">
<h3 class="h2">Is this a yearly subscription?</h3>
<p class="text-secondary">Certainly, you have lifelong access to all our components. This implies that you will receive new components and updates every month, continuing as long as we have new component ideas to share.</p>
</div>
<div class="col-md-4 prose">
<h3 class="h2">I want to buy this but I can't afford it. Is there a discount?</h3>
<p class="text-secondary">Should you be a student or find the cost excessively high in your local currency, please reach out to us at {{ site.email }} detailing your circumstances, and we will contemplate offering you a discount.</p>
</div>
<div class="col-md-4 prose">
<h3 class="h2">What can I do with this license?</h3>
<ul class="text-secondary">
<li>To build your websites or SaaS project that end-users need to pay</li>
<li>To build an open-source tool or documentation website</li>
</ul>
</div>
<div class="col-md-4 prose">
<h3 class="h2">What version of Tabler is used?</h3>
<p class="text-secondary">The elements in Tabler Pro are created using Tabler v1.2 and later versions. If your current version is v0.8, we advise you to update to the latest version to make the most of the Pro components.</p>
</div>
<div class="col-md-4 prose">
<h3 class="h2">What restrictions does this license have?</h3>
<ul class="text-secondary">
<li>Create a clone of Tabler PRO to sell</li>
<li>Create products like templates, themes, Figma or Sketch UI kits, page builders based on the PRO components</li>
<li>Recreate the components for other UI libraries or CSS frameworks</li>
</ul>
</div>
</div>
</div>
</section>

56
liquid/includes/marketing/sections/features-2.html Normal file
View file

@ -0,0 +1,56 @@
<section class="section{% if include.background %} section-{{ include.background }}{% endif %}{% if include.class %} {{ include.class }}{% endif %}">
{% include "marketing/section-divider.html" divider=include.divider %}
<div class="container">
<div class="section-header">
<h2 class="section-title">Everything you need to deploy your app</h2>
<div class="section-description">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
</div>
<div class="row g-lg-10">
<div class="col-lg-6 mb-3 mb-lg-0">{% include "ui/svg.html" width=500 height=400 border=true %}</div>
<div class="col-lg-6">
<div class="space-y-6">
<div>
<div class="row">
<div class="col-auto">
{% include "ui/shape.html" icon="tools" size="md" %}
</div>
<div class="col">
<h3 class="h2 mb-2">Designed with users in mind</h3>
<p class="text-secondary m-0">
Tabler is fully responsive and compatible with all modern browsers. Thanks to its modern, user-friendly design you can create a fully functional interface that users will love. Every UI element has been created with
attention to detail to make your interface beautiful!
</p>
</div>
</div>
</div>
<div>
<div class="row">
<div class="col-auto">
{% include "ui/shape.html" icon="brand-bootstrap" size="md" %}
</div>
<div class="col">
<h3 class="h2 mb-2">Built for developers</h3>
<p class="text-secondary m-0">
Having in mind what it takes to write high-quality code, we want to help you speed up the development process and keep your code clean. Based on Bootstrap 5, Tabler is a cutting-edge solution, compatible with all modern
browsers and fully responsive.
</p>
</div>
</div>
</div>
<div>
<div class="row">
<div class="col-auto">
{% include "ui/shape.html" icon="paint" size="md" %}
</div>
<div class="col">
<h3 class="h2 mb-2">Fully customizable</h3>
<p class="text-secondary m-0">You can easily customize the UI elements to make them fit the needs of your project. And don’t worry if you don’t have much experience - Tabler is easy to get started!</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>

56
liquid/includes/marketing/sections/features-3.html Normal file
View file

@ -0,0 +1,56 @@
<section class="section{% if include.background %} section-{{ include.background }}{% endif %}{% if include.class %} {{ include.class }}{% endif %}">
{% include "marketing/section-divider.html" divider=include.divider %}
<div class="container">
<div class="section-header">
<h2 class="section-title">Everything you need to deploy your app</h2>
<div class="section-description">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</div>
</div>
<div class="row g-lg-10">
<div class="col-lg-6">
<div class="space-y-6">
<div>
<div class="row">
<div class="col-auto">
{% include "ui/shape.html" icon="tools" size="md" %}
</div>
<div class="col">
<h3 class="h2 mb-2">Designed with users in mind</h3>
<p class="text-secondary m-0">
Tabler is fully responsive and compatible with all modern browsers. Thanks to its modern, user-friendly design you can create a fully functional interface that users will love. Every UI element has been created with
attention to detail to make your interface beautiful!
</p>
</div>
</div>
</div>
<div>
<div class="row">
<div class="col-auto">
{% include "ui/shape.html" icon="brand-bootstrap" size="md" %}
</div>
<div class="col">
<h3 class="h2 mb-2">Built for developers</h3>
<p class="text-secondary m-0">
Having in mind what it takes to write high-quality code, we want to help you speed up the development process and keep your code clean. Based on Bootstrap 5, Tabler is a cutting-edge solution, compatible with all modern
browsers and fully responsive.
</p>
</div>
</div>
</div>
<div>
<div class="row">
<div class="col-auto">
{% include "ui/shape.html" icon="paint" size="md" %}
</div>
<div class="col">
<h3 class="h2 mb-2">Fully customizable</h3>
<p class="text-secondary m-0">You can easily customize the UI elements to make them fit the needs of your project. And don’t worry if you don’t have much experience - Tabler is easy to get started!</p>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-6 mt-3 mt-lg-0">{% include "ui/svg.html" width=500 height=400 border=true %}</div>
</div>
</div>
</section>

22
liquid/includes/marketing/sections/features.html Normal file
View file

@ -0,0 +1,22 @@
<section class="section{% if include.background %} section-{{ include.background }}{% endif %}{% if include.class %} {{ include.class }}{% endif %}">
{% include "marketing/section-divider.html" divider=include.divider %}
<div class="container">
<div class="row items-center text-center g-lg-10">
<div class="col-md-6 col-lg">
{% include "ui/shape.html" icon="devices" class="mb-3" size="md" %}
<h2 class="h2">Mobile-optimized</h2>
<p class="text-secondary">Our email templates are fully responsive, so you can be sure they will look great on any device and screen size.</p>
</div>
<div class="col-md-6 col-lg">
{% include "ui/shape.html" icon="mailbox" class="mb-3" size="md" %}
<h2 class="h2">Compatible with 90+ email clients</h2>
<p class="text-secondary">Tested across 90+ email clients and devices, Tabler emails will help you make your email communication professional and reliable.</p>
</div>
<div class="col-md-6 col-lg">
{% include "ui/shape.html" icon="palette" class="mb-3" size="md" %}
<h2 class="h2">Unique, minimal design</h2>
<p class="text-secondary">Draw recipients’ attention with beautiful, minimal email designs based on Bootstrap and Material Design principles.</p>
</div>
</div>
</div>
</section>

38
liquid/includes/marketing/sections/pricing-banner.html Normal file
View file

@ -0,0 +1,38 @@
<section class="section{% if include.background %} section-{{ include.background }}{% endif %}">
<div class="container">
<div class="bg-body-tertiary p-6 rounded-4">
<div class="row g-4 align-items-center">
<div class="col-lg">
<h3 class="h2">Team License</h3>
<p class="m-0 text-secondary">Get Marketing + Application UI for you and your team</p>
</div>
<div class="col-lg">
<ul class="list-unstyled m-0">
<li>
{% include "ui/icon.html" icon="check" color="green" class="icon-inline me-1" %}Up to 5 developers
</li>
<li>
{% include "ui/icon.html" icon="check" color="green" class="icon-inline me-1" %}All marketing + app components
</li>
<li>
{% include "ui/icon.html" icon="check" color="green" class="icon-inline me-1" %}Figma UI Kit
</li>
<li>
{% include "ui/icon.html" icon="check" color="green" class="icon-inline me-1" %}Lifetime free updates
</li>
</ul>
</div>
<div class="col-6-sm col-lg">
<div class="pricing-price m-0">
<span class="pricing-price-currency">$</span>599
<div class="pricing-price-description">
<div>per team</div>
<div>per year</div>
</div>
</div>
</div>
<div class="col-6-sm col-lg-auto"><a href="#" class="btn btn-primary w-100">Get started</a></div>
</div>
</div>
</div>
</section>

82
liquid/includes/marketing/sections/pricing.html Normal file
View file

@ -0,0 +1,82 @@
<section class="section{% if include.background %} section-{{ include.background }}{% endif %}{% if include.class %} {{ include.class }}{% endif %}">
<div class="container">
<div class="pricing">
<div class="pricing-card">
<h4 class="pricing-title">Free</h4>
<div class="pricing-price">
<span class="pricing-price-currency">$</span>99
<div class="pricing-price-description">
<div>per user</div>
<div>per year</div>
</div>
</div>
<ul class="pricing-features my-5">
<li>
{% include "ui/icon.html" icon="check" color="green" class="icon-inline me-1" %}Up to 5 developers
</li>
<li>
{% include "ui/icon.html" icon="check" color="green" class="icon-inline me-1" %}All marketing + app components
</li>
<li>
{% include "ui/icon.html" icon="check" color="green" class="icon-inline me-1" %}Figma UI Kit
</li>
<li>
{% include "ui/icon.html" icon="check" color="green" class="icon-inline me-1" %}Lifetime free updates
</li>
</ul>
<div class="pricing-btn"><a href="#" class="btn w-100">Get started</a></div>
</div>
<div class="pricing-card featured">
<div class="pricing-label"><div class="badge bg-primary text-primary-fg">Popular</div></div>
<h4 class="pricing-title">All features</h4>
<div class="pricing-price">
<span class="pricing-price-currency">$</span>199
<div class="pricing-price-description">
<div>per user</div>
<div>per year</div>
</div>
</div>
<ul class="pricing-features my-5">
<li>
{% include "ui/icon.html" icon="check" color="green" class="icon-inline me-1" %}Up to 5 developers
</li>
<li>
{% include "ui/icon.html" icon="check" color="green" class="icon-inline me-1" %}All marketing + app components
</li>
<li>
{% include "ui/icon.html" icon="check" color="green" class="icon-inline me-1" %}Figma UI Kit
</li>
<li>
{% include "ui/icon.html" icon="check" color="green" class="icon-inline me-1" %}Lifetime free updates
</li>
</ul>
<div class="pricing-btn"><a href="#" class="btn w-100 btn-primary">Get started</a></div>
</div>
<div class="pricing-card">
<h4 class="pricing-title">Other</h4>
<div class="pricing-price">
<span class="pricing-price-currency">$</span>99
<div class="pricing-price-description">
<div>per user</div>
<div>per year</div>
</div>
</div>
<ul class="pricing-features my-5">
<li>
{% include "ui/icon.html" icon="check" color="green" class="icon-inline me-1" %}Up to 5 developers
</li>
<li>
{% include "ui/icon.html" icon="check" color="green" class="icon-inline me-1" %}All marketing + app components
</li>
<li>
{% include "ui/icon.html" icon="check" color="green" class="icon-inline me-1" %}Figma UI Kit
</li>
<li>
{% include "ui/icon.html" icon="check" color="green" class="icon-inline me-1" %}Lifetime free updates
</li>
</ul>
<div class="pricing-btn"><a href="#" class="btn w-100">Get started</a></div>
</div>
</div>
</div>
</section>

19
liquid/includes/marketing/sections/subscribe.html Normal file
View file

@ -0,0 +1,19 @@
<section class="section{% if include.background %} section-{{ include.background }}{% endif %}{% if include.class %} {{ include.class }}{% endif %}">
<div class="container">
<div class="section-header mb-6">
<h2 class="section-title">Subscribe on our newsletter</h2>
<p class="section-description">Get daily news on upcoming offers from many suppliers all over the world</p>
</div>
</div>
<div class="container-tight">
<div class="row">
<div class="col">
<input class="w-100 form-control" placeholder="Your Email" type="email" />
</div>
<div class="col-auto">
<button type="submit" class="btn btn-primary">{% include "ui/icon.html" icon="mail" %} Subscribe</button>
</div>
</div>
</div>
</section>

44
liquid/includes/marketing/sections/testimonials.html Normal file
View file

@ -0,0 +1,44 @@
{% assign limit = include.limit | default: 99 %}
<section class="section{% if include.background %} section-{{ include.background }}{% endif %}{% if include.class %} {{ include.class }}{% endif %}">
<div class="container">
{% unless include.hide-header %}
<div class="section-header">
<h2 class="section-title">Trusted by hundreds</h2>
<p class="section-description">Our Users send us bunch of smilies with our services, and we love them 😍</p>
</div>
{% endunless %}
<div class="row g-lg-6">
{% assign i = 1 %}
{% assign filtered-testimonials = testimonials | slice: 0, limit | split_to_n: 3 %}
{% for group in filtered-testimonials %}
<div class="col-md-6 col-lg-4">
<div class="row g-lg-6">
{% for testimonial in group %}
{% assign person = people[i] %}
<div class="col-12">
<a href="#" class="card bg-surface-secondary">
<div class="card-body">
<div class="row mb-3">
<div class="col-auto">{% include "ui/avatar.html" person=person size="md" %}</div>
<div class="col">
<h3 class="h3 m-0">{{ person.full_name }}</h3>
<div class="text-secondary">{{ person.job_title }}</div>
</div>
</div>
<p>
{{ testimonial }}
</p>
</div>
</a>
</div>
{% assign i = i | plus: 1 %}
{% endfor %}
</div>
</div>
{% endfor %}
</div>
</div>
</section>