Add Color

css/_variables.scss

@@ -1 +1 @@
-$ff_color: #dc0067;
+$ff_color: #df316c;

css/community.css

@@ -2,14 +2,14 @@ header {
   min-height: 10vh; }
 
 #outer-container {
-  border-top: 5px solid #dc0067;
+  border-top: 5px solid #df316c;
   margin: 5vh auto 0 auto; }
   #outer-container .row {
     margin-left: auto;
     margin-right: auto; }
 
 .dropdown-content li > a, .dropdown-content li > span {
-  color: #dc0067; }
+  color: #df316c; }
 
 .input-field {
   padding: 0 !important; }
@@ -19,21 +19,21 @@ header {
 
 .page-footer {
   padding-top: 0;
-  background-color: #dc0067; }
+  background-color: #df316c; }
 
 #backtohome {
-  background-color: #dc0067; }
+  background-color: #df316c; }
 
 header {
   border-bottom: 1px solid rgba(0, 0, 0, 0.2); }
 
 .btn.navigation.next {
-  background-color: #dc0067; }
+  background-color: #df316c; }
 
 #img_router_front, #img_router_back {
   max-width: 200px; }
 
 #download {
-  background-color: #dc0067; }
+  background-color: #df316c; }
 
 /*# sourceMappingURL=community.css.map */

css/index.css

@@ -2,14 +2,14 @@ header {
   min-height: 10vh; }
 
 #outer-container {
-  border-top: 5px solid #dc0067;
+  border-top: 5px solid #df316c;
   margin: 5vh auto 0 auto; }
   #outer-container .row {
     margin-left: auto;
     margin-right: auto; }
 
 .dropdown-content li > a, .dropdown-content li > span {
-  color: #dc0067; }
+  color: #df316c; }
 
 .input-field {
   padding: 0 !important; }
@@ -19,7 +19,7 @@ header {
 
 .page-footer {
   padding-top: 0;
-  background-color: #dc0067; }
+  background-color: #df316c; }
 
 #inner-container {
   padding: 1.5rem; }

geojson/hennef.geojson

@@ -11,7 +11,8 @@
     {
       "type":"Feature",
       "properties":{
-        "community_id":"0"
+        "community_id":"0",
+        "color":"#f44336"
       },
       "geometry":{
         "type":"Polygon",

geojson/koenigswinter.geojson

@@ -11,7 +11,8 @@
     {
       "type":"Feature",
       "properties":{
-        "community_id":"1"
+        "community_id":"1",
+        "color":"#e91e63"
       },
       "geometry":{
         "type":"Polygon",

geojson/lohmar.geojson

@@ -11,7 +11,8 @@
     {
       "type":"Feature",
       "properties":{
-        "community_id": "2"
+        "community_id": "2",
+        "color":"#9c27b0"
       },
       "geometry":{
         "type":"Polygon",

geojson/meckenheim.geojson

@@ -11,7 +11,8 @@
     {
       "type":"Feature",
       "properties":{
-        "community_id":"3"
+        "community_id":"3",
+        "color":"#673ab7"
       },
       "geometry":{
         "type":"Polygon",

geojson/much.geojson

@@ -11,7 +11,8 @@
     {
       "type":"Feature",
       "properties":{
-        "community_id":"4"
+        "community_id":"4",
+        "color":"#795548"
       },
       "geometry":{
         "type":"Polygon",

geojson/neunkirchen.geojson

@@ -11,7 +11,8 @@
     {
       "type":"Feature",
       "properties":{
-        "community_id":"5"
+        "community_id":"5",
+        "color":"#3f51b5"
       },
       "geometry":{
         "type":"Polygon",

geojson/niederkassel.geojson

@@ -11,7 +11,8 @@
     {
       "type":"Feature",
       "properties":{
-        "community_id":"6"
+        "community_id":"6",
+        "color":"#8bc34a"
       },
       "geometry":{
         "type":"Polygon",

geojson/rheinbach.geojson

@@ -11,7 +11,8 @@
     {
       "type":"Feature",
       "properties":{
-        "community_id":"7"
+        "community_id":"7",
+        "color":"#00bcd4"
       },
       "geometry":{
         "type":"Polygon",

geojson/ruppichteroth.geojson

@@ -11,7 +11,8 @@
     {
       "type":"Feature",
       "properties":{
-        "community_id":"8"
+        "community_id":"8",
+        "color":"#009688"
       },
       "geometry":{
         "type":"Polygon",

geojson/siegburg.geojson

@@ -11,7 +11,8 @@
     {
       "type":"Feature",
       "properties":{
-        "community_id": "10"
+        "community_id": "10",
+        "color":"#2196f3"
       },
       "geometry":{
         "type":"Polygon",

geojson/staugustin.geojson

@@ -11,7 +11,8 @@
     {
       "type":"Feature",
       "properties":{
-        "community_id":"9"
+        "community_id":"9",
+        "color":"#4caf50"
       },
       "geometry":{
         "type":"Polygon",

geojson/troisdorf.geojson

@@ -11,7 +11,8 @@
     {
       "type":"Feature",
       "properties":{
-        "community_id":"12"
+        "community_id":"12",
+        "color":"#ff9800"
       },
       "geometry":{
         "type":"Polygon",

geojson/wachtberg.geojson

@@ -11,7 +11,8 @@
     {
       "type":"Feature",
       "properties":{
-        "community_id":"14"
+        "community_id":"14",
+        "color":"#ff5722"
       },
       "geometry":{
         "type":"Polygon",

js/comunitychoose.js

@@ -13,11 +13,12 @@ $(document).ready(function() {
     }).addTo(map);
     communityiesGeoJson.forEach(function (i) {
         $.getJSON( i.geojson, function( data ) {
+            console.log(data)
             var community = L.geoJSON(data, {
                 style: {
-                    fillColor: "#dc0067",
+                    fillColor: data.features[0].properties.color,
                     fillOpacity: 0.25,
-                    color: '#dc0067',
+                    color: data.features[0].properties.color,
                     opacity: 1,
                     weight: 2
                 }