From d65fc88cff220d5429aff0ce8b1bd9e32f7d5e4a Mon Sep 17 00:00:00 2001
From: Hung Viet Nguyen <nguyenviethunghl00@gmail.com>
Date: Mon, 22 Aug 2022 17:59:34 +0700
Subject: [PATCH] example: add tailwindcss without postcss config

---
 examples/angular/package.json             |  3 +++
 examples/angular/src/app/app.component.ts |  1 +
 examples/angular/src/styles/index.css     |  4 ++++
 examples/angular/tailwind.config.js       | 11 +++++++++++
 4 files changed, 19 insertions(+)
 create mode 100644 examples/angular/tailwind.config.js

diff --git a/examples/angular/package.json b/examples/angular/package.json
index b4260feb..19b92207 100644
--- a/examples/angular/package.json
+++ b/examples/angular/package.json
@@ -37,9 +37,12 @@
     "@types/jest": "^28.1.6",
     "@types/node": "16.11.7",
     "@types/testing-library__jest-dom": "^5.14.5",
+    "autoprefixer": "^10.4.8",
     "jest": "^28.1.3",
     "jest-preview": "^0.2.8",
+    "postcss": "^8.4.16",
     "start-server-and-test": "^1.14.0",
+    "tailwindcss": "^3.1.8",
     "typescript": "~4.7.2"
   }
 }
diff --git a/examples/angular/src/app/app.component.ts b/examples/angular/src/app/app.component.ts
index c56162d5..a4b8afb1 100644
--- a/examples/angular/src/app/app.component.ts
+++ b/examples/angular/src/app/app.component.ts
@@ -29,6 +29,7 @@ export const styleUrls = [
           This text is styled by global configured SASS
         </p>
         <p class="imported-sass">This text is styled by imported SASS</p>
+        <p class="text-xanh">TailwindCSS Green</p>
         <p>
           <app-counter></app-counter>
         </p>
diff --git a/examples/angular/src/styles/index.css b/examples/angular/src/styles/index.css
index ec2585e8..17df0e7e 100644
--- a/examples/angular/src/styles/index.css
+++ b/examples/angular/src/styles/index.css
@@ -1,3 +1,7 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+
 body {
   margin: 0;
   font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
diff --git a/examples/angular/tailwind.config.js b/examples/angular/tailwind.config.js
new file mode 100644
index 00000000..39a80479
--- /dev/null
+++ b/examples/angular/tailwind.config.js
@@ -0,0 +1,11 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  content: ['./src/**/*.{html,ts}'],
+  theme: {
+    extend: {},
+    colors: {
+      xanh: '#34eb4f',
+    },
+  },
+  plugins: [],
+};