add bckg image

IvettaGoIT · Sep 17, 2023 · e20531a · e20531a
1 parent 3ca832b
commit e20531a
Show file tree

Hide file tree

Showing 2 changed files with 22 additions and 9 deletions.
diff --git a/src/App.jsx b/src/App.jsx
@@ -4,22 +4,25 @@ import FirstPage from './pages/FirstPage/FirstPage';
 import SecondPage from './pages/SecondPage/SecondPage';
 import HalfPage from './pages/HalfPage/HalfPage';
 import ErrorPage from './pages/ErrorPage/ErrorPage';
+import { AppWrapper } from './App.styled';
 
 const test = import.meta.env.VITE_API_TEST;
 
 function App() {
   console.log(test);
   return (
-    <Routes>
-      <Route path="/" element={<SharedLayout />}>
-        <Route path="/first" element={<FirstPage />} />
-        <Route path="/second" element={<SecondPage />}>
-          <Route path=":half" element={<HalfPage />} />
-        </Route>
+    <AppWrapper>
+      <Routes>
+        <Route path="/" element={<SharedLayout />}>
+          <Route path="/first" element={<FirstPage />} />
+          <Route path="/second" element={<SecondPage />}>
+            <Route path=":half" element={<HalfPage />} />
+          </Route>
 
-        <Route path="*" element={<ErrorPage />} />
-      </Route>
-    </Routes>
+          <Route path="*" element={<ErrorPage />} />
+        </Route>
+      </Routes>
+    </AppWrapper>
   );
 }
 export default App;
diff --git a/src/App.styled.jsx b/src/App.styled.jsx
@@ -0,0 +1,10 @@
+import styled from '@emotion/styled';
+import example from './assets/example.png';
+
+export const AppWrapper = styled.div`
+  width: 100%;
+  height: 100vh;
+  background-image: url(${example});
+  background-repeat: no-repeat;
+  background-position: center bottom;
+`;