From 7702e63acaf9ff68af1ee3112e00c19725028bea Mon Sep 17 00:00:00 2001
From: terehm <terehm@usi.ch>
Date: Sun, 11 Nov 2018 13:22:26 +0000
Subject: [PATCH] css-team: properly format search bar results

git-svn-id: svn+ssh://atelier.inf.usi.ch/home/bevilj/group-1@101 a672b425-5310-4d7a-af5c-997e18724b81
---
 site/_includes/header.html | 14 +++++++-------
 site/_layouts/main.html    |  2 +-
 site/_sass/_header.scss    | 30 ++++++++++++++++++++++--------
 3 files changed, 30 insertions(+), 16 deletions(-)

diff --git a/site/_includes/header.html b/site/_includes/header.html
index e428fa9..10e032d 100644
--- a/site/_includes/header.html
+++ b/site/_includes/header.html
@@ -1,11 +1,11 @@
 <div class="menuDesktop">
-    <div class="logo">
-        <a href="/index.html"><img src="/assets/style/logo_white.png" height="50"></a>
-    </div>
-    <div class="fill-space"></div>
-    <div class="search-box"><input type="text" id="search-bar"><label for="search-bar"><img src="/assets/style/search_icon.png"></label>
-        <ul id="search-results">
-        </ul>
+  <div class="logo">
+    <a href="/index.html"><img src="/assets/style/logo_white.png" height="50"></a>
+  </div>
+  <div class="fill-space"></div>
+  <div class="search-box">
+    <input type="text" id="search-bar"><label for="search-bar"><img src="/assets/style/search_icon.png"></label>
+    <ul id="search-results"></ul>
   </div>
   <nav class="nav-menu">
     <div>Learn
diff --git a/site/_layouts/main.html b/site/_layouts/main.html
index 7263eb4..19d9292 100644
--- a/site/_layouts/main.html
+++ b/site/_layouts/main.html
@@ -20,7 +20,7 @@
 				resultsContainer: results,
 				json: '/search.json',
 				searchResultTemplate:
-					'<a href="{url}"><h3>{title}</h3><h4>{category}</h4></a>',
+					'<li><a href="{url}"><h3>{title}</h3><h4>{category}</h4></a></li>',
 				success: function(sr) {
 					results.setAttribute("class", sr.length <= 1 ? "" : "show");
 				}
diff --git a/site/_sass/_header.scss b/site/_sass/_header.scss
index 1b9adc1..2484505 100644
--- a/site/_sass/_header.scss
+++ b/site/_sass/_header.scss
@@ -37,11 +37,13 @@ header{
   li:hover {
     color: #66aa66;
   }
+
+  a{
+    text-decoration: none;
+    color: inherit;
+  }
 }
 
-.search-box ul.show {
-  display: block;
-}
 
 
 .nav-menu {
@@ -58,10 +60,10 @@ header{
     font-size: 20px;
     padding: 0 5px;
 
-    a{
-      text-decoration: none;
-      color: inherit;
-    }
+    //a{
+    //  text-decoration: none;
+    //  color: inherit;
+    //}
 
     ul:hover {
       display: block;
@@ -99,6 +101,14 @@ header{
     color: #FFFFFF;
   }
 
+  ul {
+    display: none;
+    li{
+      margin-top: 15px;
+      margin-bottom: 15px;
+    }
+  }
+
   img{
     vertical-align: middle;
     cursor: pointer;
@@ -106,9 +116,13 @@ header{
   }
 }
 
-.search-box:focus-within {
+.search-box:focus-within, .search-box:active {
   input {
     margin-left: 0;
     opacity: 1;
   }
+
+  ul{
+    display: block;
+  }
 }