feat: improved camera view and sounds view

client/src/views/SoundBoard.vue

@@ -1,7 +1,9 @@
 <template>
-  <div class="sounds">
-    <div :key="`sound-${sound.name}`" class="sound" v-for="sound in sounds">
-      <h2 @click="emitSound(sound.name)">{{ sound.name }}</h2>
+  <div>
+    <div id="sound-list">
+      <div :key="`sound-${sound.name}`" class="sound" v-for="sound in sounds">
+        <h2 @click="emitSound(sound.name)">{{ sound.title }}</h2>
+      </div>
     </div>
   </div>
 </template>
@@ -11,8 +13,7 @@ import axios from 'axios';
 
 export default {
   name: 'SoundBoard',
-  components: {
-  },
+  components: {},
   data() {
     return {
       sounds: [],
@@ -32,4 +33,14 @@ export default {
 };
 </script>
 
-<style lang="scss" scoped></style>
+<style lang="scss" scoped>
+#sound-list {
+  display: grid;
+  grid-template-columns: 33% 33% 33%;
+}
+
+.sound {
+  background: lightblue;
+  border: 1px solid black;
+}
+</style>