From f1fbe8e3ee371e3a60bbeb55ee36a4bb0f5cc925 Mon Sep 17 00:00:00 2001 From: Yoan VALLET <ext.sopra.yvallet@grandlyon.com> Date: Thu, 22 Jul 2021 16:37:27 +0200 Subject: [PATCH] feat: init Layout and main component without style --- src/App.tsx | 9 ++++--- src/assets/icons/logo.png | Bin 0 -> 7500 bytes src/components/Editing/Editing.tsx | 7 ++++++ src/components/Layout/Layout.tsx | 22 +++++++++++++++++ src/components/Layout/layout.module.scss | 14 +++++++++++ src/components/Menu/Menu.tsx | 22 +++++++++++++++++ src/components/Navbar/Navbar.tsx | 29 +++++++++++++++++++++++ src/components/Routes/Routes.tsx | 10 ++++---- src/components/Settings/Settings.tsx | 7 ++++++ src/components/dummy/Dummy.tsx | 15 ------------ src/components/dummy/Dummy2.tsx | 15 ------------ src/components/dummy/dummy.module.scss | 6 ----- src/components/dummy/dummy2.module.scss | 6 ----- src/constants/routes.json | 10 ++++++++ src/styles/index.scss | 6 +++++ 15 files changed, 128 insertions(+), 50 deletions(-) create mode 100644 src/assets/icons/logo.png create mode 100644 src/components/Editing/Editing.tsx create mode 100644 src/components/Layout/Layout.tsx create mode 100644 src/components/Layout/layout.module.scss create mode 100644 src/components/Menu/Menu.tsx create mode 100644 src/components/Navbar/Navbar.tsx create mode 100644 src/components/Settings/Settings.tsx delete mode 100644 src/components/dummy/Dummy.tsx delete mode 100644 src/components/dummy/Dummy2.tsx delete mode 100644 src/components/dummy/dummy.module.scss delete mode 100644 src/components/dummy/dummy2.module.scss create mode 100644 src/constants/routes.json diff --git a/src/App.tsx b/src/App.tsx index e0306a89..ed7869cc 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -1,12 +1,15 @@ import React from 'react' import { BrowserRouter } from 'react-router-dom' +import Layout from './components/Layout/Layout' import Routes from './components/Routes/Routes' function App() { return ( - <BrowserRouter> - <Routes /> - </BrowserRouter> + <Layout> + <BrowserRouter> + <Routes /> + </BrowserRouter> + </Layout> ) } diff --git a/src/assets/icons/logo.png b/src/assets/icons/logo.png new file mode 100644 index 0000000000000000000000000000000000000000..6e9f08491e80c9b5b19817c83ab15140f032525a GIT binary patch literal 7500 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 WSUH!awdURc0000<MNUMnLSTa5-vFBc literal 0 HcmV?d00001 diff --git a/src/components/Editing/Editing.tsx b/src/components/Editing/Editing.tsx new file mode 100644 index 00000000..866a2515 --- /dev/null +++ b/src/components/Editing/Editing.tsx @@ -0,0 +1,7 @@ +import React from 'react' + +const Editing: React.FC = () => { + return <div>Coming soon !</div> +} + +export default Editing diff --git a/src/components/Layout/Layout.tsx b/src/components/Layout/Layout.tsx new file mode 100644 index 00000000..72e3772c --- /dev/null +++ b/src/components/Layout/Layout.tsx @@ -0,0 +1,22 @@ +import React from 'react' +import styles from './layout.module.scss' +import Menu from '../Menu/Menu' +import Navbar from '../Navbar/Navbar' + +interface LayoutProps { + children: React.ReactNode +} + +const Layout: React.FC<LayoutProps> = ({ children }: LayoutProps) => { + return ( + <div className={styles.root}> + <Navbar /> + <div className={styles.wrapper}> + <Menu /> + <main>{children}</main> + </div> + </div> + ) +} + +export default Layout diff --git a/src/components/Layout/layout.module.scss b/src/components/Layout/layout.module.scss new file mode 100644 index 00000000..3f0e2345 --- /dev/null +++ b/src/components/Layout/layout.module.scss @@ -0,0 +1,14 @@ +.root { + display: flex; + flex-direction: column; + min-height: 100vh; +} + +.wrapper { + display: flex; + flex-direction: row; + flex: 1; + main { + flex: 1; + } +} diff --git a/src/components/Menu/Menu.tsx b/src/components/Menu/Menu.tsx new file mode 100644 index 00000000..1013998c --- /dev/null +++ b/src/components/Menu/Menu.tsx @@ -0,0 +1,22 @@ +import React from 'react' +import routes from '../../constants/routes.json' + +const Menu: React.FC = () => { + // TODO class is-active if link is activated + + return ( + <aside className="menu"> + <ul className="menu-list"> + {routes.map((route: any, index: number) => { + return ( + <li key={index}> + <a href={route.path}>{route.label}</a> + </li> + ) + })} + </ul> + </aside> + ) +} + +export default Menu diff --git a/src/components/Navbar/Navbar.tsx b/src/components/Navbar/Navbar.tsx new file mode 100644 index 00000000..d57154af --- /dev/null +++ b/src/components/Navbar/Navbar.tsx @@ -0,0 +1,29 @@ +import React from 'react' +import logo from '../../assets/icons/logo.png' + +const Navbar: React.FC = () => { + return ( + <nav className="navbar" role="navigation" aria-label="main navigation"> + <div className="navbar-brand"> + <img src={logo} alt="Ecolyo logo" /> + <div className="navbar-menu"> + <div className="navbar-start"></div> + <div className="navbar-end"> + <div className="navbar-item"> + <div className="buttons"> + <a href="/" className="button is-primary"> + <strong>Sign up</strong> + </a> + <a href="/" className="button is-light"> + Log in + </a> + </div> + </div> + </div> + </div> + </div> + </nav> + ) +} + +export default Navbar diff --git a/src/components/Routes/Routes.tsx b/src/components/Routes/Routes.tsx index 21ba5f88..99bb4c66 100644 --- a/src/components/Routes/Routes.tsx +++ b/src/components/Routes/Routes.tsx @@ -1,14 +1,14 @@ import React from 'react' import { Redirect, Route, Switch } from 'react-router-dom' -import Dummy from '../dummy/Dummy' -import Dummy2 from '../dummy/Dummy2' +import Editing from '../Editing/Editing' +import Settings from '../Settings/Settings' const Routes: React.FC = () => { return ( <Switch> - <Route path="/dummy" component={Dummy} /> - <Route path="/dummy2" component={Dummy2} /> - <Redirect path="*" to="/dummy" /> + <Route path="/editing" component={Editing} /> + <Route path="/settings" component={Settings} /> + <Redirect path="*" to="/editing" /> </Switch> ) } diff --git a/src/components/Settings/Settings.tsx b/src/components/Settings/Settings.tsx new file mode 100644 index 00000000..30cfca08 --- /dev/null +++ b/src/components/Settings/Settings.tsx @@ -0,0 +1,7 @@ +import React from 'react' + +const Settings: React.FC = () => { + return <div>A venir</div> +} + +export default Settings diff --git a/src/components/dummy/Dummy.tsx b/src/components/dummy/Dummy.tsx deleted file mode 100644 index e5a7480c..00000000 --- a/src/components/dummy/Dummy.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import React from 'react' -import styles from './dummy.module.scss' - -const Dummy: React.FC = () => { - return ( - <div className={styles.root}> - <section> - <article>It is a dummy article</article> - <article>It is a second dummy article</article> - </section> - </div> - ) -} - -export default Dummy diff --git a/src/components/dummy/Dummy2.tsx b/src/components/dummy/Dummy2.tsx deleted file mode 100644 index c8df1362..00000000 --- a/src/components/dummy/Dummy2.tsx +++ /dev/null @@ -1,15 +0,0 @@ -import React from 'react' -import styles from './dummy2.module.scss' - -const Dummy2: React.FC = () => { - return ( - <div className={styles.root}> - <section> - <article>It is a dummy article</article> - <article>It is a second dummy article</article> - </section> - </div> - ) -} - -export default Dummy2 diff --git a/src/components/dummy/dummy.module.scss b/src/components/dummy/dummy.module.scss deleted file mode 100644 index fa413ce0..00000000 --- a/src/components/dummy/dummy.module.scss +++ /dev/null @@ -1,6 +0,0 @@ -.root { - display: flex; - section { - color: aqua; - } -} diff --git a/src/components/dummy/dummy2.module.scss b/src/components/dummy/dummy2.module.scss deleted file mode 100644 index f718c348..00000000 --- a/src/components/dummy/dummy2.module.scss +++ /dev/null @@ -1,6 +0,0 @@ -.root { - display: flex; - section { - color: yellow; - } -} diff --git a/src/constants/routes.json b/src/constants/routes.json new file mode 100644 index 00000000..21414496 --- /dev/null +++ b/src/constants/routes.json @@ -0,0 +1,10 @@ +[ + { + "label": "Edition", + "path": "/editing" + }, + { + "label": "Paramètres", + "path": "/settings" + } +] diff --git a/src/styles/index.scss b/src/styles/index.scss index 8740006a..69bb90e0 100644 --- a/src/styles/index.scss +++ b/src/styles/index.scss @@ -4,3 +4,9 @@ // To customize bulma variables, we set them before importing bulma @import 'bulma/bulma.sass'; + +* { + margin: 0; + padding: 0; + box-sizing: border-box; +} -- GitLab