fix: clipping plane, responsive

src/components/game-ui/game-chat.vue

@@ -170,6 +170,8 @@ i
   border-radius 12px
   margin .5em
   max-width 1000px
+  width 40%
+  min-width 300px
   min-height 150px
   max-height 150px
   transition all .3s

src/components/misc/floating-bubbles.vue

@@ -1,10 +1,7 @@
 <template lang="pug">
 .bubbles
   - for (var i = 0; i < 128; i++)
-      div.bubble(
-        style=`
-        --size:${2+Math.random()*4}rem; --distance:${6+Math.random()*4}rem; --position:${-5+Math.random()*110}%; --time:${2+Math.random()*2}s; --delay:${-1*(2+Math.random()*2)}s;
-        `)
+      div.bubble(style=`--size:${2+Math.random()*4}rem; --distance:${6+Math.random()*4}rem; --position:${-5+Math.random()*110}%; --time:${2+Math.random()*2}s; --delay:${-1*(2+Math.random()*2)}s;`)
 </template>
 
 <style lang="stylus" scoped>
@@ -14,6 +11,8 @@
   left 0
   right 0
   height 1rem
+  pointer-events none
+  user-select none
   filter:url("#blob")
 .bubble
   position absolute

src/components/misc/section-container.vue

@@ -37,11 +37,7 @@ b.sui-network
   text-transform uppercase
   color #eee
 .container
-  display flex
-  flex-flow column nowrap
-  align-items center
   padding 3em
-  height 100%
   >span
     display flex
     width 100%

src/core/game/game.js

@@ -242,7 +242,7 @@ const camera = new PerspectiveCamera(
   60, // Field of view
   window.innerWidth / window.innerHeight, // Aspect ratio
   0.1, // Near clipping plane
-  1500, // Far clipping plane
+  2000, // Far clipping plane
 )
 const pool = create_pools(scene)
 

src/views/home.vue

@@ -137,6 +137,9 @@ h3.title
           color #eee
           font-weight 900
           text-transform uppercase
+      .view
+        overflow-y auto
+        height 100%
   >.mobile
     display flex
     justify-content center