From 97741f0d390f3ea6971d40a4047de91a76eb3244 Mon Sep 17 00:00:00 2001
From: Derp <98662895+Derpspace1@users.noreply.github.com>
Date: Fri, 4 Mar 2022 21:33:49 -0600
Subject: [PATCH] Update 4_3-2p.vue to fix missalignments

-Makes the game feed for both players 959x719 so its closer to 4:3
-Makes both sides of the board the same size
-Aligns the board to the center
-Fixes the boarder not showing up on 1920x1080 on the right and bottom

I've only been able to test this in firefox with the replaced css file but it should look like this: https://imgur.com/a/AqW5Cfi
---
 src/graphics/game-layout/4_3-2p.vue | 30 ++++++++++++++---------------
 1 file changed, 15 insertions(+), 15 deletions(-)

diff --git a/src/graphics/game-layout/4_3-2p.vue b/src/graphics/game-layout/4_3-2p.vue
index 3a11ac5..bf13783 100644
--- a/src/graphics/game-layout/4_3-2p.vue
+++ b/src/graphics/game-layout/4_3-2p.vue
@@ -79,27 +79,27 @@ export default class GameLayout extends Vue {
 
 #pi1 {
     position: absolute;
-    top: 720px;
+    top: 719px;
     left: 0px;
     border: 2px var(--container-border-color) solid;
-    width: 715px;
+    width: 713px;
 }
 
 #pi2 {
     position: absolute;
-    top: 720px;
+    top: 719px;
     left: 1190px;
     border: 2px var(--container-border-color) solid;
-    width: 715px;
+    width: 712px;
 }
 
 #Bingo-board {
     position: absolute;
-    top: 720px;
-    left: 730px;
+    top: 719px;
+    left: 728px;
     border: 2px var(--container-border-color) solid;
     width: 460px;
-    height: 360px;
+    height: 357px;
 }
 
 #game {
@@ -107,16 +107,16 @@ export default class GameLayout extends Vue {
     background-size: cover;
     background-repeat: no-repeat;
     position: absolute;
-    top: 780px;
+    top: 779px;
     left: 0px;
-    width: 730px;
+    width: 727px;
     border: 2px var(--container-border-color) solid;
-    height: 300px;
+    height: 297px;
 }
 
 #gamec {
     position: absolute;
-    top: 100px;
+    top: 180px;
     left: 0px;
     width: 730px;
 }
@@ -138,10 +138,10 @@ export default class GameLayout extends Vue {
 
 #timer-and-discord-container {
     position: absolute;
-    left: 1190px;
-    top: 780px;
-    width: 730px;
-    height: 300px;
+    left: 1189px;
+    top: 779px;
+    width: 727px;
+    height: 297px;
     border: 2px var(--container-border-color) solid;
     background-image: url("../../../static/middle-info-background.png");
     background-size: cover;