Game Layout: 16:9 1 Player (2 Cameras)

src/graphics/game-layout/16x9-1p-2cams.vue

@@ -0,0 +1,121 @@
+<template>
+  <div>
+    <!-- Game Captures -->
+    <game-capture
+      id="GameCapture1"
+      class="BorderLeft BorderBottom"
+      :style="{
+        left: '533px',
+        top: '0px',
+        width: '1387px',
+        height: '780px',
+      }"
+    />
+
+    <!-- Camera Captures -->
+    <div
+      id="CameraCapture1"
+      class="Capture"
+      :style="{
+        left: '0px',
+        top: '0px',
+        width: '533px',
+        height: '325px',
+      }"
+    />
+    <div
+      id="CameraCapture2"
+      class="Capture BorderTop"
+      :style="{
+        left: '0px',
+        top: '325px',
+        width: '533px',
+        height: '325px',
+      }"
+    />
+
+    <!-- Run Game Info/Timer -->
+    <div
+      class="Fixed Flex"
+      :style="{
+        left: '533px',
+        top: '780px',
+        width: '1387px',
+        height: '160px',
+      }"
+    >
+      <run-info
+        class="BorderLeft"
+        :style="{
+          'font-size': '45px',
+          'width': '1000px',
+          height: '100%',
+        }"
+      />
+      <timer
+        class="BorderLeft"
+        :style="{
+          'width': '387px',
+          height: '100%',
+        }"
+      />
+    </div>
+
+    <!-- Player/Commetator -->
+    <div
+      class="Fixed"
+      :style="{
+        left: '0px',
+        top: '650px',
+        width: '533px',
+      }"
+    >
+      <player />
+      <comm-and-reader />
+    </div>
+
+    <!-- Media Box -->
+    <media-box
+      :style="{
+        left: '0px',
+        top: '740px',
+        width: '533px',
+        height: '200px',
+      }"
+    />
+
+    <!-- Donation Bar -->
+    <donation-bar
+      :style="{
+        left: '0px',
+        top: '940px',
+        width: '1920px',
+        height: '60px',
+      }"
+    />
+  </div>
+</template>
+
+<script lang="ts">
+import { Vue, Component } from 'vue-property-decorator';
+import GameCapture from './components/GameCapture.vue';
+import Player from './components/Player.vue';
+import CommAndReader from './components/CommAndReader.vue';
+import RunInfo from './components/RunInfo.vue';
+import Timer from './components/Timer.vue';
+import MediaBox from '../_misc/components/MediaBox.vue';
+import DonationBar from './components/DonationBar.vue';
+
+@Component({
+  components: {
+    GameCapture,
+    Player,
+    CommAndReader,
+    RunInfo,
+    Timer,
+    MediaBox,
+    DonationBar,
+  },
+})
+export default class extends Vue {}
+</script>

src/graphics/game-layout/16x9-1p-largecam.vue

@@ -13,8 +13,9 @@
     />
 
     <!-- Camera Captures -->
-    <game-capture
+    <div
       id="CameraCapture1"
+      class="Capture"
       :style="{
         left: '0px',
         top: '0px',

src/graphics/game-layout/list.ts

@@ -2,6 +2,7 @@
 /* eslint-disable max-len */
 /* eslint-disable @typescript-eslint/camelcase */
 
+import L_16x9_1p_2Cams from './16x9-1p-2cams.vue';
 import L_16x9_1p_LargeCam from './16x9-1p-largecam.vue';
 import L_16x9_1p from './16x9-1p.vue';
 import L_16x9_2p from './16x9-2p.vue';
@@ -15,5 +16,5 @@ import L_DS_1p from './ds-1p.vue';
 import L_GB_1p from './gb-1p.vue';
 import L_GBA_1p from './gba-1p.vue';
 
-export { L_4x3_1p, L_4x3_2p, L_4x3_3p, L_4x3_4p, L_16x9_1p, L_16x9_2p, L_16x9_3p, L_3DS_1p, L_DS_1p, L_GB_1p, L_GBA_1p, L_16x9_1p_LargeCam };
+export { L_4x3_1p, L_4x3_2p, L_4x3_3p, L_4x3_4p, L_16x9_1p, L_16x9_2p, L_16x9_3p, L_3DS_1p, L_DS_1p, L_GB_1p, L_GBA_1p, L_16x9_1p_LargeCam, L_16x9_1p_2Cams };
 export const defaultCode = '4x3-1p';

src/graphics/game-layout/main.ts

@@ -43,6 +43,11 @@ const routes = [
     path: '/16x9-1p-largecam',
     component: List.L_16x9_1p_LargeCam,
   },
+  {
+    name: '16:9 1 Player (2 Cameras)',
+    path: '/16x9-1p-2cams',
+    component: List.L_16x9_1p_2Cams,
+  },
   {
     name: '16:9 2 Player',
     path: '/16x9-2p',