Merge branch 'dev' of github.com:ivozilkenat/hackhpi24 into dev

.gitignore

@@ -1,6 +1,10 @@
 #####################
 # Python
 #####################
+# testing
+output.json
+outputlines.json
+
 # Byte-compiled / optimized / DLL files
 __pycache__/
 *.py[cod]

client/src/App.js

@@ -1,6 +1,7 @@
 import React, { useState, useEffect } from "react";
 import Axios from "axios";
 import MapComponent from './components/RealtimeMap';
+import Title from './components/Title';
 
 function App() {
   const [products, setProducts] = useState([]);
@@ -22,6 +23,7 @@ function App() {
 
   return (
     <div className="App">
+      <Title />
       <MapComponent />
     </div>
   );

client/src/components/RealtimeMap.js

@@ -1,27 +1,28 @@
 import React, { useEffect } from 'react';
 import L from 'leaflet';
+import './../../node_modules/leaflet/dist/leaflet.css'
 import 'leaflet-realtime';
 import { MapContainer, TileLayer, useMap } from 'react-leaflet';
 
 function RealtimeMap() {
   const map = useMap();
 
-  useEffect(() => {
-    L.realtime({
-      url: 'https://wanderdrone.appspot.com/',
-      crossOrigin: true,
-      type: 'json'
-    }, {
-      interval: 3 * 1000
-    }).addTo(map);
-  }, [map]);
+  // useEffect(() => {
+  //   L.realtime({
+  //     url: 'https://wanderdrone.appspot.com/',
+  //     crossOrigin: true,
+  //     type: 'json'
+  //   }, {
+  //     interval: 3 * 1000
+  //   }).addTo(map);
+  // }, [map]);
 
   return null;
 }
 
 function MapComponent() {
   return (
-    <MapContainer center={[0, 0]} zoom={13}>
+      <MapContainer center={[0, 0]} zoom={13} style={{ height: "400px", marginTop: "80px", marginBottom: "90px" }} >
       <TileLayer url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" />
       <RealtimeMap />
     </MapContainer>

client/src/components/Title.js

@@ -0,0 +1,13 @@
+import React from 'react'
+import './css/Title.css';
+
+function Title() {
+    return (
+        <div className="Title">
+          <h1>SFPOPOS</h1>
+                <div className="Title-Subtitle">San Franciscos Privately Owned Public Spaces</div>
+        </div>
+    )
+}
+
+export default Title

client/src/components/css/Title.css

@@ -0,0 +1,11 @@
+.Title {
+    box-sizing: border-box;
+    width: 100%;
+    display: flex;
+    justify-content: center;
+    align-items: baseline;
+    padding: 1em;
+    margin-bottom: 2em;
+    background-color: rgb(192, 45, 26);
+    color: #fff;
+  }

client/src/index.css

@@ -5,9 +5,12 @@ body {
     sans-serif;
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
+  background-color: #A0AECD;
+  color: #000000;
 }
 
 code {
   font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
     monospace;
 }
+