From 326d3256d218323031b2b87d31ae313e73f5d2cd Mon Sep 17 00:00:00 2001
From: Ofer Lehr <ofer@oferlehr.com>
Date: Mon, 8 Dec 2014 08:58:25 +0200
Subject: better looking search suggestion

- fixes bug that hides the suggestions behind the input bar
- suggestion items are now highlighted on hover
- better positioning
- larger font size for search bar suggestions
---
 res/css/partials/search-bar.scss | 20 +++++++++++++++++++-
 1 file changed, 19 insertions(+), 1 deletion(-)

(limited to 'res/css/partials/search-bar.scss')

diff --git a/res/css/partials/search-bar.scss b/res/css/partials/search-bar.scss
index db46df31..b9f0de7d 100644
--- a/res/css/partials/search-bar.scss
+++ b/res/css/partials/search-bar.scss
@@ -1,6 +1,7 @@
 @import '../modules/mixins'; // For box-shadow
 
 .search-bar{
+  position: relative;
   width:100%;
   height:$four-baselines;
   background: white;
@@ -23,12 +24,29 @@
   background-repeat: no-repeat;
 }
 
-input {
+#search {
   font-family: $base-font-family;
   font-size: $h3-size;
   width: 80%;
 }
 
+#search-suggestion {
+  position: absolute;
+  width: 70%;
+  margin-left: $doc-margin;
+  top: $three-baselines + 6px;
+}
+
+#search-suggestion .suggestion-item {
+  padding: $one-baseline 0px $one-baseline $two-baselines;
+}
+
+#search-suggestion .suggestion-item.selected, #search-suggestion .suggestion-item:hover {
+  padding: $one-baseline 0px $one-baseline 22px;
+}
+
+
+
 .export {
   cursor: pointer;
   text-align: right;
-- 
cgit v1.3.1