@devops-cora/tw-elements v1.1.1

TW Elements

TW Elements is a huge collection of free, interactive components for Tailwind CSS.

Table of Contents

• TW Elements
  • Table of Contents
  • Community
  • Coming soon
  • Components
  • Design blocks
  • Installation - NPM

Community

TW Elements is a community-driven project. We invite you to track our live progress 👁️ on the upcoming release.

In the meantime you can also:

• Motivate us with some words of encouragament ❤️
• Share your ideas & feature requests 💡
• Aks for help & help others in our community support 🙏
• Engage, discuss & have fun in our open-source community 💬

If you want to help the project grow, start by simply sharing it with your peers!

• Share via Dev.to
• Share via Twitter
• Share via Facebook
• Share via LinkedIn
• Share via Pinterest
• Share via Reddit
• Share via StumbleUpon
• Share via Vkontakte
• Share via Weibo
• Share via Hackernews
• Share via Gmail
• Share via email

Thank you!

Coming soon

Check out the upcoming features - make sure to join the waiting list in order to get early access!

Components

A collection of stunning components made with attention to the smallest details. Forms, cards, buttons, and hundreds of others – in TW Elements you will find all the essential elements necessary for every project.

Design blocks

Responsive Landing page blocks built with Tailwind CSS. Plenty of design blocks examples such as Teams, services, projects, faq, and many more.

Installation

NPM

1. Before starting the project make sure to install Node.js (LTS) and TailwindCSS.

2. Run the following command to install the package via NPM:

npm install @devops-cora/tw-elements

3. TW Elements is a plugin and should be included inside the tailwind.config.js file. It is also recommended to extend the content array with a js file that loads dynamic component classes:

module.exports = {
  content: [
    "./src/**/*.{html,js}",
    "./node_modules/@devops-cora/tw-elements/dist/js/**/*.js",
  ],
  plugins: [require("@devops-cora/tw-elements/dist/plugin")],
  darkMode: "class",
};

4. Dynamic components will work after adding the js file:

<script src="./TW-ELEMENTS-PATH/dist/js/tw-elements.umd.min.js"></script>

Alternatively, you can import it in the following way (bundler version):

import '@devops-cora/tw-elements';