diff --git a/src/components/App/App.jsx b/src/components/App/App.jsx index da409bb..9643cfe 100644 --- a/src/components/App/App.jsx +++ b/src/components/App/App.jsx @@ -1,34 +1,28 @@ -import Home from 'pages/Home'; -import { Container, Header, Logo, Link } from './App.styled'; import { Routes, Route } from 'react-router-dom'; import About from 'pages/About'; import Products from 'pages/Products'; import ProductDetails from 'pages/ProductDetails'; import NotFound from 'pages/NotFound'; +import Mission from 'pages/Mission'; +import Team from 'pages/Team'; +import Reviews from 'pages/Reviews'; +import Home from 'pages/Home'; +import Sharedlayout from 'components/SharedLayout/SharedLayout'; export const App = () => { return ( - -
- - - 💻 - {' '} - GoMerch Store - - -
- - } /> - } /> - } /> - } /> - } /> - -
+ + }> + } /> + }> + } /> + } /> + } /> + + } /> + } /> + } />; + + ); }; diff --git a/src/components/SharedLayout/SharedLayout.jsx b/src/components/SharedLayout/SharedLayout.jsx new file mode 100644 index 0000000..14fd792 --- /dev/null +++ b/src/components/SharedLayout/SharedLayout.jsx @@ -0,0 +1,25 @@ +import { Container, Header, Logo, Link } from 'components/App/App.styled'; +import { Outlet } from 'react-router-dom'; + +const Sharedlayout = () => { + return ( + +
+ + + 💻 + {' '} + GoMerch Store + + +
+ +
+ ); +}; + +export default Sharedlayout; diff --git a/src/index.css b/src/index.css index 6e8ef07..82075f7 100644 --- a/src/index.css +++ b/src/index.css @@ -8,3 +8,8 @@ img { max-width: 100%; height: auto; } + +li { + list-style: none; + text-decoration: none; +} diff --git a/src/index.js b/src/index.js index 1f74d69..97c9153 100644 --- a/src/index.js +++ b/src/index.js @@ -6,7 +6,7 @@ import { BrowserRouter } from 'react-router-dom'; ReactDOM.createRoot(document.getElementById('root')).render( - + diff --git a/src/pages/About.jsx b/src/pages/About.jsx index a7f4fb3..6002ec4 100644 --- a/src/pages/About.jsx +++ b/src/pages/About.jsx @@ -1,3 +1,5 @@ +import { Link, Outlet } from 'react-router-dom'; + const About = () => { return (
@@ -15,6 +17,18 @@ const About = () => { dolorum illum voluptatum dolores! Quas perferendis quis alias excepturi eaque voluptatibus eveniet error, nulla rem iusto?

+ +
); }; diff --git a/src/pages/Mission.jsx b/src/pages/Mission.jsx new file mode 100644 index 0000000..2defa73 --- /dev/null +++ b/src/pages/Mission.jsx @@ -0,0 +1,22 @@ +const Mission = () => { + return ( +
+

Our mission

+

+ Lorem ipsum dolor, sit amet consectetur adipisicing elit. Ut, nesciunt + veniam. Excepturi itaque, voluptates fugiat perspiciatis quo saepe! Iste + eaque porro eveniet error dicta, modi ipsum hic quis minima inventore. +

+

+ Lorem ipsum dolor sit amet consectetur adipisicing elit. Tempora quaerat + illum excepturi odit doloremque, vitae quasi corporis commodi nisi quae + perspiciatis amet consectetur reprehenderit inventore laborum facilis + quia mollitia exercitationem eaque rerum dignissimos maiores, quos iure + blanditiis. Dolorem, nam? Aliquid sequi molestias vel, tenetur maxime + pariatur? Molestiae libero cum quidem. +

+
+ ); +}; + +export default Mission; diff --git a/src/pages/Reviews.jsx b/src/pages/Reviews.jsx new file mode 100644 index 0000000..4cc79f9 --- /dev/null +++ b/src/pages/Reviews.jsx @@ -0,0 +1,25 @@ +const Reviews = () => { + return ( +
+
+

First review - 4.6/5

+

+ Lorem, ipsum dolor sit amet consectetur adipisicing elit. Autem harum + architecto sapiente corporis, voluptatem quas voluptatibus fugiat + nulla commodi quidem, dolorem distinctio inventore blanditiis illo + tenetur aut enim ex laborum! +

+
+
+

Second review - 4.8/5

+

+ Lorem ipsum dolor sit amet consectetur adipisicing elit. Corrupti + nihil ea, eaque fugit amet possimus officiis asperiores aperiam facere + et? +

+
+
+ ); +}; + +export default Reviews; diff --git a/src/pages/Team.jsx b/src/pages/Team.jsx new file mode 100644 index 0000000..f7fb6c8 --- /dev/null +++ b/src/pages/Team.jsx @@ -0,0 +1,25 @@ +const Team = () => { + return ( +
+ +
+ ); +}; + +export default Team;