mirror of
https://github.com/mdbootstrap/Tailwind-Elements.git
synced 2026-01-25 16:43:13 +00:00
212 lines
9.8 KiB
HTML
212 lines
9.8 KiB
HTML
---
|
|
title: "TW Elements Angular Waiting List"
|
|
date: 2023-02-28T08:00:00+02:00
|
|
draft: false
|
|
main_title: "TW Elements Angular Waiting List"
|
|
subheading: "Top quality open-source UI Kit"
|
|
seo_title: "TW Elements - 500+ free Tailwind CSS components"
|
|
description: "A free collection of open source UI components, templates, sections & plugins for Tailwind CSS. Features dark mode and theming customization options."
|
|
image: "https://tecdn.b-cdn.net/img/components-big.jpg"
|
|
video: "https://www.youtube.com/watch?v=LvWh9o5sJmI"
|
|
url: "/angular"
|
|
layout: product
|
|
hidden_sidenav: true
|
|
menu:
|
|
comingsoon:
|
|
name: "Angular"
|
|
---
|
|
|
|
<!-- Section: Intro -->
|
|
<section
|
|
class="mx-auto mb-[64px] mt-24 pb-[64px] min-[576px]:max-w-[540px] min-[768px]:max-w-[720px] min-[992px]:max-w-[960px] min-[1200px]:max-w-[1140px] min-[1400px]:max-w-[1320px]">
|
|
<div class="grid grid-cols-1 items-center pt-6 lg:grid-cols-12">
|
|
<div class="relative mx-3 text-center lg:col-span-5 lg:text-left">
|
|
<div>
|
|
<div class="flex items-center md:justify-center lg:justify-start">
|
|
<svg
|
|
aria-hidden="true"
|
|
focusable="false"
|
|
data-prefix="fas"
|
|
data-icon="fa-angular"
|
|
class="ml-1 mr-1 h-20 w-20"
|
|
role="img"
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
viewBox="0 0 448 512">
|
|
<!--! Font Awesome Pro 6.3.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. -->
|
|
<path
|
|
fill="currentColor"
|
|
d="M185.7 268.1h76.2l-38.1-91.6-38.1 91.6zM223.8 32L16 106.4l31.8 275.7 176 97.9 176-97.9 31.8-275.7zM354 373.8h-48.6l-26.2-65.4H168.6l-26.2 65.4H93.7L223.8 81.5z" />
|
|
</svg>
|
|
<h1 class="mb-8 mt-6 text-4xl font-bold">
|
|
Tailwind CSS<br />
|
|
<span class="text-primary dark:text-primary-400">with Angular</span>
|
|
</h1>
|
|
</div>
|
|
<p class="text-sm font-medium text-gray-600 dark:text-gray-400">
|
|
We have added a new
|
|
<a
|
|
href="https://tw-elements.com/docs/standard/integrations/angular-integration/"
|
|
class="text-primary"
|
|
>Angular integration tutorial</a
|
|
>
|
|
for TW Elements.
|
|
</p>
|
|
|
|
<p class="mb-8 text-sm font-medium text-gray-600 dark:text-gray-400">
|
|
If you want to be the first to know about the official release of the
|
|
fully integrated and separate React package, sign up for our waiting
|
|
list below!
|
|
</p>
|
|
|
|
<div class="">
|
|
<ol class="text-md mb-10 text-gray-600 dark:text-gray-400">
|
|
<li class="mb-4">
|
|
<span
|
|
class="mr-2 inline-block pb-1 align-middle text-primary dark:text-primary-400">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke-width="3"
|
|
stroke="currentColor"
|
|
class="h-5 w-5">
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M4.5 12.75l6 6 9-13.5" />
|
|
</svg> </span
|
|
>TW Elements + Angular integration guide
|
|
</li>
|
|
<li class="mb-4">
|
|
<span
|
|
class="mr-2 inline-block pb-1 align-middle text-primary dark:text-primary-400">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke-width="3"
|
|
stroke="currentColor"
|
|
class="h-5 w-5">
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M4.5 12.75l6 6 9-13.5" />
|
|
</svg> </span
|
|
>A dedicated UI Kit for Tailwind CSS + Angular
|
|
</li>
|
|
<li class="mb-4">
|
|
<span
|
|
class="mr-2 inline-block pb-1 align-middle text-primary dark:text-primary-400">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke-width="3"
|
|
stroke="currentColor"
|
|
class="h-5 w-5">
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M4.5 12.75l6 6 9-13.5" />
|
|
</svg> </span
|
|
>Themes & templates for Tailwind CSS + Angular
|
|
</li>
|
|
<li class="mb-4">
|
|
<span
|
|
class="mr-2 inline-block pb-1 align-middle text-primary dark:text-primary-400">
|
|
<svg
|
|
xmlns="http://www.w3.org/2000/svg"
|
|
fill="none"
|
|
viewBox="0 0 24 24"
|
|
stroke-width="3"
|
|
stroke="currentColor"
|
|
class="h-5 w-5">
|
|
<path
|
|
stroke-linecap="round"
|
|
stroke-linejoin="round"
|
|
d="M4.5 12.75l6 6 9-13.5" />
|
|
</svg> </span
|
|
>& more open source resources
|
|
</li>
|
|
</ol>
|
|
|
|
<div class="">
|
|
<!--ConvertKit script-->
|
|
<script src="https://f.convertkit.com/ckjs/ck.5.js"></script>
|
|
|
|
<!--ConvertKit form-->
|
|
<form
|
|
action="https://app.convertkit.com/forms/4897459/subscriptions"
|
|
method="post"
|
|
data-sv-form="4897459"
|
|
data-uid="641c833c58"
|
|
data-format="inline"
|
|
data-version="5"
|
|
data-options='{"settings":{"after_subscribe":{"action":"message","success_message":"Success! \nNow check your email to confirm your subscription and enjoy Angular news.","redirect_url":""},"analytics":{"google":null,"fathom":null,"facebook":null,"segment":null,"pinterest":null,"sparkloop":null,"googletagmanager":null},"modal":{"trigger":"timer","scroll_percentage":null,"timer":5,"devices":"all","show_once_every":15},"powered_by":{"show":false,"url":"https://convertkit.com/features/forms?utm_campaign=poweredby&utm_content=form&utm_medium=referral&utm_source=dynamic"},"recaptcha":{"enabled":true},"return_visitor":{"action":"show","custom_content":""},"slide_in":{"display_in":"bottom_right","trigger":"timer","scroll_percentage":null,"timer":5,"devices":"all","show_once_every":15},"sticky_bar":{"display_in":"top","trigger":"timer","scroll_percentage":null,"timer":5,"devices":"all","show_once_every":15}},"version":"5"}'>
|
|
<div class="mb-4 flex gap-2 md:justify-center lg:justify-start">
|
|
<!--ConvertKit alerts-->
|
|
<ul
|
|
class="formkit-alert formkit-alert-error"
|
|
data-element="errors"
|
|
data-group="alert"></ul>
|
|
|
|
<div
|
|
class="relative w-full max-w-[400px]"
|
|
data-te-input-wrapper-init>
|
|
<input
|
|
type="email"
|
|
required=""
|
|
id="email"
|
|
name="email_address"
|
|
placeholder="Enter your email"
|
|
class="peer block min-h-[auto] w-full rounded border-0 bg-transparent px-3 py-[0.32rem] leading-[1.6] outline-none transition-all duration-200 ease-linear focus:placeholder:opacity-100 data-[te-input-state-active]:placeholder:opacity-100 motion-reduce:transition-none dark:text-gray-200 dark:placeholder:text-gray-200 [&:not([data-te-input-placeholder-active])]:placeholder:opacity-0"
|
|
required />
|
|
<label
|
|
for="tailwind-updates-form"
|
|
class="pointer-events-none absolute left-3 top-0 mb-0 max-w-[90%] origin-[0_0] truncate pt-[0.37rem] leading-[1.6] text-gray-500 transition-all duration-200 ease-out peer-focus:-translate-y-[0.9rem] peer-focus:scale-[0.8] peer-focus:text-blue-600 peer-data-[te-input-state-active]:-translate-y-[0.9rem] peer-data-[te-input-state-active]:scale-[0.8] motion-reduce:transition-none dark:text-gray-200 dark:peer-focus:text-gray-200">
|
|
Your email address
|
|
</label>
|
|
</div>
|
|
<div>
|
|
<button
|
|
type="submit"
|
|
data-te-ripple-init
|
|
data-te-ripple-color="light"
|
|
class="inline-block min-w-[90px] rounded bg-blue-600 py-2.5 text-xs font-medium uppercase leading-tight text-white shadow-md transition duration-150 ease-in-out hover:bg-blue-700 hover:shadow-lg focus:bg-blue-700 focus:shadow-lg focus:outline-none focus:ring-0 active:bg-blue-800 active:shadow-lg">
|
|
Join now
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
|
|
<script src="https://cdn.jsdelivr.net/npm/tw-elements/dist/js/index.min.js"></script>
|
|
</div>
|
|
<p class="ml-2 text-sm text-gray-500 dark:text-gray-400">
|
|
By subscribing you agree to receive the newsletter & commercial
|
|
information from the data administrator StartupFlow s.c. Kijowska 7,
|
|
Warsaw.
|
|
<a
|
|
href="https://mdbootstrap.com/general/privacy-policy/"
|
|
class="text-blue-400 dark:text-blue-300"
|
|
target="_blank">
|
|
Policy
|
|
</a>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="mx-3 mt-5 flex justify-center lg:col-span-7 lg:mt-0">
|
|
<picture>
|
|
<source
|
|
srcset="https://tecdn.b-cdn.net/img/home/main.webp"
|
|
type="image/webp" />
|
|
<img
|
|
src="https://tecdn.b-cdn.net/img/home/main.png"
|
|
class="w-100"
|
|
alt="" />
|
|
</picture>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
<!-- Section: Intro -->
|