diff --git a/src/App.tsx b/src/App.tsx
index 7fde6c1..ac48aa7 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -34,6 +34,8 @@ import { MapScope } from './components/map/types';
import { debounce } from 'lodash';
import GetLocation from './components/buttons/GetLocation';
import { geoPoint } from './components/map/types';
+import Back from './components/buttons/Back';
+import Forward from './components/buttons/Forward';
setupIonicReact();
@@ -73,7 +75,10 @@ const App: React.FC = () => {
-
+
+
+
+
diff --git a/src/components/buttons/Back.tsx b/src/components/buttons/Back.tsx
new file mode 100644
index 0000000..0d8cf03
--- /dev/null
+++ b/src/components/buttons/Back.tsx
@@ -0,0 +1,26 @@
+import react from 'react';
+import { IonButton, IonIcon } from '@ionic/react';
+import { arrowBackCircleOutline } from 'ionicons/icons';
+import './BackForward.css';
+
+export interface BackProperties {}
+
+export const Back: react.FC = (props: BackProperties) => {
+ const onClickHandler = (event: any) => {
+ window.history.back();
+ };
+
+ return (
+
+
+
+ );
+};
+
+export default Back;
diff --git a/src/components/buttons/BackForward.css b/src/components/buttons/BackForward.css
new file mode 100644
index 0000000..045043c
--- /dev/null
+++ b/src/components/buttons/BackForward.css
@@ -0,0 +1,5 @@
+ion-button.back-forward {
+ --opacity: 0.6;
+ --ion-background-color: white;
+ --ionicon-stroke-width: 48px;
+}
diff --git a/src/components/buttons/Forward.tsx b/src/components/buttons/Forward.tsx
new file mode 100644
index 0000000..ea4f453
--- /dev/null
+++ b/src/components/buttons/Forward.tsx
@@ -0,0 +1,26 @@
+import react from 'react';
+import { IonButton, IonIcon } from '@ionic/react';
+import { arrowForwardCircleOutline } from 'ionicons/icons';
+import './BackForward.css';
+
+export interface ForwardProperties {}
+
+export const Forward: react.FC = (props: ForwardProperties) => {
+ const onClickHandler = (event: any) => {
+ window.history.forward();
+ };
+
+ return (
+
+
+
+ );
+};
+
+export default Forward;