Changes made to the project include:

 - Bootstrap package added
 - login form (testing version, no route yet)
 - test view for boostrap v5.3 test with vite

Author: p431i7o

package-lock.json

@@ -9,6 +9,11 @@
         "laravel-vite-plugin": "^0.7.2",
         "lodash": "^4.17.19",
         "postcss": "^8.1.14",
-        "vite": "^4.0.0"
+        "sass": "^1.57.1",
+        "vite": "^4.0.4"
+    },
+    "dependencies": {
+        "@popperjs/core": "^2.11.6",
+        "bootstrap": "^5.2.3"
     }
 }

package.json

@@ -1 +1,5 @@
 import './bootstrap';
+
+// Import all of Bootstrap's JS
+import * as bootstrap from 'bootstrap';
+window.bootstrap = bootstrap;

resources/js/app.js

@@ -33,3 +33,8 @@ window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest';
 //     forceTLS: (import.meta.env.VITE_PUSHER_SCHEME ?? 'https') === 'https',
 //     enabledTransports: ['ws', 'wss'],
 // });
+
+// Import our custom CSS
+
+import '../sass/app.scss'
+import '../css/app.css'

resources/js/bootstrap.js

@@ -0,0 +1,10 @@
+// Para agregar archivos aca, hay que poner en el resolve vite.config el path relativo de node_modules
+@import "~bootstrap/scss/bootstrap";
+
+@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i|Nunito:300,300i,400,400i,600,600i,700,700i|Poppins:300,300i,400,400i,500,500i,600,600i,700,700i');
+
+.btn-xsm{
+    --bs-btn-padding-y: .05rem;
+    --bs-btn-padding-x: .25rem;
+    --bs-btn-font-size: .75rem;
+}