From 7d6887898a29bb7fda277e4922f54c80109be2f8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Dominik=20S=C3=BC=C3=9F?= <dominik.suess@outlook.at>
Date: Fri, 21 Oct 2016 19:03:30 +0200
Subject: [PATCH] Enhanced searchbar

---
 hledger-web/Handler/Common.hs  | 21 +++++++++++++--------
 hledger-web/static/hledger.css |  8 ++++++++
 2 files changed, 21 insertions(+), 8 deletions(-)

diff --git a/hledger-web/Handler/Common.hs b/hledger-web/Handler/Common.hs
index 1bf9c06d1..12fd2d8e5 100644
--- a/hledger-web/Handler/Common.hs
+++ b/hledger-web/Handler/Common.hs
@@ -44,11 +44,13 @@ hledgerLayout vd title content = do
 -- | Global toolbar/heading area.
 topbar :: ViewData -> HtmlUrl AppRoute
 topbar VD{..} = [hamlet|
-<div#spacer .col-md-4 .col-sm-2 .col-xs-2>
- <p .visible-xs .visible-sm>
-  <button .btn .btn-default type="button" data-toggle="offcanvas"><span class="glyphicon glyphicon-align-left">
-<div#topbar .col-md-8 .col-sm-10 .col-xs-10>
+<div#spacer .col-md-4 .col-sm-4 .col-xs-2>
+ <h1>
+  <button .visible-xs .btn .btn-default type="button" data-toggle="offcanvas">
+   <span .glyphicon .glyphicon-align-left .tgl-icon>
+<div#topbar .col-md-8 .col-sm-8 .col-xs-10>
  <h1>#{title}
+
 |]
   where
     title = takeFileName $ journalFilePath j
@@ -92,10 +94,13 @@ searchform :: ViewData -> HtmlUrl AppRoute
 searchform VD{..} = [hamlet|
 <div#searchformdiv .row>
  <form#searchform .form-inline method=GET>
-  <div .form-group .col-md-12>
-   <input .form-control name=q value=#{q} title="Enter hledger search patterns to filter the data below" placeholder="Search">
-   <button .btn .btn-default type=submit title="Apply search terms">Search
-   <button .btn .btn-default type=button data-toggle="modal" data-target="#helpmodal" title="Show search and general help">?
+  <div .form-group .col-md-12 .col-sm-12 .col-xs-12>
+    <div #searchbar .input-group>
+     <input .form-control name=q value=#{q} title="Enter hledger search patterns to filter the data below" placeholder="Search">
+     <div .input-group-btn>
+      <button .btn .btn-default type=submit title="Apply search terms">
+       <span .glyphicon .glyphicon-search>
+      <button .btn .btn-default type=button data-toggle="modal" data-target="#helpmodal" title="Show search and general help">?
 |]
  where
   filtering = not $ null q
diff --git a/hledger-web/static/hledger.css b/hledger-web/static/hledger.css
index 3b2010d46..3885ac87c 100644
--- a/hledger-web/static/hledger.css
+++ b/hledger-web/static/hledger.css
@@ -178,6 +178,14 @@ ul {
     float: left;
 }
 
+.tgl-icon {
+    font-size:large;
+}
+
+#searchbar {
+    width: 100% !important;
+}
+
 @media screen and (max-width: 768px) {
     .row-offcanvas {
         position: relative;