2022-08-31 13:30:20 +00:00
|
|
|
import { IonApp, setupIonicReact } from '@ionic/react';
|
2022-08-31 12:35:20 +00:00
|
|
|
|
|
|
|
/* Core CSS required for Ionic components to work properly */
|
|
|
|
import '@ionic/react/css/core.css';
|
|
|
|
|
|
|
|
/* Basic CSS for apps built with Ionic */
|
|
|
|
import '@ionic/react/css/normalize.css';
|
|
|
|
import '@ionic/react/css/structure.css';
|
|
|
|
import '@ionic/react/css/typography.css';
|
|
|
|
|
|
|
|
/* Optional CSS utils that can be commented out */
|
|
|
|
import '@ionic/react/css/padding.css';
|
|
|
|
import '@ionic/react/css/float-elements.css';
|
|
|
|
import '@ionic/react/css/text-alignment.css';
|
|
|
|
import '@ionic/react/css/text-transformation.css';
|
|
|
|
import '@ionic/react/css/flex-utils.css';
|
|
|
|
import '@ionic/react/css/display.css';
|
|
|
|
|
|
|
|
/* Theme variables */
|
|
|
|
import './theme/variables.css';
|
|
|
|
|
2022-08-31 20:03:27 +00:00
|
|
|
/* Leaflet */
|
|
|
|
import './theme/leaflet.css';
|
|
|
|
|
|
|
|
/* Other imports */
|
|
|
|
|
|
|
|
import {MapContainer, TileLayer, Marker, Popup} from 'react-leaflet' ;
|
|
|
|
|
2022-08-31 12:35:20 +00:00
|
|
|
setupIonicReact();
|
|
|
|
|
2022-08-31 20:03:27 +00:00
|
|
|
const position: [number, number] = [51.505, -0.09];
|
|
|
|
|
2022-08-31 12:35:20 +00:00
|
|
|
const App: React.FC = () => (
|
|
|
|
<IonApp>
|
2022-08-31 20:03:27 +00:00
|
|
|
<MapContainer center={position} zoom={13} scrollWheelZoom={false}>
|
|
|
|
<TileLayer
|
|
|
|
attribution='{"© <a href="https://www.openstreetmap.org/copyright">OpenStreetMap</a> contributors"}'
|
|
|
|
url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png"
|
|
|
|
/>
|
|
|
|
<Marker position={position}>
|
|
|
|
<Popup>
|
|
|
|
A pretty CSS3 popup. <br /> Easily customizable.
|
|
|
|
</Popup>
|
|
|
|
</Marker>
|
|
|
|
</MapContainer>
|
2022-08-31 12:35:20 +00:00
|
|
|
</IonApp>
|
|
|
|
);
|
|
|
|
|
|
|
|
export default App;
|