Using tailwind instead of scss as much as possible

src/app/shared/components/generic-grid/generic-grid.html

@@ -1,3 +1,5 @@
-<div class="canvas-container">
-  <canvas #gridCanvas></canvas>
+<div class="flex justify-center items-center w-full max-w-[1000px] mx-auto">
+  <canvas #gridCanvas
+          class="block w-full h-auto aspect-square min-w-[200px] max-w-[1000px] touch-none rounded-[clamp(10px,2vw,20px)] outline-none">
+  </canvas>
 </div>

src/app/shared/components/particles-background/particles-background.component.scss

@@ -7,9 +7,3 @@
   z-index: -1;
   pointer-events: none;
 }
-canvas {
-  display: block;
-  width: 100%;
-  height: 100%;
-  border-width: 0;
-}

src/app/shared/components/render-canvas/babylon-canvas.component.html

@@ -1,3 +1,5 @@
-<div class="canvas-container">
-  <canvas #renderCanvas></canvas>
+<div class="flex justify-center items-center w-full max-w-[1000px] mx-auto">
+  <canvas #renderCanvas
+          class="block w-full h-auto aspect-square min-w-[200px] max-w-[1000px] touch-none rounded-[clamp(10px,2vw,20px)] outline-none">
+  </canvas>
 </div>