Merge remote-tracking branch 'origin/development' into development

oSoc18 · Jul 24, 2018 · 8401f1b · 8401f1b
2 parents 5df5854 + 995c7c0
commit 8401f1b
Show file tree

Hide file tree

Showing 11 changed files with 57 additions and 32 deletions.
diff --git a/public/favicon-16x16.png b/public/favicon-16x16.png
diff --git a/public/index.html b/public/index.html
@@ -1,6 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
   <head>
+    <title>AccessFlanders</title>
     <meta charset="utf-8">
     <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
     <meta name="theme-color" content="#000000">
@@ -9,7 +10,7 @@
       homescreen on Android. See https://developers.google.com/web/fundamentals/engage-and-retain/web-app-manifest/
     -->
     <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
-    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
+    <link rel="icon" type="image/png" href="/favicon-16x16.png">
     <!--
       Notice the use of %PUBLIC_URL% in the tags above.
       It will be replaced with the URL of the `public` folder during the build.
@@ -19,8 +20,6 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-
-    <title>React App</title>
   </head>
   <body>
 

diff --git a/src/components/Header.jsx b/src/components/Header.jsx
@@ -122,7 +122,7 @@ export default class Header extends Component {
                 <Row className="search__bar">
                     <Col l={3} m={6} href="#" className="brand">
                         <img className="brand__icon" src={require('../images/logo-oasis.svg')} alt="OASIS"></img>
-                        <h1 className="brand__name">OASIS</h1>
+                        <h1 className="brand__name">Access Flanders</h1>
                     </Col>
                     <Col s={6} className="search">
                         <div className="input-field">
@@ -133,6 +133,12 @@ export default class Header extends Component {
                             <i className="material-icons" onClick={this.resetSearch}>close</i>
                         </div>
                     </Col>
+                    <Col>
+                        <a href="https://github.com/oSoc18/OASIS" target="_blank">
+                        <img  alt="github icon" title="github" className="social__media__icon" src={require('../images/github_otocat.png')} alt="github">
+                        </img>
+                        </a>
+                    </Col>
                 </Row>
                 <Row className="search__filters">
                     <Col s={9} offset="s0 m6 l3">

diff --git a/src/components/SidebarBuildingDetail.jsx b/src/components/SidebarBuildingDetail.jsx
@@ -61,7 +61,7 @@ export default class SidebarBuildingDetail extends Component {
                 <Col>
                     <h2>{this.Building.title}</h2>
                 </Col>
-                <Col>
+                <Col s={12}>
                     <p>{this.Building.description}</p>
                 </Col>
                 <Col s={12}>

diff --git a/src/components/SidebarSearchResult.jsx b/src/components/SidebarSearchResult.jsx
@@ -1,5 +1,5 @@
 import React from 'react'
-import {Col, Row} from "react-materialize";
+import {Card, Col, Row} from "react-materialize";
 import {inject, observer} from 'mobx-react';
 
 
@@ -36,6 +36,7 @@ export default class SidebarSearchResult extends React.Component {
 
     render() {
         return (
+            <Card>
             <Row>
                 <Col m={12} s={12}>
                     <hr />
@@ -52,6 +53,7 @@ export default class SidebarSearchResult extends React.Component {
                 </Col>
                 <a className="col m12 s12 center" href="#" onClick={this.handleClick} id={this.Building.id}>Meer details...</a>
             </Row>
+            </Card>
         )
     }
 }
diff --git a/src/css/App.scss b/src/css/App.scss
@@ -1,5 +1,5 @@
 
-$colorPrimary: #2ed3c8;
+$colorPrimary: #27b59f;
 $colorPrimaryLight: lighten($colorPrimary,20%);
 $colorPrimaryDark: #026863;
 

diff --git a/src/css/Header.scss b/src/css/Header.scss
@@ -27,6 +27,13 @@ $filterBarBackground: white;
     float: left;
   }
 
+  .social__media__icon{
+    height: 32px;
+    float: right;
+    position: absolute;
+    right: 0px;
+  }
+
   .brand__name {
     height: 100%;
     display: inline-block;
@@ -36,6 +43,11 @@ $filterBarBackground: white;
     float: left;
   }
 
+  ::placeholder {
+    color: $colorPrimaryDark;
+    opacity: 1; /* Firefox */
+  }
+
   div.search {
     display: block;
     height: $headerBarPrimaryHeight - 2* $headerBarPadding;
@@ -49,6 +61,7 @@ $filterBarBackground: white;
   }
 }
 
+
 .header .search__filters {
   height: $headerBarFilterHeight;
   margin-bottom: 0;
@@ -89,7 +102,7 @@ $filterBarBackground: white;
         margin-top: ($headerBarFilterHeight - 3 * $headerBarPadding - 18px)/2;
         padding: $headerBarPadding / 2;
         line-height: 18px;
-        font-size: 14px;
+        font-size: 20px;
         border-radius: 4px;
         color: $filterBarForeground;
         border: 1px solid $filterBarForeground;

diff --git a/src/css/Map.scss b/src/css/Map.scss
@@ -1,37 +1,41 @@
 div.leaflet-container {
-    height: 100%;
+  height: 100%;
 }
 
-
-.leaflet-marker-pane>img{
-    margin:-1px;
+.leaflet-marker-pane > img {
+  margin: -1px;
 }
 
 .map__marker__image {
-    position: relative;
-    height:38px;
-    width:38px;
-    top: -32px;
-    left: -13px;
+  position: relative;
+  height: 42px;
+  width: 30px;
+  top: -34px;
+  left: -13px;
 }
 
-.map__marker__text{
-    position: relative;
-    width:80px;
-    overflow: hidden;
-    white-space: nowrap;
-    top: -100px;
-    left: -35px;
-    background-color: #ffffff;
-    opacity: 0.9;
-    display: none;
-    text-align: center;
+.map__marker__text {
+  position: relative;
+  width: 80px;
+  overflow: hidden;
+  white-space: nowrap;
+  top: -100px;
+  left: -35px;
+  background-color: $colorPrimary;
+  border: 1px solid $colorPrimaryDark;
+  opacity: 0.9;
+  display: none;
+  text-align: center;
 }
 
-.map__marker__image:hover + .map__marker__text{
-    display: block;
+.map__marker__image:hover + .map__marker__text {
+  display: block;
 }
 
 .map__marker:hover > .map__marker__text {
-    display: block;
+  display: block;
 }
+
+leaflet-top leaflet-left {
+  float: right !important;
+}
diff --git a/src/css/Sidebar.scss b/src/css/Sidebar.scss
@@ -3,9 +3,10 @@ div.sidebar {
     margin: 0;
     float: left;
     background-color: #fff;
+    overflow: scroll;
 }
 
 div.sidebar__card {
-    overflow: scroll;
+
     height: 100%;
 }
diff --git a/src/images/github_otocat.png b/src/images/github_otocat.png
diff --git a/src/images/map-marker-icon.png b/src/images/map-marker-icon.png