diff --git a/src/App.js b/src/App.js
index 9681342..f5277d9 100644
--- a/src/App.js
+++ b/src/App.js
@@ -3,6 +3,7 @@ import { ToastProvider } from 'react-toast-notifications';
import Header from './Components/Header';
import Footer from './Components/Footer';
import GasStation from "./Components/GasStation";
+import About from "./Components/About";
import Map from "./Components/Map";
import 'mapbox-gl/dist/mapbox-gl.css';
@@ -15,6 +16,7 @@ class Application extends React.Component {
this.state = {
showModal: false,
+ showAboutModal: false,
selectedGasStation: {},
selectedGasType: 'E85',
needUpdateUserLocation: false
@@ -78,6 +80,12 @@ class Application extends React.Component {
})
}
+ toggleAboutModal = () => {
+ this.setState(prevState => ({
+ showAboutModal: !prevState.showAboutModal
+ }));
+ }
+
/**
* Méthode gérant le rendu de la vue
*/
@@ -85,6 +93,7 @@ class Application extends React.Component {
const {
selectedGasType,
showModal,
+ showAboutModal,
selectedGasStation,
userLocation,
needUpdateUserLocation,
@@ -92,13 +101,17 @@ class Application extends React.Component {
return (
-
+
+
diff --git a/src/Components/About.js b/src/Components/About.js
new file mode 100644
index 0000000..bae884d
--- /dev/null
+++ b/src/Components/About.js
@@ -0,0 +1,55 @@
+import React from 'react';
+import { Modal } from "react-bootstrap";
+import PropTypes from 'prop-types';
+
+const About = (props) => {
+ const {
+ toggleAboutModal,
+ showModal
+ } = props;
+
+ return (
+ {toggleAboutModal(false)}}
+ >
+
+ À propos
+
+
+ Prix carburant
+ {' '}
+ est une simple application ayant pour objectif d'afficher facilement sur smartphone l'ensemble des stations services à proximité.
+
+ Ce service est entièrement gratuit et libre.
+
+ La liste des stations est issue des
+ {' '}
+ Open Data
+ {' '}
+ fournies par le gouvernement.
+
+ L'application est développée et maintenue par
+ {' '}
+ Damien Broqua
+ .
+
+ Le code source de l'application est librement téléchargeable sur
+ {' '}
+ framagit
+ .
+
+
+ );
+
+};
+
+About.propTypes = {
+ toggleAboutModal: PropTypes.func.isRequired,
+ showModal: PropTypes.bool.isRequired
+};
+
+export default About;
\ No newline at end of file
diff --git a/src/Components/Header.js b/src/Components/Header.js
index 63af78f..fecf3ac 100644
--- a/src/Components/Header.js
+++ b/src/Components/Header.js
@@ -1,7 +1,11 @@
import React from 'react';
import { Navbar, Nav } from "react-bootstrap";
+import PropTypes from 'prop-types';
-const Header = () => {
+const Header = (props) => {
+ const {
+ toggleAboutModal,
+ } = props;
return (
@@ -14,11 +18,19 @@ const Header = () => {
alt="DarKou.fr"
/>
-
+
+
+
+
);
};
+Header.propTypes = {
+ toggleAboutModal: PropTypes.func.isRequired,
+};
+
export default Header;
\ No newline at end of file