feat: tailwindcss

Author: deboracosilveira

package-lock.json

@@ -10,7 +10,7 @@
     "@types/node": "16.11.25",
     "@types/react": "17.0.39",
     "@types/react-dom": "17.0.11",
-    "axios": "^0.26.0",
+    "axios": "0.26.0",
     "react": "17.0.2",
     "react-dom": "17.0.2",
     "react-router-dom": "6.2.1",
@@ -48,10 +48,13 @@
   "devDependencies": {
     "@typescript-eslint/eslint-plugin": "5.12.1",
     "@typescript-eslint/parser": "5.12.1",
+    "autoprefixer": "10.4.2",
     "eslint": "8.9.0",
     "eslint-config-prettier": "8.4.0",
     "eslint-plugin-prettier": "4.0.0",
     "eslint-plugin-react": "7.28.0",
-    "prettier": "2.5.1"
+    "postcss": "8.4.7",
+    "prettier": "2.5.1",
+    "tailwindcss": "3.0.23"
   }
 }

package.json

@@ -1,13 +1,3 @@
-body {
-  margin: 0;
-  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
-    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
-    sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-code {
-  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
-    monospace;
-}
+@tailwind base;
+@tailwind components;
+@tailwind utilities;

src/index.css

@@ -4,7 +4,7 @@ import { Context } from '../context/Context';
 const Wall: FC = () => {
   const { posts } = useContext(Context);
 
-  return <div>Wall</div>;
+  return <div className="text-blue-500">wall</div>;
 };
 
 export default Wall;

src/pages/Wall.tsx

@@ -0,0 +1,7 @@
+module.exports = {
+  content: ['./src/**/*.{ts,tsx}'],
+  theme: {
+    extend: {}
+  },
+  plugins: []
+};