[TASK] Exo2 font and adjust custom scss

assets/favicon/manifest.json

@@ -1,5 +1,5 @@
 {
-    "name": "Meshviewer",
+    "name": "Freifunk Regensburg",
     "icons": [
         {
             "src": "./android-chrome-192x192.png",

assets/faviconData.json

@@ -1 +1 @@
-{"result":{"status":"success"},"favicon":{"package_url":"https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/favicons.zip","files_urls":["https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/android-chrome-192x192.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/android-chrome-512x512.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/apple-touch-icon.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/browserconfig.xml","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/favicon-16x16.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/favicon-32x32.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/favicon.ico","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/manifest.json","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/mstile-144x144.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/mstile-150x150.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/mstile-310x150.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/mstile-310x310.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/mstile-70x70.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/safari-pinned-tab.svg"],"html_code":"<link rel=\"apple-touch-icon\" sizes=\"180x180\" href=\"./apple-touch-icon.png\">\n<link rel=\"icon\" type=\"image/png\" href=\"./favicon-32x32.png\" sizes=\"32x32\">\n<link rel=\"icon\" type=\"image/png\" href=\"./favicon-16x16.png\" sizes=\"16x16\">\n<link rel=\"manifest\" href=\"./manifest.json\">\n<link rel=\"mask-icon\" href=\"./safari-pinned-tab.svg\" color=\"#dc0067\">\n<link rel=\"shortcut icon\" href=\"./favicon.ico\">\n<meta name=\"apple-mobile-web-app-title\" content=\"Meshviewer\">\n<meta name=\"application-name\" content=\"Meshviewer\">\n<meta name=\"msapplication-TileColor\" content=\"#dc0067\">\n<meta name=\"msapplication-TileImage\" content=\"./mstile-144x144.png\">\n<meta name=\"msapplication-config\" content=\"./browserconfig.xml\">\n<meta name=\"theme-color\" content=\"#dc0067\">","compression":"true","overlapping_markups":["link[rel=\"apple-touch-icon\"]","meta[name=\"apple-mobile-web-app-title\"]","link[rel=\"shortcut\"]","link[rel=\"shortcut icon\"]","link[rel=\"icon\",sizes=\"16x16\"]","link[rel=\"icon\",sizes=\"32x32\"]","meta[name=\"msapplication-TileColor\"]","meta[name=\"msapplication-TileImage\"]","meta[name=\"msapplication-config\"]","meta[name=\"application-name\"]","link[rel=\"manifest\"]","meta[name=\"theme-color\"]","link[rel=\"mask-icon\"]"]},"files_location":{"type":"path","path":"."},"preview_picture_url":"https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/favicon_preview.png","version":"0.14"}
+{"result":{"status":"success"},"favicon":{"package_url":"https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/favicons.zip","files_urls":["https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/android-chrome-192x192.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/android-chrome-512x512.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/apple-touch-icon.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/browserconfig.xml","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/favicon-16x16.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/favicon-32x32.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/favicon.ico","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/manifest.json","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/mstile-144x144.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/mstile-150x150.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/mstile-310x150.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/mstile-310x310.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/mstile-70x70.png","https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/package_files/safari-pinned-tab.svg"],"html_code":"<link rel=\"apple-touch-icon\" sizes=\"180x180\" href=\"./apple-touch-icon.png\">\n<link rel=\"icon\" type=\"image/png\" href=\"./favicon-32x32.png\" sizes=\"32x32\">\n<link rel=\"icon\" type=\"image/png\" href=\"./favicon-16x16.png\" sizes=\"16x16\">\n<link rel=\"manifest\" href=\"./manifest.json\">\n<link rel=\"mask-icon\" href=\"./safari-pinned-tab.svg\" color=\"#dc0067\">\n<link rel=\"shortcut icon\" href=\"./favicon.ico\">\n<meta name=\"apple-mobile-web-app-title\" content=\"Freifunk Regensburg\">\n<meta name=\"application-name\" content=\"Freifunk Regensburg\">\n<meta name=\"msapplication-TileColor\" content=\"#dc0067\">\n<meta name=\"msapplication-TileImage\" content=\"./mstile-144x144.png\">\n<meta name=\"msapplication-config\" content=\"./browserconfig.xml\">\n<meta name=\"theme-color\" content=\"#dc0067\">","compression":"true","overlapping_markups":["link[rel=\"apple-touch-icon\"]","meta[name=\"apple-mobile-web-app-title\"]","link[rel=\"shortcut\"]","link[rel=\"shortcut icon\"]","link[rel=\"icon\",sizes=\"16x16\"]","link[rel=\"icon\",sizes=\"32x32\"]","meta[name=\"msapplication-TileColor\"]","meta[name=\"msapplication-TileImage\"]","meta[name=\"msapplication-config\"]","meta[name=\"application-name\"]","link[rel=\"manifest\"]","meta[name=\"theme-color\"]","link[rel=\"mask-icon\"]"]},"files_location":{"type":"path","path":"."},"preview_picture_url":"https://realfavicongenerator.net/files/03dc81277d21a8ed4bb836b4c05ada2ee75b9e3c/favicon_preview.png","version":"0.14"}

config.json

@@ -5,13 +5,13 @@
     {
       "name": "Clientstatistik",
       "href": "https://regensburg.freifunk.net/netz/statistik/node/{NODE_ID}/",
-      "image": "https://grafana.regensburg.freifunk.net/render/dashboard-solo/db/ffrgb-all-nodes?panelId=1&from=now-7d&var-nodeid={NODE_ID}&var-host={NODE_NAME}&width=650&height=350&theme=light&_t={TIME}",
+      "image": "https://grafana.regensburg.freifunk.net/render/dashboard-solo/db/ffrgb-all-nodes-integration?panelId=1&from=now-1d&var-nodeid={NODE_ID}&var-host=All&width=650&height=350&theme=light&_t={TIME}",
       "title": "Knoten {NODE_ID} - weiteren Statistiken"
     },
     {
       "name": "Trafficstatistik",
       "href": "https://regensburg.freifunk.net/netz/statistik/node/{NODE_ID}/",
-      "image": "https://grafana.regensburg.freifunk.net/render/dashboard-solo/db/ffrgb-all-nodes?panelId=2&from=now-7d&var-nodeid={NODE_ID}&var-host={NODE_NAME}&width=650&height=350&theme=light&_t={TIME}",
+      "image": "https://grafana.regensburg.freifunk.net/render/dashboard-solo/db/ffrgb-all-nodes-integration?panelId=2&from=now-1d&var-nodeid={NODE_ID}&var-host=All&width=650&height=350&theme=light&_t={TIME}",
       "title": "Knoten {NODE_ID} - weiteren Statistiken"
     }
   ],
@@ -25,15 +25,16 @@
   ],
   // String or array of data provider are supported
   "dataPath": "https://regensburg.freifunk.net/data/",
+  "reverseGeocodingApi": "https://regensburg.freifunk.net/geocoding/reverse",
   "siteName": "Freifunk Regensburg",
   "mapLayers": [
     {
       "name": "Freifunk Regensburg",
-      // Please ask Freifunk Regensburg before using its tile server c- example with retina tiles
+      // Please ask Freifunk Regensburg before using its tile server - example with retina tiles
       "url": "https://{s}.tiles.ffrgb.net/{z}/{x}/{y}{retina}.png",
       "config": {
         "maxZoom": 22,
-        "subdomains": "1234",
+        "subdomains": "1",
         "attribution": "<a href=\"https://www.mapbox.com/about/maps/\" target=\"_blank\">&copy; Mapbox</a> <a href=\"https://openstreetmap.org/about/\" target=\"_blank\">&copy; OpenStreetMap</a> <a class=\"mapbox-improve-map\" href=\"https://www.mapbox.com/map-feedback/\" target=\"_blank\">Improve this map</a>",
         "start": 6
       }
@@ -44,7 +45,7 @@
       "url": "https://{s}.tiles.ffrgb.net/n/{z}/{x}/{y}{retina}.png",
       "config": {
         "maxZoom": 22,
-        "subdomains": "1234",
+        "subdomains": "1",
         "attribution": "<a href=\"https://www.mapbox.com/about/maps/\" target=\"_blank\">&copy; Mapbox</a> <a href=\"https://openstreetmap.org/about/\" target=\"_blank\">&copy; OpenStreetMap</a> <a class=\"mapbox-improve-map\" href=\"https://www.mapbox.com/map-feedback/\" target=\"_blank\">Improve this map</a>",
         "mode": "night",
         "start": 19,
@@ -52,35 +53,9 @@
       }
     },
     {
-      "name": "OpenStreetMap.HOT",
+      "name": "HERE Satellit Hybrid",
-      "url": "https://{s}.tile.openstreetmap.fr/hot/{z}/{x}/{y}.png",
-      "config": {
-        "maxZoom": 19,
-        "attribution": "&copy; Openstreetmap France | &copy; <a href=\"http://www.openstreetmap.org/copyright\">OpenStreetMap</a>"
-      }
-    },
-    {
-      "name": "HERE",
       // Please use your own API key - Free plan is on right side after the pay plans
-      "url": "https://{s}.base.maps.api.here.com/maptile/2.1/maptile/newest/normal.day/{z}/{x}/{y}/256/png8?app_id=YOUR_KEY&app_code=YOUR_CODE&lg=deu",
+      "url": "https://{s}.aerial.maps.api.here.com/maptile/2.1/maptile/newest/{variant}/{z}/{x}/{y}/256/png8?app_id=Q40ik5rnMQOpOQ6RrHCr&app_code=kIPJpCtUZMTiQQJiCemX6Q&lg=deu",
-      "config": {
-        "attribution": "Map &copy; 1987-2014 <a href=\"http://developer.here.com\">HERE</a>",
-        "subdomains": "1234",
-        "maxZoom": 20
-      }
-    },
-    {
-      "name": "Esri.WorldImagery",
-      "url": "//server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}",
-      "config": {
-        "maxZoom": 20,
-        "attribution": "Tiles &copy; Esri &mdash; Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community"
-      }
-    },
-    {
-      "name": "HERE.hybridDay",
-      // Please use your own API key - Free plan is on right side after the pay plans
-      "url": "https://{s}.aerial.maps.api.here.com/maptile/2.1/maptile/newest/{variant}/{z}/{x}/{y}/256/png8?app_id=YOUR_KEY&app_code=YOUR_CODE&lg=deu",
       "config": {
         "attribution": "Map &copy; 1987-2014 <a href=\"http://developer.here.com\">HERE</a>",
         "subdomains": "1234",

html/index.html

@@ -2,6 +2,7 @@
 <html>
 <head>
   <meta charset="utf-8">
+  <title>Freifunk Regensburg e.V. - Meshviewer</title>
   <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
   <link rel="stylesheet" href="main.css" inline>
   <link rel="stylesheet" class="css-mode night" media="not" href="night.css" inline>

scss/custom/_custom.scss

@@ -8,3 +8,94 @@
 
 // SCSS supports css with a lot of additional features like variables or mixins.
 // Autoprefixer runs in postcss, no need to add browser-prefixes like -webkit, -moz or -ms
+
+@font-face {
+  font-family: 'Exo 2';
+  font-weight: 300;
+  src: local('Exo 2 Light'),
+  local('Exo2-Light'),
+  url('/typo3conf/ext/freifunk_regensburg/Resources/Public/Fonts/Exo2.0-Light-webfont.woff2') format('woff2'),
+  url('/typo3conf/ext/freifunk_regensburg/Resources/Public/Fonts/Exo2.0-Light-webfont.woff') format('woff'),
+  url('/typo3conf/ext/freifunk_regensburg/Resources/Public/Fonts/Exo2.0-Light-webfont.ttf') format('truetype');
+}
+
+@font-face {
+  font-family: 'Exo 2';
+  font-weight: 800;
+  src: local('Exo 2 Black'),
+  local('Exo2-Black'),
+  url('/typo3conf/ext/freifunk_regensburg/Resources/Public/Fonts/Exo2.0-Black-webfont.woff2') format('woff2'),
+  url('/typo3conf/ext/freifunk_regensburg/Resources/Public/Fonts/Exo2.0-Black-webfont.woff') format('woff'),
+  url('/typo3conf/ext/freifunk_regensburg/Resources/Public/Fonts/Exo2.0-Black-webfont.ttf') format('truetype');
+}
+
+a {
+  color: $color-freifunk-primary;
+}
+
+%leaflet-button {
+  background-color: $color-freifunk-primary;
+  color: $color-freifunk-secondary;
+  opacity: .9;
+
+  &.active,
+  &:hover {
+    color: $color-white;
+    opacity: 1;
+  }
+}
+
+button {
+  @extend %leaflet-button;
+
+  &.close {
+    &.active,
+    &:hover {
+      color: $color-primary;
+    }
+  }
+}
+
+.leaflet-control-zoom {
+  opacity: 1;
+
+  a {
+    @extend %leaflet-button;
+  }
+}
+
+.leaflet-control-layers {
+  &.leaflet-control {
+    opacity: 1;
+  }
+}
+
+.leaflet-container {
+  .leaflet-control-layers-toggle {
+    @extend %leaflet-button;
+  }
+}
+
+.infobox {
+  .clients {
+    color: $color-freifunk-primary;
+  }
+}
+
+.ion-location {
+  color: $color-freifunk-primary;
+}
+
+.leaflet-label {
+  &.leaflet-label-right {
+    background-color: $color-white;
+    border: 2px solid $color-freifunk-primary;
+    border-radius: 0;
+    font-weight: normal;
+    opacity: .8;
+
+    &::before {
+      display: none;
+    }
+  }
+}

scss/custom/_variables.scss

@@ -2,3 +2,21 @@
 //$color-black: #fff;
 //$color-white: invert($color-white);
 //$color-primary: invert($color-primary);
+
+$color-freifunk-primary: #e32d6d;
+$color-freifunk-secondary: #f4c72f;
+$color-freifunk-gray-light: #e9e9e9;
+$color-freifunk-gray: #504f4e;
+$color-freifunk-gray-dark: #3f3f3e;
+$color-freifunk-gray-darker: #373636;
+
+$color-black: $color-freifunk-gray-darker;
+$color-primary: $color-freifunk-primary;
+$color-gray-dark: $color-freifunk-gray-dark;
+
+$font-family: 'Exo 2', sans-serif;
+$font-family-secondary: 'Exo 2', sans-serif;
+
+$shadows: 0;
+
+$use-included-font: 0;