From 4a36834d3f10fee5e912b6205d75c820f70d5250 Mon Sep 17 00:00:00 2001
From: Mario Vavti <mario@mariovavti.com>
Date: Fri, 6 May 2016 10:42:38 +0200
Subject: [PATCH] use darker background colour only for searchbar

---
 view/theme/redbasic/css/style.css | 25 +++++++++++++++++--------
 view/tpl/acl_selector.tpl         | 10 +++++++---
 2 files changed, 24 insertions(+), 11 deletions(-)

diff --git a/view/theme/redbasic/css/style.css b/view/theme/redbasic/css/style.css
index 48d93025b..ce55d60ee 100644
--- a/view/theme/redbasic/css/style.css
+++ b/view/theme/redbasic/css/style.css
@@ -925,9 +925,7 @@ a.rconnect:hover, a.rateme:hover, div.rateme:hover {
 #acl-search {
 	padding: 4px;
 	border: 1px solid #ccc;
-	width: 90%; /* fallback if browser does not support calc() */
-	width: calc(100% - 10px);
-	margin: 0px 0px 10px 10px;
+	width: 100%;
 }
 
 #acl-search::-webkit-input-placeholder {
@@ -961,16 +959,27 @@ a.rconnect:hover, a.rateme:hover, div.rateme:hover {
 }
 
 #acl-list {
-	display: block;
 	border: 1px solid #ccc;
+	-webkit-border-radius: $radiuspx ;
+	-moz-border-radius: $radiuspx;
+	border-radius: $radiuspx;
+}
+
+#acl-search-wrapper {
+	padding: 7px 10px;
+	background-color: $item_colour;
+	border-top-left-radius: $radiuspx;
+	border-top-right-radius: $radiuspx;
+	border-bottom: 1px solid #ccc;
+}
+
+#acl-list-content-wrapper {
+	display: block;
 	overflow: auto;
 	clear: both;
 	min-height: 62px;
 	padding: 10px 10px 0px 0px;
-	-webkit-border-radius: $radiuspx ;
-	-moz-border-radius: $radiuspx;
-	border-radius: $radiuspx;
-	background-color: rgb(238,238,238);
+
 }
 
 #jotnets-wrapper, #jotnets-collapse {
diff --git a/view/tpl/acl_selector.tpl b/view/tpl/acl_selector.tpl
index a3fe73d0c..75e89a0c6 100755
--- a/view/tpl/acl_selector.tpl
+++ b/view/tpl/acl_selector.tpl
@@ -34,9 +34,13 @@
 							<span id=acl-showlimited-caption>{{$showlimited}}</span>
 					    </label>
 						<div id="acl-list">
-							<input type="text" id="acl-search" placeholder="&#xf002; {{$search}}">
-							<div id=acl-showlimited-description>{{$showlimitedDesc}}</div>
-							<div id="acl-list-content"></div>
+							<div id="acl-search-wrapper">
+								<input type="text" id="acl-search" placeholder="&#xf002; {{$search}}">
+							</div>
+							<div id="acl-list-content-wrapper">
+								<div id=acl-showlimited-description>{{$showlimitedDesc}}</div>
+								<div id="acl-list-content"></div>
+							</div>
 						</div>
 					</div>