diff --git a/public/main.js b/public/main.js
index e03250411e..e2490128a6 100644
--- a/public/main.js
+++ b/public/main.js
@@ -16,17 +16,17 @@
\******************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"./node_modules/react-dom/index.js\");\n/* harmony import */ var _src_App__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./src/App */ \"./src/App.js\");\n/* harmony import */ var _src_style_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./src/style.css */ \"./src/style.css\");\n\n\n\n\nreact_dom__WEBPACK_IMPORTED_MODULE_1__.render( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_src_App__WEBPACK_IMPORTED_MODULE_2__[\"default\"], null), document.getElementById('root'));\n\n//# sourceURL=webpack://rpp2210-mvp/./index.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"./node_modules/react-dom/index.js\");\n/* harmony import */ var _src_App__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./src/App */ \"./src/App.jsx\");\n/* harmony import */ var _src_style_css__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./src/style.css */ \"./src/style.css\");\n\n\n\n\nreact_dom__WEBPACK_IMPORTED_MODULE_1__.render( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_src_App__WEBPACK_IMPORTED_MODULE_2__[\"default\"], null), document.getElementById('root'));\n\n//# sourceURL=webpack://rpp2210-mvp/./index.js?");
/***/ }),
-/***/ "./src/App.js":
-/*!********************!*\
- !*** ./src/App.js ***!
- \********************/
+/***/ "./src/App.jsx":
+/*!*********************!*\
+ !*** ./src/App.jsx ***!
+ \*********************/
/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n\nvar App = function App() {\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"h1\", {\n className: \"text-3xl font-bold underline \"\n }, \"Welcome to React App thats build using Webpack and Babel separately\");\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (App);\n\n//# sourceURL=webpack://rpp2210-mvp/./src/App.js?");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n\nvar App = function App() {\n //
\n // Welcome to React App thats build using Webpack and Babel separately\n //
\n return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n className: \"h-screen flex\"\n }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n className: \"w-64 bg-red\"\n }));\n};\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (App);\n\n//# sourceURL=webpack://rpp2210-mvp/./src/App.jsx?");
/***/ }),
@@ -36,7 +36,7 @@ eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpac
\*******************************************************************************************************/
/***/ ((module, __webpack_exports__, __webpack_require__) => {
-eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/css-loader/dist/runtime/noSourceMaps.js */ \"./node_modules/css-loader/dist/runtime/noSourceMaps.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);\n// Imports\n\n\nvar ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, \"/*\\n! tailwindcss v3.2.4 | MIT License | https://tailwindcss.com\\n*//*\\n1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)\\n2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)\\n*/\\n\\n*,\\n::before,\\n::after {\\n box-sizing: border-box; /* 1 */\\n border-width: 0; /* 2 */\\n border-style: solid; /* 2 */\\n border-color: #e5e7eb; /* 2 */\\n}\\n\\n::before,\\n::after {\\n --tw-content: '';\\n}\\n\\n/*\\n1. Use a consistent sensible line-height in all browsers.\\n2. Prevent adjustments of font size after orientation changes in iOS.\\n3. Use a more readable tab size.\\n4. Use the user's configured `sans` font-family by default.\\n5. Use the user's configured `sans` font-feature-settings by default.\\n*/\\n\\nhtml {\\n line-height: 1.5; /* 1 */\\n -webkit-text-size-adjust: 100%; /* 2 */\\n -moz-tab-size: 4; /* 3 */\\n -o-tab-size: 4;\\n tab-size: 4; /* 3 */\\n font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, \\\"Segoe UI\\\", Roboto, \\\"Helvetica Neue\\\", Arial, \\\"Noto Sans\\\", sans-serif, \\\"Apple Color Emoji\\\", \\\"Segoe UI Emoji\\\", \\\"Segoe UI Symbol\\\", \\\"Noto Color Emoji\\\"; /* 4 */\\n font-feature-settings: normal; /* 5 */\\n}\\n\\n/*\\n1. Remove the margin in all browsers.\\n2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.\\n*/\\n\\nbody {\\n margin: 0; /* 1 */\\n line-height: inherit; /* 2 */\\n}\\n\\n/*\\n1. Add the correct height in Firefox.\\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\\n3. Ensure horizontal rules are visible by default.\\n*/\\n\\nhr {\\n height: 0; /* 1 */\\n color: inherit; /* 2 */\\n border-top-width: 1px; /* 3 */\\n}\\n\\n/*\\nAdd the correct text decoration in Chrome, Edge, and Safari.\\n*/\\n\\nabbr:where([title]) {\\n -webkit-text-decoration: underline;\\n text-decoration: underline;\\n}\\n\\n/*\\nRemove the default font size and weight for headings.\\n*/\\n\\nh1,\\nh2,\\nh3,\\nh4,\\nh5,\\nh6 {\\n font-size: inherit;\\n font-weight: inherit;\\n}\\n\\n/*\\nReset links to optimize for opt-in styling instead of opt-out.\\n*/\\n\\na {\\n color: inherit;\\n text-decoration: inherit;\\n}\\n\\n/*\\nAdd the correct font weight in Edge and Safari.\\n*/\\n\\nb,\\nstrong {\\n font-weight: bolder;\\n}\\n\\n/*\\n1. Use the user's configured `mono` font family by default.\\n2. Correct the odd `em` font sizing in all browsers.\\n*/\\n\\ncode,\\nkbd,\\nsamp,\\npre {\\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \\\"Liberation Mono\\\", \\\"Courier New\\\", monospace; /* 1 */\\n font-size: 1em; /* 2 */\\n}\\n\\n/*\\nAdd the correct font size in all browsers.\\n*/\\n\\nsmall {\\n font-size: 80%;\\n}\\n\\n/*\\nPrevent `sub` and `sup` elements from affecting the line height in all browsers.\\n*/\\n\\nsub,\\nsup {\\n font-size: 75%;\\n line-height: 0;\\n position: relative;\\n vertical-align: baseline;\\n}\\n\\nsub {\\n bottom: -0.25em;\\n}\\n\\nsup {\\n top: -0.5em;\\n}\\n\\n/*\\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\\n3. Remove gaps between table borders by default.\\n*/\\n\\ntable {\\n text-indent: 0; /* 1 */\\n border-color: inherit; /* 2 */\\n border-collapse: collapse; /* 3 */\\n}\\n\\n/*\\n1. Change the font styles in all browsers.\\n2. Remove the margin in Firefox and Safari.\\n3. Remove default padding in all browsers.\\n*/\\n\\nbutton,\\ninput,\\noptgroup,\\nselect,\\ntextarea {\\n font-family: inherit; /* 1 */\\n font-size: 100%; /* 1 */\\n font-weight: inherit; /* 1 */\\n line-height: inherit; /* 1 */\\n color: inherit; /* 1 */\\n margin: 0; /* 2 */\\n padding: 0; /* 3 */\\n}\\n\\n/*\\nRemove the inheritance of text transform in Edge and Firefox.\\n*/\\n\\nbutton,\\nselect {\\n text-transform: none;\\n}\\n\\n/*\\n1. Correct the inability to style clickable types in iOS and Safari.\\n2. Remove default button styles.\\n*/\\n\\nbutton,\\n[type='button'],\\n[type='reset'],\\n[type='submit'] {\\n -webkit-appearance: button; /* 1 */\\n background-color: transparent; /* 2 */\\n background-image: none; /* 2 */\\n}\\n\\n/*\\nUse the modern Firefox focus style for all focusable elements.\\n*/\\n\\n:-moz-focusring {\\n outline: auto;\\n}\\n\\n/*\\nRemove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)\\n*/\\n\\n:-moz-ui-invalid {\\n box-shadow: none;\\n}\\n\\n/*\\nAdd the correct vertical alignment in Chrome and Firefox.\\n*/\\n\\nprogress {\\n vertical-align: baseline;\\n}\\n\\n/*\\nCorrect the cursor style of increment and decrement buttons in Safari.\\n*/\\n\\n::-webkit-inner-spin-button,\\n::-webkit-outer-spin-button {\\n height: auto;\\n}\\n\\n/*\\n1. Correct the odd appearance in Chrome and Safari.\\n2. Correct the outline style in Safari.\\n*/\\n\\n[type='search'] {\\n -webkit-appearance: textfield; /* 1 */\\n outline-offset: -2px; /* 2 */\\n}\\n\\n/*\\nRemove the inner padding in Chrome and Safari on macOS.\\n*/\\n\\n::-webkit-search-decoration {\\n -webkit-appearance: none;\\n}\\n\\n/*\\n1. Correct the inability to style clickable types in iOS and Safari.\\n2. Change font properties to `inherit` in Safari.\\n*/\\n\\n::-webkit-file-upload-button {\\n -webkit-appearance: button; /* 1 */\\n font: inherit; /* 2 */\\n}\\n\\n/*\\nAdd the correct display in Chrome and Safari.\\n*/\\n\\nsummary {\\n display: list-item;\\n}\\n\\n/*\\nRemoves the default spacing and border for appropriate elements.\\n*/\\n\\nblockquote,\\ndl,\\ndd,\\nh1,\\nh2,\\nh3,\\nh4,\\nh5,\\nh6,\\nhr,\\nfigure,\\np,\\npre {\\n margin: 0;\\n}\\n\\nfieldset {\\n margin: 0;\\n padding: 0;\\n}\\n\\nlegend {\\n padding: 0;\\n}\\n\\nol,\\nul,\\nmenu {\\n list-style: none;\\n margin: 0;\\n padding: 0;\\n}\\n\\n/*\\nPrevent resizing textareas horizontally by default.\\n*/\\n\\ntextarea {\\n resize: vertical;\\n}\\n\\n/*\\n1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)\\n2. Set the default placeholder color to the user's configured gray 400 color.\\n*/\\n\\ninput::-moz-placeholder, textarea::-moz-placeholder {\\n opacity: 1; /* 1 */\\n color: #9ca3af; /* 2 */\\n}\\n\\ninput::placeholder,\\ntextarea::placeholder {\\n opacity: 1; /* 1 */\\n color: #9ca3af; /* 2 */\\n}\\n\\n/*\\nSet the default cursor for buttons.\\n*/\\n\\nbutton,\\n[role=\\\"button\\\"] {\\n cursor: pointer;\\n}\\n\\n/*\\nMake sure disabled buttons don't get the pointer cursor.\\n*/\\n:disabled {\\n cursor: default;\\n}\\n\\n/*\\n1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)\\n2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)\\n This can trigger a poorly considered lint error in some tools but is included by design.\\n*/\\n\\nimg,\\nsvg,\\nvideo,\\ncanvas,\\naudio,\\niframe,\\nembed,\\nobject {\\n display: block; /* 1 */\\n vertical-align: middle; /* 2 */\\n}\\n\\n/*\\nConstrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)\\n*/\\n\\nimg,\\nvideo {\\n max-width: 100%;\\n height: auto;\\n}\\n\\n/* Make elements with the HTML hidden attribute stay hidden by default */\\n[hidden] {\\n display: none;\\n}\\n\\n*, ::before, ::after {\\n --tw-border-spacing-x: 0;\\n --tw-border-spacing-y: 0;\\n --tw-translate-x: 0;\\n --tw-translate-y: 0;\\n --tw-rotate: 0;\\n --tw-skew-x: 0;\\n --tw-skew-y: 0;\\n --tw-scale-x: 1;\\n --tw-scale-y: 1;\\n --tw-pan-x: ;\\n --tw-pan-y: ;\\n --tw-pinch-zoom: ;\\n --tw-scroll-snap-strictness: proximity;\\n --tw-ordinal: ;\\n --tw-slashed-zero: ;\\n --tw-numeric-figure: ;\\n --tw-numeric-spacing: ;\\n --tw-numeric-fraction: ;\\n --tw-ring-inset: ;\\n --tw-ring-offset-width: 0px;\\n --tw-ring-offset-color: #fff;\\n --tw-ring-color: rgba(59, 130, 246, 0.5);\\n --tw-ring-offset-shadow: 0 0 rgba(0,0,0,0);\\n --tw-ring-shadow: 0 0 rgba(0,0,0,0);\\n --tw-shadow: 0 0 rgba(0,0,0,0);\\n --tw-shadow-colored: 0 0 rgba(0,0,0,0);\\n --tw-blur: ;\\n --tw-brightness: ;\\n --tw-contrast: ;\\n --tw-grayscale: ;\\n --tw-hue-rotate: ;\\n --tw-invert: ;\\n --tw-saturate: ;\\n --tw-sepia: ;\\n --tw-drop-shadow: ;\\n --tw-backdrop-blur: ;\\n --tw-backdrop-brightness: ;\\n --tw-backdrop-contrast: ;\\n --tw-backdrop-grayscale: ;\\n --tw-backdrop-hue-rotate: ;\\n --tw-backdrop-invert: ;\\n --tw-backdrop-opacity: ;\\n --tw-backdrop-saturate: ;\\n --tw-backdrop-sepia: ;\\n}\\n\\n::backdrop {\\n --tw-border-spacing-x: 0;\\n --tw-border-spacing-y: 0;\\n --tw-translate-x: 0;\\n --tw-translate-y: 0;\\n --tw-rotate: 0;\\n --tw-skew-x: 0;\\n --tw-skew-y: 0;\\n --tw-scale-x: 1;\\n --tw-scale-y: 1;\\n --tw-pan-x: ;\\n --tw-pan-y: ;\\n --tw-pinch-zoom: ;\\n --tw-scroll-snap-strictness: proximity;\\n --tw-ordinal: ;\\n --tw-slashed-zero: ;\\n --tw-numeric-figure: ;\\n --tw-numeric-spacing: ;\\n --tw-numeric-fraction: ;\\n --tw-ring-inset: ;\\n --tw-ring-offset-width: 0px;\\n --tw-ring-offset-color: #fff;\\n --tw-ring-color: rgba(59, 130, 246, 0.5);\\n --tw-ring-offset-shadow: 0 0 rgba(0,0,0,0);\\n --tw-ring-shadow: 0 0 rgba(0,0,0,0);\\n --tw-shadow: 0 0 rgba(0,0,0,0);\\n --tw-shadow-colored: 0 0 rgba(0,0,0,0);\\n --tw-blur: ;\\n --tw-brightness: ;\\n --tw-contrast: ;\\n --tw-grayscale: ;\\n --tw-hue-rotate: ;\\n --tw-invert: ;\\n --tw-saturate: ;\\n --tw-sepia: ;\\n --tw-drop-shadow: ;\\n --tw-backdrop-blur: ;\\n --tw-backdrop-brightness: ;\\n --tw-backdrop-contrast: ;\\n --tw-backdrop-grayscale: ;\\n --tw-backdrop-hue-rotate: ;\\n --tw-backdrop-invert: ;\\n --tw-backdrop-opacity: ;\\n --tw-backdrop-saturate: ;\\n --tw-backdrop-sepia: ;\\n}\\r\\n.text-3xl {\\n font-size: 1.875rem;\\n line-height: 2.25rem;\\n}\\r\\n.font-bold {\\n font-weight: 700;\\n}\\r\\n.underline {\\n text-decoration-line: underline;\\n}\", \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://rpp2210-mvp/./src/style.css?./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js");
+eval("__webpack_require__.r(__webpack_exports__);\n/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */ \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../node_modules/css-loader/dist/runtime/noSourceMaps.js */ \"./node_modules/css-loader/dist/runtime/noSourceMaps.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../node_modules/css-loader/dist/runtime/api.js */ \"./node_modules/css-loader/dist/runtime/api.js\");\n/* harmony import */ var _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1__);\n// Imports\n\n\nvar ___CSS_LOADER_EXPORT___ = _node_modules_css_loader_dist_runtime_api_js__WEBPACK_IMPORTED_MODULE_1___default()((_node_modules_css_loader_dist_runtime_noSourceMaps_js__WEBPACK_IMPORTED_MODULE_0___default()));\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, \"/*\\n! tailwindcss v3.2.4 | MIT License | https://tailwindcss.com\\n*//*\\n1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)\\n2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)\\n*/\\n\\n*,\\n::before,\\n::after {\\n box-sizing: border-box; /* 1 */\\n border-width: 0; /* 2 */\\n border-style: solid; /* 2 */\\n border-color: #e5e7eb; /* 2 */\\n}\\n\\n::before,\\n::after {\\n --tw-content: '';\\n}\\n\\n/*\\n1. Use a consistent sensible line-height in all browsers.\\n2. Prevent adjustments of font size after orientation changes in iOS.\\n3. Use a more readable tab size.\\n4. Use the user's configured `sans` font-family by default.\\n5. Use the user's configured `sans` font-feature-settings by default.\\n*/\\n\\nhtml {\\n line-height: 1.5; /* 1 */\\n -webkit-text-size-adjust: 100%; /* 2 */\\n -moz-tab-size: 4; /* 3 */\\n -o-tab-size: 4;\\n tab-size: 4; /* 3 */\\n font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, BlinkMacSystemFont, \\\"Segoe UI\\\", Roboto, \\\"Helvetica Neue\\\", Arial, \\\"Noto Sans\\\", sans-serif, \\\"Apple Color Emoji\\\", \\\"Segoe UI Emoji\\\", \\\"Segoe UI Symbol\\\", \\\"Noto Color Emoji\\\"; /* 4 */\\n font-feature-settings: normal; /* 5 */\\n}\\n\\n/*\\n1. Remove the margin in all browsers.\\n2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.\\n*/\\n\\nbody {\\n margin: 0; /* 1 */\\n line-height: inherit; /* 2 */\\n}\\n\\n/*\\n1. Add the correct height in Firefox.\\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\\n3. Ensure horizontal rules are visible by default.\\n*/\\n\\nhr {\\n height: 0; /* 1 */\\n color: inherit; /* 2 */\\n border-top-width: 1px; /* 3 */\\n}\\n\\n/*\\nAdd the correct text decoration in Chrome, Edge, and Safari.\\n*/\\n\\nabbr:where([title]) {\\n -webkit-text-decoration: underline;\\n text-decoration: underline;\\n}\\n\\n/*\\nRemove the default font size and weight for headings.\\n*/\\n\\nh1,\\nh2,\\nh3,\\nh4,\\nh5,\\nh6 {\\n font-size: inherit;\\n font-weight: inherit;\\n}\\n\\n/*\\nReset links to optimize for opt-in styling instead of opt-out.\\n*/\\n\\na {\\n color: inherit;\\n text-decoration: inherit;\\n}\\n\\n/*\\nAdd the correct font weight in Edge and Safari.\\n*/\\n\\nb,\\nstrong {\\n font-weight: bolder;\\n}\\n\\n/*\\n1. Use the user's configured `mono` font family by default.\\n2. Correct the odd `em` font sizing in all browsers.\\n*/\\n\\ncode,\\nkbd,\\nsamp,\\npre {\\n font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \\\"Liberation Mono\\\", \\\"Courier New\\\", monospace; /* 1 */\\n font-size: 1em; /* 2 */\\n}\\n\\n/*\\nAdd the correct font size in all browsers.\\n*/\\n\\nsmall {\\n font-size: 80%;\\n}\\n\\n/*\\nPrevent `sub` and `sup` elements from affecting the line height in all browsers.\\n*/\\n\\nsub,\\nsup {\\n font-size: 75%;\\n line-height: 0;\\n position: relative;\\n vertical-align: baseline;\\n}\\n\\nsub {\\n bottom: -0.25em;\\n}\\n\\nsup {\\n top: -0.5em;\\n}\\n\\n/*\\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\\n3. Remove gaps between table borders by default.\\n*/\\n\\ntable {\\n text-indent: 0; /* 1 */\\n border-color: inherit; /* 2 */\\n border-collapse: collapse; /* 3 */\\n}\\n\\n/*\\n1. Change the font styles in all browsers.\\n2. Remove the margin in Firefox and Safari.\\n3. Remove default padding in all browsers.\\n*/\\n\\nbutton,\\ninput,\\noptgroup,\\nselect,\\ntextarea {\\n font-family: inherit; /* 1 */\\n font-size: 100%; /* 1 */\\n font-weight: inherit; /* 1 */\\n line-height: inherit; /* 1 */\\n color: inherit; /* 1 */\\n margin: 0; /* 2 */\\n padding: 0; /* 3 */\\n}\\n\\n/*\\nRemove the inheritance of text transform in Edge and Firefox.\\n*/\\n\\nbutton,\\nselect {\\n text-transform: none;\\n}\\n\\n/*\\n1. Correct the inability to style clickable types in iOS and Safari.\\n2. Remove default button styles.\\n*/\\n\\nbutton,\\n[type='button'],\\n[type='reset'],\\n[type='submit'] {\\n -webkit-appearance: button; /* 1 */\\n background-color: transparent; /* 2 */\\n background-image: none; /* 2 */\\n}\\n\\n/*\\nUse the modern Firefox focus style for all focusable elements.\\n*/\\n\\n:-moz-focusring {\\n outline: auto;\\n}\\n\\n/*\\nRemove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)\\n*/\\n\\n:-moz-ui-invalid {\\n box-shadow: none;\\n}\\n\\n/*\\nAdd the correct vertical alignment in Chrome and Firefox.\\n*/\\n\\nprogress {\\n vertical-align: baseline;\\n}\\n\\n/*\\nCorrect the cursor style of increment and decrement buttons in Safari.\\n*/\\n\\n::-webkit-inner-spin-button,\\n::-webkit-outer-spin-button {\\n height: auto;\\n}\\n\\n/*\\n1. Correct the odd appearance in Chrome and Safari.\\n2. Correct the outline style in Safari.\\n*/\\n\\n[type='search'] {\\n -webkit-appearance: textfield; /* 1 */\\n outline-offset: -2px; /* 2 */\\n}\\n\\n/*\\nRemove the inner padding in Chrome and Safari on macOS.\\n*/\\n\\n::-webkit-search-decoration {\\n -webkit-appearance: none;\\n}\\n\\n/*\\n1. Correct the inability to style clickable types in iOS and Safari.\\n2. Change font properties to `inherit` in Safari.\\n*/\\n\\n::-webkit-file-upload-button {\\n -webkit-appearance: button; /* 1 */\\n font: inherit; /* 2 */\\n}\\n\\n/*\\nAdd the correct display in Chrome and Safari.\\n*/\\n\\nsummary {\\n display: list-item;\\n}\\n\\n/*\\nRemoves the default spacing and border for appropriate elements.\\n*/\\n\\nblockquote,\\ndl,\\ndd,\\nh1,\\nh2,\\nh3,\\nh4,\\nh5,\\nh6,\\nhr,\\nfigure,\\np,\\npre {\\n margin: 0;\\n}\\n\\nfieldset {\\n margin: 0;\\n padding: 0;\\n}\\n\\nlegend {\\n padding: 0;\\n}\\n\\nol,\\nul,\\nmenu {\\n list-style: none;\\n margin: 0;\\n padding: 0;\\n}\\n\\n/*\\nPrevent resizing textareas horizontally by default.\\n*/\\n\\ntextarea {\\n resize: vertical;\\n}\\n\\n/*\\n1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)\\n2. Set the default placeholder color to the user's configured gray 400 color.\\n*/\\n\\ninput::-moz-placeholder, textarea::-moz-placeholder {\\n opacity: 1; /* 1 */\\n color: #9ca3af; /* 2 */\\n}\\n\\ninput::placeholder,\\ntextarea::placeholder {\\n opacity: 1; /* 1 */\\n color: #9ca3af; /* 2 */\\n}\\n\\n/*\\nSet the default cursor for buttons.\\n*/\\n\\nbutton,\\n[role=\\\"button\\\"] {\\n cursor: pointer;\\n}\\n\\n/*\\nMake sure disabled buttons don't get the pointer cursor.\\n*/\\n:disabled {\\n cursor: default;\\n}\\n\\n/*\\n1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)\\n2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)\\n This can trigger a poorly considered lint error in some tools but is included by design.\\n*/\\n\\nimg,\\nsvg,\\nvideo,\\ncanvas,\\naudio,\\niframe,\\nembed,\\nobject {\\n display: block; /* 1 */\\n vertical-align: middle; /* 2 */\\n}\\n\\n/*\\nConstrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)\\n*/\\n\\nimg,\\nvideo {\\n max-width: 100%;\\n height: auto;\\n}\\n\\n/* Make elements with the HTML hidden attribute stay hidden by default */\\n[hidden] {\\n display: none;\\n}\\n\\n*, ::before, ::after {\\n --tw-border-spacing-x: 0;\\n --tw-border-spacing-y: 0;\\n --tw-translate-x: 0;\\n --tw-translate-y: 0;\\n --tw-rotate: 0;\\n --tw-skew-x: 0;\\n --tw-skew-y: 0;\\n --tw-scale-x: 1;\\n --tw-scale-y: 1;\\n --tw-pan-x: ;\\n --tw-pan-y: ;\\n --tw-pinch-zoom: ;\\n --tw-scroll-snap-strictness: proximity;\\n --tw-ordinal: ;\\n --tw-slashed-zero: ;\\n --tw-numeric-figure: ;\\n --tw-numeric-spacing: ;\\n --tw-numeric-fraction: ;\\n --tw-ring-inset: ;\\n --tw-ring-offset-width: 0px;\\n --tw-ring-offset-color: #fff;\\n --tw-ring-color: rgba(59, 130, 246, 0.5);\\n --tw-ring-offset-shadow: 0 0 rgba(0,0,0,0);\\n --tw-ring-shadow: 0 0 rgba(0,0,0,0);\\n --tw-shadow: 0 0 rgba(0,0,0,0);\\n --tw-shadow-colored: 0 0 rgba(0,0,0,0);\\n --tw-blur: ;\\n --tw-brightness: ;\\n --tw-contrast: ;\\n --tw-grayscale: ;\\n --tw-hue-rotate: ;\\n --tw-invert: ;\\n --tw-saturate: ;\\n --tw-sepia: ;\\n --tw-drop-shadow: ;\\n --tw-backdrop-blur: ;\\n --tw-backdrop-brightness: ;\\n --tw-backdrop-contrast: ;\\n --tw-backdrop-grayscale: ;\\n --tw-backdrop-hue-rotate: ;\\n --tw-backdrop-invert: ;\\n --tw-backdrop-opacity: ;\\n --tw-backdrop-saturate: ;\\n --tw-backdrop-sepia: ;\\n}\\n\\n::backdrop {\\n --tw-border-spacing-x: 0;\\n --tw-border-spacing-y: 0;\\n --tw-translate-x: 0;\\n --tw-translate-y: 0;\\n --tw-rotate: 0;\\n --tw-skew-x: 0;\\n --tw-skew-y: 0;\\n --tw-scale-x: 1;\\n --tw-scale-y: 1;\\n --tw-pan-x: ;\\n --tw-pan-y: ;\\n --tw-pinch-zoom: ;\\n --tw-scroll-snap-strictness: proximity;\\n --tw-ordinal: ;\\n --tw-slashed-zero: ;\\n --tw-numeric-figure: ;\\n --tw-numeric-spacing: ;\\n --tw-numeric-fraction: ;\\n --tw-ring-inset: ;\\n --tw-ring-offset-width: 0px;\\n --tw-ring-offset-color: #fff;\\n --tw-ring-color: rgba(59, 130, 246, 0.5);\\n --tw-ring-offset-shadow: 0 0 rgba(0,0,0,0);\\n --tw-ring-shadow: 0 0 rgba(0,0,0,0);\\n --tw-shadow: 0 0 rgba(0,0,0,0);\\n --tw-shadow-colored: 0 0 rgba(0,0,0,0);\\n --tw-blur: ;\\n --tw-brightness: ;\\n --tw-contrast: ;\\n --tw-grayscale: ;\\n --tw-hue-rotate: ;\\n --tw-invert: ;\\n --tw-saturate: ;\\n --tw-sepia: ;\\n --tw-drop-shadow: ;\\n --tw-backdrop-blur: ;\\n --tw-backdrop-brightness: ;\\n --tw-backdrop-contrast: ;\\n --tw-backdrop-grayscale: ;\\n --tw-backdrop-hue-rotate: ;\\n --tw-backdrop-invert: ;\\n --tw-backdrop-opacity: ;\\n --tw-backdrop-saturate: ;\\n --tw-backdrop-sepia: ;\\n}\\r\\n.flex {\\n display: flex;\\n}\\r\\n.h-screen {\\n height: 100vh;\\n}\\r\\n.w-64 {\\n width: 16rem;\\n}\\r\\n.text-3xl {\\n font-size: 1.875rem;\\n line-height: 2.25rem;\\n}\\r\\n.font-bold {\\n font-weight: 700;\\n}\\r\\n.underline {\\n text-decoration-line: underline;\\n}\", \"\"]);\n// Exports\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (___CSS_LOADER_EXPORT___);\n\n\n//# sourceURL=webpack://rpp2210-mvp/./src/style.css?./node_modules/css-loader/dist/cjs.js!./node_modules/postcss-loader/dist/cjs.js");
/***/ }),
diff --git a/src/App.js b/src/App.js
deleted file mode 100644
index ad17a1ffdb..0000000000
--- a/src/App.js
+++ /dev/null
@@ -1,11 +0,0 @@
-import React from 'react';
-
-const App = () => {
- return (
-
- Welcome to React App thats build using Webpack and Babel separately
-
- );
-};
-
-export default App;
diff --git a/src/App.jsx b/src/App.jsx
new file mode 100644
index 0000000000..e3bcfa530c
--- /dev/null
+++ b/src/App.jsx
@@ -0,0 +1,16 @@
+import React from 'react';
+
+const App = () => {
+
+ return (
+
+ );
+};
+
+export default App;
diff --git a/src/style.css b/src/style.css
index bd6213e1df..7fac953a7a 100644
--- a/src/style.css
+++ b/src/style.css
@@ -1,3 +1,8 @@
@tailwind base;
@tailwind components;
-@tailwind utilities;
\ No newline at end of file
+@tailwind utilities;
+
+* {
+ box-sizing: border-box;
+ outline: 1px solid limegreen !important;
+}
\ No newline at end of file