Refactored container of components

Callhub-Connect · Oct 31, 2023 · 0ebdb48 · 0ebdb48
1 parent 13cf9da
commit 0ebdb48
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 14 deletions.
diff --git a/src/App.jsx b/src/App.jsx
@@ -9,22 +9,12 @@ const GlobalStyle = createGlobalStyle`
     font-family: 'League Spartan', sans-serif;
   }`
 
-const Container = styled.div`
-  background-image: linear-gradient(to bottom right, #0a8e3d, #9fdb3f);
-  background-size: contain;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  height: 100vh;
-`;
-
 function App() {
   return (
-    <Container>
+    <div>
       <GlobalStyle />
       <EnterCode />
-    </Container>
+    </div>
   );
 }
 

diff --git a/src/components/EndSession.jsx b/src/components/EndSession.jsx
@@ -1,11 +1,13 @@
 import styled from 'styled-components'
 
 const Container = styled.div`
-    height: 100vh;
+    background-image: linear-gradient(to bottom right, #0a8e3d, #9fdb3f);
+    background-size: contain;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
+    height: 100vh;
 `;
 
 const Logo = styled.img`

diff --git a/src/components/EnterCode.jsx b/src/components/EnterCode.jsx
@@ -1,11 +1,13 @@
 import styled from "styled-components";
 
 const Container = styled.div`
-    height: 100vh;
+    background-image: linear-gradient(to bottom right, #0a8e3d, #9fdb3f);
+    background-size: contain;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
+    height: 100vh;
 
     @media (max-width: 768px) {
         /* Add styles for smaller screens here */