├── .gitignore ├── css └── tailwind.css ├── README.md ├── tailwind.config.js ├── postcss.config.js ├── package.json ├── logo.svg ├── material.html └── index.html /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules/ -------------------------------------------------------------------------------- /css/tailwind.css: -------------------------------------------------------------------------------- 1 | @tailwind base; 2 | @tailwind components; 3 | @tailwind utilities; -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Tailwindcss-101 2 | Learn tailwindcss framework 📗 3 | 4 | [Demo](https://hta218.github.io/tailwindcss-101/) 5 | -------------------------------------------------------------------------------- /tailwind.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | theme: { 3 | extend: {} 4 | }, 5 | variants: {}, 6 | plugins: [] 7 | } 8 | -------------------------------------------------------------------------------- /postcss.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: [ 3 | require('tailwindcss'), 4 | require('autoprefixer') 5 | ] 6 | } -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "tailwindcss-101", 3 | "version": "1.0.0", 4 | "description": "Learn tailwindcss framework 📗", 5 | "main": "index.js", 6 | "scripts": { 7 | "test": "echo \"Error: no test specified\" && exit 1", 8 | "build": "postcss css/tailwind.css -o public/build/tailwind.css" 9 | }, 10 | "repository": { 11 | "type": "git", 12 | "url": "git+https://github.com/hta218/tailwindcss-101.git" 13 | }, 14 | "keywords": [], 15 | "author": "", 16 | "license": "ISC", 17 | "bugs": { 18 | "url": "https://github.com/hta218/tailwindcss-101/issues" 19 | }, 20 | "homepage": "https://github.com/hta218/tailwindcss-101#readme", 21 | "dependencies": { 22 | "autoprefixer": "^9.6.1", 23 | "postcss-cli": "^11.0.1", 24 | "tailwindcss": "^1.0.5" 25 | } 26 | } 27 | -------------------------------------------------------------------------------- /logo.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /material.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | TailWind CSS 9 | 10 | 11 | 12 | 13 |

TailWind CSS Basic

14 |
15 |
16 |
17 | ChitChat Logo 18 |
19 |
20 |

ChitChat

21 |

You have a new message!

22 |
23 |
24 |
25 |
26 | Woman's Face 27 |
28 |

Erin Lindford

29 |

Customer Support Specialst

30 |
31 | 32 |
33 |
34 |
35 |
36 |
37 |
38 | 39 | 42 |
43 |
44 |
45 | 46 | 47 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | Built CSS 8 | 9 | 10 | 11 | 12 | 13 |
14 |
15 |
16 |

17 | 18 | The King 19 |

20 | King Messi 23 |

24 | You can watch from any where. 25 | 26 | Start loving him 27 |

28 |

Messi is an Argentinian football player, he's now playing for 29 | FC 30 | Barcelona club in 31 | Catalunia, Spain. He has a powerful left leg with crazy skill and super fast speed

32 |
33 | 35 | Send him love 36 | 37 |
38 |
39 |
40 | 45 |
46 | 47 | 48 | --------------------------------------------------------------------------------