From 1876bf72a3c2831529a5d14f2c5a0da12b550a6e Mon Sep 17 00:00:00 2001
From: dconco <onipededavid208@gmail.com>
Date: Mon, 27 Nov 2023 23:48:58 +0100
Subject: [PATCH] Added tailwind style

---
 .github/workflows/webpack.yml      | 28 ++++++++++++++++++++++++++++
 .gitignore                         | 23 +++++++++++++++++++++++
 src/App.css                        |  2 +-
 src/App.jsx                        |  2 +-
 src/Router.jsx                     |  1 -
 src/components/styles/tailwind.css |  3 +++
 src/index.jsx                      |  2 ++
 src/pages/Login.jsx                |  2 +-
 tailwind.config.js                 | 10 ++++++++++
 9 files changed, 69 insertions(+), 4 deletions(-)
 create mode 100644 .github/workflows/webpack.yml
 create mode 100644 .gitignore
 create mode 100644 src/components/styles/tailwind.css
 create mode 100644 tailwind.config.js

diff --git a/.github/workflows/webpack.yml b/.github/workflows/webpack.yml
new file mode 100644
index 0000000..b95c8ed
--- /dev/null
+++ b/.github/workflows/webpack.yml
@@ -0,0 +1,28 @@
+name: NodeJS with Webpack
+
+on:
+  push:
+    branches: [ "main" ]
+  pull_request:
+    branches: [ "main" ]
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+
+    strategy:
+      matrix:
+        node-version: [14.x, 16.x, 18.x]
+
+    steps:
+    - uses: actions/checkout@v3
+
+    - name: Use Node.js ${{ matrix.node-version }}
+      uses: actions/setup-node@v3
+      with:
+        node-version: ${{ matrix.node-version }}
+
+    - name: Build
+      run: |
+        npm install
+        npx webpack
diff --git a/.gitignore b/.gitignore
new file mode 100644
index 0000000..4d29575
--- /dev/null
+++ b/.gitignore
@@ -0,0 +1,23 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# testing
+/coverage
+
+# production
+/build
+
+# misc
+.DS_Store
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
diff --git a/src/App.css b/src/App.css
index 451f251..10fa567 100644
--- a/src/App.css
+++ b/src/App.css
@@ -1,6 +1,6 @@
 button {
     cursor: pointer;
-    color: #fff;
+    color: #fff !important;
     font-weight: bold;
     display: flex;
     justify-content: center;
diff --git a/src/App.jsx b/src/App.jsx
index 689314d..74513a6 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -20,7 +20,7 @@ function App({ name }) {
     return (
         <div>
             <div style={styles.div}>
-                <h1 style={styles.h1}>Hello {name}, Welcome to React Router Modal Site</h1>
+                <h1 style={styles.h1} className='text-3xl font-bold underline'>Hello {name}, Welcome to React Router Modal Site</h1>
                 <br />
                 <h2 style={{ color: 'wheat' }}>Nice website</h2>
             </div>
diff --git a/src/Router.jsx b/src/Router.jsx
index 2985ff4..f2b0d13 100644
--- a/src/Router.jsx
+++ b/src/Router.jsx
@@ -4,7 +4,6 @@ import RouterModalProvider, { SwitchRoutes, RouteModal, routerFade, routerSlideL
 import App from './App'
 import Login from './pages/Login'
 
-
 // Render routes to Page
 const Router = () => {
     return (
diff --git a/src/components/styles/tailwind.css b/src/components/styles/tailwind.css
new file mode 100644
index 0000000..bd6213e
--- /dev/null
+++ b/src/components/styles/tailwind.css
@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
\ No newline at end of file
diff --git a/src/index.jsx b/src/index.jsx
index 1505d0c..aa09ad2 100644
--- a/src/index.jsx
+++ b/src/index.jsx
@@ -2,7 +2,9 @@ import React from 'react'
 import { createRoot } from 'react-dom/client'
 import Router from './Router'
 import reportWebVitals from './reportWebVitals';
+
 import './index.css'
+import './components/styles/tailwind.css'
 
 const Root = createRoot(document.getElementById('root'))
 Root.render(
diff --git a/src/pages/Login.jsx b/src/pages/Login.jsx
index b84c6d6..a31ef06 100644
--- a/src/pages/Login.jsx
+++ b/src/pages/Login.jsx
@@ -19,7 +19,7 @@ function Login() {
     return (
         <div>
             <div style={styles.div}>
-                <h1 style={styles.h1}>Welcome Back!</h1>
+                <h1 style={styles.h1} className='text-2xl font-bold underline'>Welcome Back!</h1>
             </div>
 
             <br />
diff --git a/tailwind.config.js b/tailwind.config.js
new file mode 100644
index 0000000..a77d75b
--- /dev/null
+++ b/tailwind.config.js
@@ -0,0 +1,10 @@
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  content: [
+    "./src/**/*.{js,jsx,ts,tsx}"
+  ],
+  theme: {
+    extend: {},
+  },
+  plugins: [],
+}
\ No newline at end of file