Filter functions almost ready.

Our pretty bar changes visual state of the filtered elements, clears with the X, restores hidden elements when deleting characters. Etc.

For the future: if a chapterBlock is collapsed but has results, expand it. No?
Also, hopefully getting fontawesome to the latest version... Regardless of that, this is a great opportunity for a legendary 404.

Expansion of containers achieved

Still working on collapsing them back when search terms change.
If users had just pressed "collapse all" before the search, they should remain thus afterwards.

The UX focus here is not to change the users' expected behaviour and final result.

Future: updating font awesome.
Working on a legendary "not found" image to make FCC join the internet hall of fame.
(btw, where would I keep that file in the server?)

client/less/map.less

@@ -43,15 +43,9 @@
       flex: 1;
       width: 100%;
       height: 100%;
-
       border: 0;
-      overflow: auto;
-    }
-}
-
-.map-aside-body {
-    #nested {
-      margin:0 20px;
+      overflow: scroll;
+      -webkit-overflow-scrolling: touch;
     }
 }
 
@@ -73,43 +67,69 @@
 .map-fixed-header {
   position: fixed;
   background: white;
-  padding-top: 20px;
+  padding-top: 13px;
   width: 100%;
   z-index: 1;
   left: 0;
   top: 0;
   @media (max-width: 720px) {
-    padding-top:35px;
+    padding-top:30px;
   }
-}
-.map-fixed-header p {
+  p {
   margin: 10px 0 20px;
-  @media (max-width: 720px) {
-    margin-bottom:15px;
+    @media (max-width: 720px) {
+      margin-bottom:10px;
+    }
   }
-}
-.map-fixed-header hr {
-  margin:35px 0;
-  @media (max-width: 720px) {
-    margin:25px 0;
+  hr {
+    margin:30px 0;
+    @media (max-width: 720px) {
+      margin:25px 0;
+    }
   }
-}
+ } 
 .map-buttons button,
 .map-buttons .input-group{
   width:300px;
 }
 
 .map-buttons .input-group{
-  margin-top: 10px;
+  margin-top: 15px;
   margin-left: auto;
   margin-right: auto;
 }
 
+#map-filter {
+    background:#fff;
+    border-color: darkgreen;
+}
+.input-group-addon {
+  width:40px;
+  color: darkgreen;
+  background: #fff;
+  border-color: darkgreen; 
+  &.filled{     
+    background: darkgreen;
+    border-color: #000d00;
+    color: #fff;
+    cursor: pointer;
+  }
+  .fa {
+    position:absolute;
+    top:50%;
+    transform: translateY(-50%);
+    right:10px;
+  }
+}
+
 .map-accordion {
-  margin: 140px auto 0;
+  margin: 170px auto 0;
   width:700px;
   overflow-y: auto;
   position:relative;
+  #nested {
+    margin:0 15px;
+  }
   h2 > a {
       width:100%;
       display:block;
@@ -132,11 +152,11 @@
     }
   }
 
-  #nested div :before {
+  div.chapterBlock :before {
     margin-right: 15px;
   }
 
-  #nested div p {
+  div.chapterBlock p {
       text-indent: -15px;
       margin-left: 60px;
       padding-right: 20px
@@ -176,7 +196,7 @@
     left:0;
     right:0;
     width:100%;
-    margin-top:165px;
+    margin-top:205px;
     h2 {
       margin:15px 0;
       padding:0;
@@ -234,6 +254,18 @@
     }
 }
 
+#noneFound {
+    display:none;
+    margin:60px 30px 0;
+    font-size:60px;
+    text-align: center;
+    color:darkgreen;
+    .fa {
+      display:block;
+      font-size:300px;
+    }
+}
+
 .map-aside-action-pop-out {
     margin-right: -4px;
     background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMDAgMTcxLjQyOSIgZmlsbD0iIzNhMzEzMyI+PHBhdGggZD0iTTE1Ny4xNDMsMTAzLjU3MXYzNS43MTRjMCw4Ljg1NC0zLjE0NCwxNi40MjYtOS40MzEsMjIuNzEzcy0xMy44NTgsOS40MzEtMjIuNzEyLDkuNDMxSDMyLjE0MyBjLTguODU0LDAtMTYuNDI1LTMuMTQ0LTIyLjcxMi05LjQzMVMwLDE0OC4xNCwwLDEzOS4yODVWNDYuNDI5YzAtOC44NTQsMy4xNDQtMTYuNDI1LDkuNDMxLTIyLjcxMiBjNi4yODctNi4yODcsMTMuODU4LTkuNDMxLDIyLjcxMi05LjQzMWg3OC41NzJjMS4wNDEsMCwxLjg5NiwwLjMzNSwyLjU2NiwxLjAwNGMwLjY3LDAuNjcsMS4wMDQsMS41MjUsMS4wMDQsMi41NjdWMjUgYzAsMS4wNDItMC4zMzQsMS44OTctMS4wMDQsMi41NjdjLTAuNjcsMC42Ny0xLjUyNSwxLjAwNC0yLjU2NiwxLjAwNEgzMi4xNDNjLTQuOTExLDAtOS4xMTUsMS43NDktMTIuNjEyLDUuMjQ2IHMtNS4yNDYsNy43MDEtNS4yNDYsMTIuNjEydjkyLjg1NmMwLDQuOTExLDEuNzQ5LDkuMTE1LDUuMjQ2LDEyLjYxMnM3LjcwMSw1LjI0NSwxMi42MTIsNS4yNDVIMTI1YzQuOTEsMCw5LjExNS0xLjc0OCwxMi42MTEtNS4yNDUgYzMuNDk3LTMuNDk3LDUuMjQ2LTcuNzAxLDUuMjQ2LTEyLjYxMnYtMzUuNzE0YzAtMS4wNDIsMC4zMzQtMS44OTcsMS4wMDQtMi41NjdjMC42Ny0wLjY2OSwxLjUyNS0xLjAwNCwyLjU2Ny0xLjAwNGg3LjE0MyBjMS4wNDIsMCwxLjg5NywwLjMzNSwyLjU2NywxLjAwNEMxNTYuODA5LDEwMS42NzQsMTU3LjE0MywxMDIuNTI5LDE1Ny4xNDMsMTAzLjU3MXogTTIwMCw3LjE0M3Y1Ny4xNDMgYzAsMS45MzUtMC43MDcsMy42MDktMi4xMjEsNS4wMjJjLTEuNDEzLDEuNDE0LTMuMDg4LDIuMTIxLTUuMDIxLDIuMTIxYy0xLjkzNSwwLTMuNjA5LTAuNzA3LTUuMDIyLTIuMTIxbC0xOS42NDQtMTkuNjQzIGwtNzIuNzY3LDcyLjc2OWMtMC43NDQsMC43NDQtMS42LDEuMTE1LTIuNTY3LDEuMTE1cy0xLjgyMy0wLjM3MS0yLjU2Ny0xLjExNUw3Ny41NjcsMTA5LjcxYy0wLjc0NC0wLjc0NC0xLjExNi0xLjYtMS4xMTYtMi41NjcgYzAtMC45NjcsMC4zNzItMS44MjIsMS4xMTYtMi41NjZsNzIuNzY4LTcyLjc2OGwtMTkuNjQ0LTE5LjY0M2MtMS40MTMtMS40MTQtMi4xMi0zLjA4OC0yLjEyLTUuMDIyYzAtMS45MzUsMC43MDctMy42MDksMi4xMi01LjAyMiBDMTMyLjEwNSwwLjcwNywxMzMuNzc5LDAsMTM1LjcxNSwwaDU3LjE0M2MxLjkzNCwwLDMuNjA4LDAuNzA3LDUuMDIxLDIuMTIxQzE5OS4yOTMsMy41MzQsMjAwLDUuMjA4LDIwMCw3LjE0M3oiLz48L3N2Zz4=)