added Freifunk Farben, autofocus

debug.html

@@ -30,14 +30,14 @@
       <form action="#" method="get">
         <div class="input-group">
           <!-- USE TWITTER TYPEAHEAD JSON WITH API TO SEARCH -->
-          <input class="form-control" id="system-search" name="q" placeholder="Suche nach" required>
+          <input class="form-control" id="system-search" name="q" placeholder="Suche nach" autofocus required>
           <span class="input-group-btn">
-          <button type="submit" class="btn btn-default"><i class="glyphicon glyphicon-search"></i></button>
+          <button type="submit" class="btn btn-ffms"><i class="glyphicon glyphicon-search"></i></button>
           </span>
         </div>
       </form>
       <br/>
-      <p><strong><a href="map/">Gesamtkarte des Freifunk Münsterlands</a></strong></p>
+      <h4><strong><a href="map/">Gesamtkarte des Freifunk Münsterlands</a></strong></h4>
       <p><a href="https://freifunk-muensterland.de">Freifunk Münsterland</a></p>
       <p><a href="https://wiki.freifunk-muensterland.de/">Freifunk Münsterland Wiki</a></p>
       <p><a href="https://forum.freifunk-muensterland.de/">Freifunk Münsterland Forum</a></p>

ffms.css

@@ -6,5 +6,39 @@
         text-align:center;
     }
 }
-
-
+a:link{
+    color:#dc0067;
+}
+a:visited{
+    color:#b00052;
+}
+.ffms-alert{
+    background-color:#ffd97f;
+}
+#system-search:focus {
+    border: 1px solid #ffb400;
+    border-radius: 2px;
+}
+#system-search:hover {
+    border: 2px solid #ffb400;
+    border-radius: 2px;
+}
+#system-search:hover:focus {
+    outline: none;
+    box-shadow: 0px 0px 5px #ffb400;
+    border:2px solid #ffb400;
+    border-radius:0;
+}
+.btn-ffms{
+    background-color:#ffd97f;
+}
+.btn-ffms:hover{
+    background-color:#ffd97f;
+    border:1px solid #ffb400;
+    box-shadow: 0px 0px 3px #ffb400;
+}
+.btn-ffms:active{
+    background-color:#ffd97f;
+    border:2px solid #ffb400;
+    box-shadow: 0px 0px 5px #ffb400;    
+}

index.html.j2

@@ -30,17 +30,17 @@
       <form action="#" method="get">
         <div class="input-group">
           <!-- USE TWITTER TYPEAHEAD JSON WITH API TO SEARCH -->
-          <input class="form-control" id="system-search" name="q" placeholder="Suche nach" required>
+          <input class="form-control" id="system-search" name="q" placeholder="Suche nach" autofocus required>
           <span class="input-group-btn">
-          <button type="submit" class="btn btn-default"><i class="glyphicon glyphicon-search"></i></button>
+          <button type="submit" class="btn btn-ffms"><i class="glyphicon glyphicon-search"></i></button>
           </span>
         </div>
       </form>
       <br/>
-      <p><strong><a href="map/">Gesamtkarte des Freifunk Münsterlands</a></strong></p>
-      <p><a href="https://freifunk-muensterland.de">Freifunk Münsterland</a></p>
-      <p><a href="https://wiki.freifunk-muensterland.de/">Freifunk Münsterland Wiki</a></p>
-      <p><a href="https://forum.freifunk-muensterland.de/">Freifunk Münsterland Forum</a></p>
+      <h4><strong><a href="map/">Gesamtkarte des Freifunk Münsterlands</a></strong></h4>
+      <p><a href="https://freifunk-muensterland.de">{{freifunk.name}}</a></p>
+      <p><a href="https://wiki.freifunk-muensterland.de/">{{freifunk.name}} Wiki</a></p>
+      <p><a href="https://forum.freifunk-muensterland.de/">{{freifunk.name}} Forum</a></p>
     </div>
     <!-- Spalte mit Domänen -->
     <div class="col-md-4 col-sm-4">

search.js

@@ -16,7 +16,7 @@ $(document).ready(function() {
             if(inputText !== '')
             {
                 $('.search-query-sf').remove();
-                tableBody.prepend('<tr class="search-query-sf"><td colspan="6" <div class="alert alert-info">Einträge mit <strong>"'
+                tableBody.prepend('<tr class="search-query-sf"><td colspan="6" <div class="ffms-alert">Einträge mit <strong>"'
                     + $(that).val()
                     + '"</strong></div></td></tr>');
             }