Merge pull request #4 from jtoufik/main

voor mijn docu

README.md

@@ -1,4 +1,3 @@
-![Schermafbeelding 2023-05-23 om 11 42 03](https://github.com/Stefan-Espant/connecting-people-realtime-web-app-oba/assets/89298385/1d27b143-98e1-4a49-bf33-d7a7a25d62c0)
 
 # Oba Realtime ChatArt 
 <!-- Geef je project een titel en schrijf in één zin wat het is -->
@@ -82,14 +81,14 @@ Voor dit project is gebruik gemaakt van diverse technieken als:
 Houd er rekening mee dat je mogelijk de vereiste afhankelijkheden moet installeren door npm install uit te voeren in de terminal, zoals eerder vermeld.
 
 
-## Bronnen
+## 📚Bronnen
 [docs/INSTRUCTIONS.md](docs/INSTRUCTIONS.md)
 
 [Inspiratie tekenapp](https://www.youtube.com/watch?v=y84tBZo8GFo)
 
 [LottieFiles animatie Loading state](https://lottiefiles.com/web-player?lottie_url=https%3A%2F%2Fassets10.lottiefiles.com%2Fpackages%2Flf20_b5mxg937.json)
 
 
-## Licentie
+## 👾Licentie
 
 This project is licensed under the terms of the [MIT license](./LICENSE).

public/style/blank-initial-state.css

@@ -1,6 +1,6 @@
 .blank-initial-box p {
     /* background-color: rgb(226, 226, 226); */
-    color: rgb(206, 206, 206);
+    color: rgb(108, 108, 108);
     font-weight: bold;
     gap: 1rem;
     padding-left: 1.5em;
@@ -14,7 +14,7 @@
     width: 20rem;
     height: 10rem;
 
-    background: rgba(255, 255, 255, 0.6);
+    background: rgba(238, 238, 238, 0.6);
     backdrop-filter: blur(1rem);
     border-radius: 2rem;
     border: 1px solid rgba(255, 255, 255, 0.2);

public/style/loading.css

@@ -524,7 +524,7 @@ section .loading {
     align-items: center;
     height: 100vh;
     width: 100%;
-    padding-top: 20rem;
+    padding-top: 15rem;
 
 }
 

server.js

@@ -22,7 +22,7 @@ const http = createServer(server)
 const io = new Server(http)
 
 // Stelt het poortnummer in waar express op gaat luisteren
-const port = process.env.PORT || 9000
+const port = process.env.PORT || 3000
 
 // Serveer client-side bestanden
 server.use(express.static("public"));
@@ -46,10 +46,10 @@ server.set("view engine", "ejs");
 server.set("views", "./views");
 
 // Start express op, haal het ingestelde poortnummer op
-server.listen(9000, function () {
+server.listen(port, function () {
 	// Toon een bericht in de console en geef het poortnummer door
 	console.log(
-		`Application started on http://localhost:9000`
+		`Application started on http://localhost:` + port
 	);
 });
 

views/index.ejs

@@ -141,7 +141,8 @@
                         <path d="M15.9604 0.393369C8.19455 1.90902 1.93659 8.1513 0.405306 15.8936C-2.48539 30.5032 10.6946 41.394 20.6245 39.8549C23.8434 39.3549 25.4215 35.5892 23.9449 32.6908C22.1402 29.1438 24.7184 25.0031 28.7029 25.0031H34.9296C37.7265 25.0031 39.9922 22.6906 40 19.9015C39.9609 7.5888 28.7575 -2.09886 15.9604 0.393369ZM7.49923 25.0031C6.11638 25.0031 4.99917 23.8859 4.99917 22.5031C4.99917 21.1203 6.11638 20.0031 7.49923 20.0031C8.88207 20.0031 9.99928 21.1203 9.99928 22.5031C9.99928 23.8859 8.88207 25.0031 7.49923 25.0031ZM9.99928 15.003C8.61644 15.003 7.49923 13.8858 7.49923 12.5029C7.49923 11.1201 8.61644 10.0029 9.99928 10.0029C11.3821 10.0029 12.4993 11.1201 12.4993 12.5029C12.4993 13.8858 11.3821 15.003 9.99928 15.003ZM19.9995 10.0029C18.6167 10.0029 17.4995 8.88569 17.4995 7.50286C17.4995 6.12002 18.6167 5.00282 19.9995 5.00282C21.3824 5.00282 22.4996 6.12002 22.4996 7.50286C22.4996 8.88569 21.3824 10.0029 19.9995 10.0029ZM29.9998 15.003C28.6169 15.003 27.4997 13.8858 27.4997 12.5029C27.4997 11.1201 28.6169 10.0029 29.9998 10.0029C31.3826 10.0029 32.4998 11.1201 32.4998 12.5029C32.4998 13.8858 31.3826 15.003 29.9998 15.003Z" fill="#FF0000"/>
                         </svg>
                 </summary>
-                <div style="height:200px;border:1px solid"></div>
+                <canvas width="720" height="720">
+                </canvas>
             </details>
         </div>
     </details>