burger menu for mobile (media queries + resize)

2022-12-04 15:36:39 +01:00
parent 6215550ff5
commit 695dab59ee
4 changed files with 100 additions and 36 deletions
--- a/src/components/CanvasBoard.vue
+++ b/src/components/CanvasBoard.vue
@ -1,12 +1,10 @@
 <template>
-  <main id="mainContent">
-    <canvas
-      id="canvas-board"
-      ref="canvas-board"
-      :width="canvasWidth"
-      :height="canvasHeight"
-    />
-  </main>
+  <canvas
+    id="canvas-board"
+    ref="canvas-board"
+    :width="canvasWidth"
+    :height="canvasHeight"
+  />
 </template>
 <script>
  import { mapActions, mapState, mapWritableState } from "pinia";
@ -142,7 +140,8 @@
  };
 </script>
 <style>
-  #mainContent {
-    min-width: 70%;
+  #canvas-board {
+    flex: 1;
+    margin: 0 auto;
  }
 </style>