Thank you very much for your purchase!

Note: You could use the ready-to-use (pre-compiled) demos available in the dist folder, if you are not looking for any customization. In that case, you can skip below setup steps.

Introduction

T-Wind is a Tailwind admin dashboard and multipurpose application ui kit. It is fully responsive and included awesome features to help build web applications fast and easy. The tones of well designed and developed layouts, components, elements, widgets and application pages allows you to create any saas based application, custom admin panel or dashboard application. The clean and flexible code enable you to easily customize it.

You are important for us and so please feel free to get back to me with any question or feedback.

Structure

I have tried my best to have standards and modular structure while developing the theme. Following sections are explaining the theme File & Folder, structure, html file struture and plugins.

File & Folder Structure

	
	
	
	
	Theme Directory
	
   T-Wind/
	│ 
	├── dist/
	│   	
	│
	├── src/
	│	│
	│	├── assets/
	│	│   	└── css	
	│	│	│   └── All css
	│	│   	└── fonts
	│	│	│   └── All fonts
	│	│   	└── images	
	│	│	│   └── All images
	│	│   	└── js	
	│	│	    └── All js
	│	│
	│	├── partials/
	│	│	└── 	
	│	│	└── body.html 
	│	│	└── footer.html 
	│	│	└── head-css.html 
	│	│	└── horizontal.html 
	│	│	└── title-meta.html 
	│	│	
	│	│		  	
	│	│   
	│	├── All html files.
	│	
	│
	├── gulpfile.js
	│
	├── package.json
	│
	├── postcss.config.js
	│
	└── tailwind.config.js

HTML Structure

Installation

We are using gulp which allows to have complete automatation for build flow. In case if you don't know - Gulp is a toolkit for automating painful or time-consuming tasks in development workflow, so you can stop messing around and build something. You can read it more about it here.

Prerequisites

Please follow below steps to install and setup all prerequisites:

  • Nodejs

    In order to use build tools you will need to download and install Node.js. If you do not have Node.js installed already, you can get it by downloading the package installer from the official website. Please download the stable version of Node.js (LTS).

    Download Node.js
  • Gulp

    Make sure to have the Gulp installed & running in your computer. If you already have installed gulp on your computer, you can skip this step. In order to install, just run command npm install -g gulp from your terminal.

  • Yarn

    Make sure to have the Yarn installed & running in your computer. If you already have installed yarn on your computer, you can skip this step.

  • Git

    Make sure to have the Git installed & running in your computer. If you already have installed git on your computer, you can skip this step

To setup, follow below mentioned steps:

  • Install Prerequisites

    Make sure to have all above prerequisites installed & running in your computer

  • Install Dependencies

    Open your terminal, go to your folder and enter the command npm install. This would install all required dependencies in node_modules folder.

After you finished with above steps, you can run the command to compile scss into css: gulp

Installation

Open your terminal, go to your folder and enter the command yarn install. This would install all required dependencies in node_modules folder. And now, you are ready to run the Ubold for the first time.

Following are the stylesheet files:

Command Description
gulp Runs the "vertical" demo locally, starts the development server and watches for any changes in your code, including your html, javascript, sass, etc. The development server is accessible at http://localhost:3000/.
gulp build whitespace-normal">It compiles the source assets including scss and bundles into production ready use.

Themes

T-Wind uses jQuery, Bootstrap JS framework(at its core) and some of the third-party plugins. There are may more third party plugin which you can use according to your needs. The css is already containing matching style for these plugins so you will not need to do anything around it.

They are explained below:

Themes Changes
Light version Default
Drak version To have dark mode enabled, replace the reference of html lang="en" dir="ltr" class="" stylesheet file to html lang="en" dir="ltr" class="dark" and to
in the src/partials/body.html and all html files it will set to dark version.

Credits & Official Documentation

I've used the following resources as listed. These are some awesome creation and I am really thankful to the respective community.

Support

Once again thank you for purchasing the theme. I am always avaialble to help you. If you have any suggestion or feature to make it more better, I am requesting you to contact me, I'll try my best to add them in future updates.

Best,

- Mannat-themes

Change Log

Version 1.0.0 - 16 July 2022

  • Initial released