Image quality bs

src/composables/useCameraControls.ts

@@ -6,10 +6,7 @@ export function useCameraControls(scene: Phaser.Scene): any {
   const gameStore = useGameStore()
   const zoneStore = useZoneStore()
   const camera = scene.cameras.main
-
-  // Might improve image quality
-  camera.setRoundPixels(true)
-
+  
   function onPointerDown(pointer: Phaser.Input.Pointer) {
     gameStore.setPlayerDraggingCamera(true)
   }

src/screens/Game.vue

@@ -4,7 +4,7 @@
     <GmPanel v-if="gameStore.character?.role === 'gm'" />
 
     <div v-if="!zoneEditorStore.active">
-      <Game :config="gameConfig" @create="createGame" style="image-rendering: pixelated">
+      <Game :config="gameConfig" @create="createGame">
         <Scene name="main" @preload="preloadScene" @create="createScene">
           <div v-if="isLoaded">
             <Inventory />
@@ -61,10 +61,7 @@ const gameConfig = {
   width: window.innerWidth,
   height: window.innerHeight,
   type: Phaser.AUTO, // AUTO, CANVAS, WEBGL, HEADLESS
-  resolution: 3,
-  scale: { mode: Phaser.Scale.RESIZE },
-  pixelArt: true,
-  roundPixels: true,
+  resolution: 5,
 }
 
 const createGame = (game: Phaser.Game) => {
@@ -160,3 +157,9 @@ onBeforeUnmount(() => {
   gameStore.disconnectSocket()
 })
 </script>
+
+<style lang="scss">
+canvas {
+  image-rendering: pixelated;
+}
+</style>