https://github.com/ikhsan3adi/learn-tailwind-css

My personal TailwindCSS learning progress
https://github.com/ikhsan3adi/learn-tailwind-css

css front-end frontend html javascript npm tailwind tailwindcss

Last synced: 25 days ago
JSON representation

My personal TailwindCSS learning progress

• Host: GitHub
• URL: https://github.com/ikhsan3adi/learn-tailwind-css
• Owner: ikhsan3adi
• License: mit
• Created: 2023-07-08T13:17:45.000Z (over 1 year ago)
• Default Branch: main
• Last Pushed: 2024-03-31T00:52:05.000Z (7 months ago)
• Last Synced: 2024-03-31T01:33:06.024Z (7 months ago)
• Topics: css, front-end, frontend, html, javascript, npm, tailwind, tailwindcss
• Language: HTML
• Homepage: https://ikhsan3adi.github.io/learn-tailwind-css/
• Size: 465 KB
• Stars: 1
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# TailwindCSS Example

[![Node.js CI](https://github.com/ikhsan3adi/TailwindCSS-Example/actions/workflows/node.js.yml/badge.svg)](https://github.com/ikhsan3adi/TailwindCSS-Example/actions/workflows/node.js.yml)

My personal tailwind css learning progress

- Spacing

- Sizing

- Color

- Typography

- Background image

- Pseudo-class

- Transform

- Transition

- Animation

- Layout

- Responsive design

- Flexbox

- Grid

- Dark theme

## How To Run

1. Clone this repo.

2. Install dependencies.

```bash

npm i

```

3. Run the CLI tool to scan your template files for classes and build your CSS.

```bash

npm run css

```

4. Optimizing for Production, you can minify your CSS.

```bash

npm run minicss

```

5. Open `index.html` file in your browser.

## Author

- [@ikhsan3adi](https://www.github.com/ikhsan3adi)