├── public ├── favicon.ico ├── manifest.json └── index.html ├── src ├── assets │ └── img │ │ ├── about.jpg │ │ ├── blog1.jpg │ │ ├── blog2.jpg │ │ ├── blog3.jpg │ │ ├── facts_bg.jpg │ │ └── home_bg.jpg ├── HOC │ └── Section.js ├── App.js ├── components │ ├── sections │ │ ├── Service │ │ │ ├── ServiceDetails │ │ │ │ └── ServiceDetails.js │ │ │ └── Service.js │ │ ├── Sections.js │ │ ├── MapMarker │ │ │ └── MapMarker.js │ │ ├── Home │ │ │ └── Home.js │ │ ├── Facts │ │ │ └── Facts.js │ │ ├── Contact │ │ │ └── Contact.js │ │ ├── About │ │ │ └── About.js │ │ └── Blog │ │ │ └── Blog.js │ ├── UI │ │ ├── Header │ │ │ └── Header.js │ │ ├── Link │ │ │ └── Link.js │ │ ├── TopBar │ │ │ └── TopBar.js │ │ ├── Nav │ │ │ └── Nav.js │ │ └── Footer │ │ │ └── Footer.js │ └── Layout │ │ └── Layout.js ├── App.test.js ├── scss │ ├── partials │ │ ├── _about.scss │ │ ├── _blog.scss │ │ ├── _services.scss │ │ ├── _facts.scss │ │ ├── _footer.scss │ │ ├── _home.scss │ │ └── _header.scss │ └── main.scss ├── index.css ├── index.js ├── App.css ├── logo.svg └── serviceWorker.js ├── .gitignore ├── README.md └── package.json /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/azouaoui-med/root-react-template/HEAD/public/favicon.ico -------------------------------------------------------------------------------- /src/assets/img/about.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/azouaoui-med/root-react-template/HEAD/src/assets/img/about.jpg -------------------------------------------------------------------------------- /src/assets/img/blog1.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/azouaoui-med/root-react-template/HEAD/src/assets/img/blog1.jpg -------------------------------------------------------------------------------- /src/assets/img/blog2.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/azouaoui-med/root-react-template/HEAD/src/assets/img/blog2.jpg -------------------------------------------------------------------------------- /src/assets/img/blog3.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/azouaoui-med/root-react-template/HEAD/src/assets/img/blog3.jpg -------------------------------------------------------------------------------- /src/assets/img/facts_bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/azouaoui-med/root-react-template/HEAD/src/assets/img/facts_bg.jpg -------------------------------------------------------------------------------- /src/assets/img/home_bg.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/azouaoui-med/root-react-template/HEAD/src/assets/img/home_bg.jpg -------------------------------------------------------------------------------- /src/HOC/Section.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const section = props => { 4 | return
{props.children}
; 5 | }; 6 | 7 | export default section; 8 | -------------------------------------------------------------------------------- /src/App.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | import Layout from './components/Layout/Layout'; 4 | 5 | function App() { 6 | return ; 7 | } 8 | 9 | export default App; 10 | -------------------------------------------------------------------------------- /src/components/sections/Service/ServiceDetails/ServiceDetails.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | const serviceDetails = () => { 4 | return
; 5 | }; 6 | 7 | export default serviceDetails; 8 | -------------------------------------------------------------------------------- /src/App.test.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | import ReactDOM from 'react-dom'; 3 | import App from './App'; 4 | 5 | it('renders without crashing', () => { 6 | const div = document.createElement('div'); 7 | ReactDOM.render(, div); 8 | ReactDOM.unmountComponentAtNode(div); 9 | }); 10 | -------------------------------------------------------------------------------- /src/scss/partials/_about.scss: -------------------------------------------------------------------------------- 1 | .aboutImage { 2 | width: 100%; 3 | max-height: 300px; 4 | overflow: hidden; 5 | img { 6 | width: 100%; 7 | object-fit: cover; 8 | object-position: center; 9 | } 10 | } 11 | .about-description { 12 | font-size: 0.9rem; 13 | color: #6f6f6f; 14 | } 15 | -------------------------------------------------------------------------------- /src/components/UI/Header/Header.js: -------------------------------------------------------------------------------- 1 | import React from 'react'; 2 | 3 | import Nav from '../Nav/Nav'; 4 | import TopBar from '../TopBar/TopBar'; 5 | 6 | const header = () => { 7 | return ( 8 |
9 | 10 |
12 | ); 13 | }; 14 | 15 | export default header; 16 | -------------------------------------------------------------------------------- /public/manifest.json: -------------------------------------------------------------------------------- 1 | { 2 | "short_name": "React App", 3 | "name": "Create React App Sample", 4 | "icons": [ 5 | { 6 | "src": "favicon.ico", 7 | "sizes": "64x64 32x32 24x24 16x16", 8 | "type": "image/x-icon" 9 | } 10 | ], 11 | "start_url": ".", 12 | "display": "standalone", 13 | "theme_color": "#000000", 14 | "background_color": "#ffffff" 15 | } 16 | -------------------------------------------------------------------------------- /src/scss/partials/_blog.scss: -------------------------------------------------------------------------------- 1 | #blog { 2 | .card { 3 | box-shadow: 0 10px 30px 0 rgba(50, 50, 50, 0.16); 4 | border: none; 5 | .card-title { 6 | font-size: 1rem; 7 | font-weight: bolder; 8 | color: #4e4e4e; 9 | text-transform: uppercase; 10 | } 11 | .card-text { 12 | font-size: 0.9rem; 13 | color: #6f6f6f; 14 | } 15 | } 16 | } 17 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # testing 9 | /coverage 10 | 11 | # production 12 | /build 13 | 14 | # misc 15 | .DS_Store 16 | .env.local 17 | .env.development.local 18 | .env.test.local 19 | .env.production.local 20 | 21 | npm-debug.log* 22 | yarn-debug.log* 23 | yarn-error.log* 24 | -------------------------------------------------------------------------------- /src/index.css: -------------------------------------------------------------------------------- 1 | body { 2 | margin: 0; 3 | font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", 4 | "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", 5 | sans-serif; 6 | -webkit-font-smoothing: antialiased; 7 | -moz-osx-font-smoothing: grayscale; 8 | } 9 | 10 | code { 11 | font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New", 12 | monospace; 13 | } 14 | -------------------------------------------------------------------------------- /src/components/Layout/Layout.js: -------------------------------------------------------------------------------- 1 | import React, { Fragment } from 'react'; 2 | 3 | import Header from '../UI/Header/Header'; 4 | import Footer from '../UI/Footer/Footer'; 5 | import Sections from '../sections/Sections'; 6 | 7 | const Layout = () => { 8 | return ( 9 | 10 |
11 |
12 | 13 |
14 |