Fixed horizontal overflow due to box-sizing bug

VandyHacks · Mar 7, 2021 · 3e50070 · 3e50070
1 parent 3e067c6
commit 3e50070
Show file tree

Hide file tree

Showing 3 changed files with 2 additions and 4 deletions.
diff --git a/global.css b/global.css
@@ -5,7 +5,6 @@ main {
   padding: 0;
   width: 100vw;
   height: 100vh;
-  background-size: 135vh;
 }
 
 body {
@@ -27,7 +26,6 @@ body {
 /* Use a media query to scale the background image */
 @media only screen and (max-width: 600px) {
   body {
-    background-size: 173vw;
     background-position: 0% 50%;
   }
 }

diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import { styled, css} from "astroturf";
+import styled from "astroturf";
 import Facebook from "../assets/icons/facebook.svg";
 import Github from "../assets/icons/github.svg";
 import Instagram from "../assets/icons/instagram.svg";
@@ -8,7 +8,6 @@ import Twitter from "../assets/icons/twitter.svg";
 import Youtube from "../assets/icons/youtube.svg";
 
 const FooterContainer = styled.footer`
-  width: 100%;
   color: #ffffff;
   left: 0;
   bottom: 2vh;

diff --git a/src/components/PageLinks.tsx b/src/components/PageLinks.tsx
@@ -10,6 +10,7 @@ const Container = styled("div")`
   z-index: 2;
   display: grid;
   color: #ffffff;
+  box-sizing: border-box;
   padding: 3vh 2.5vw;
   backdrop-filter: blur(6px);
   -moz-box-shadow: 1px 2px 3px rgba(0,0,0,.5);