web: move sidebar links out of balanceReportAsHtml

hledger-web/Handler/Common.hs

@@ -48,7 +48,31 @@ $maybe m' <- msg
 
 -- | The sidebar used on most views.
 sidebar :: ViewData -> HtmlUrl AppRoute
-sidebar vd@VD{..} = balanceReportAsHtml opts vd $ balanceReport (reportopts_ $ cliopts_ opts){empty_=True} am j
+sidebar vd@VD{..} =
+ [hamlet|
+ <a#sidebar-toggle-link.togglelink href="#" title="Toggle sidebar">[+]
+
+ <div#sidebar-content>
+  <p style="margin-top:1em;">
+   <a href=@{RegisterR} title="Show current register">Register
+
+  <p style="margin-top:1em;">
+   <a href=@{JournalR} title="Show all transactions in journal format">Journal
+   <span.hoverlinks>
+    &nbsp;
+    <a href=@{JournalEntriesR} title="Show journal entries">entries
+    &nbsp;
+    <a#editformlink href="#" onclick="return editformToggle(event)" title="Edit the journal">
+     edit
+
+  <p style="margin-top:1em;">
+   <a#addformlink href="#" onclick="return addformToggle(event)" title="Add a new transaction to the journal" style="margin-top:1em;">Add a transaction..
+
+  <div#accounts>
+   ^{accounts}
+|]
+ where
+  accounts = balanceReportAsHtml opts vd $ balanceReport (reportopts_ $ cliopts_ opts){empty_=True} am j
 
 -- -- | Navigation link, preserving parameters and possibly highlighted.
 -- navlink :: ViewData -> String -> AppRoute -> String -> HtmlUrl AppRoute
@@ -285,35 +309,11 @@ nulltemplate = [hamlet||]
 ----------------------------------------------------------------------
 -- hledger report renderers
 
--- | Render an "BalanceReport" as html.
+-- | Render a "BalanceReport" as html.
 balanceReportAsHtml :: WebOpts -> ViewData -> BalanceReport -> HtmlUrl AppRoute
 balanceReportAsHtml _ vd@VD{..} (items',total) =
  [hamlet|
-<div#accountsheading>
- <a#accounts-toggle-link.togglelink href="#" title="Toggle sidebar">[+]
-<div#accounts>
  <table.balancereport>
-  <tr.item :allaccts:.inacct>
-   <td.register colspan=3>
-    <br>
-    <a href=@{RegisterR} title="Show current register">Register
-
-  <tr.item :allaccts:.inacct>
-   <td.journal colspan=3>
-    <br>
-    <a href=@{JournalR} title="Show all transactions in journal format">Journal
-    <span.hoverlinks>
-     &nbsp;
-     <a href=@{JournalEntriesR} title="Show journal entries">entries
-     &nbsp;
-     <a#editformlink href="#" onclick="return editformToggle(event)" title="Edit the journal">
-      edit
-
-  <tr>
-   <td.add colspan=3>
-    <br>
-    <a#addformlink href="#" onclick="return addformToggle(event)" title="Add a new transaction to the journal">Add a transaction..
-
   <tr>
    <td colspan=3>
     <br>

hledger-web/static/hledger.js

@@ -9,12 +9,12 @@ $(document).ready(function() {
     if ($.url.param('accounts')=='0') $('#accounts').hide();
 
     /* set up sidebar account mouse-over handlers */
-    $('.balancereport td a').mouseenter(function(){ $(this).parent().addClass('mouseover'); });
+    $('#sidebar p a').mouseenter(function(){ $(this).parent().addClass('mouseover'); });
-    $('.balancereport td').mouseleave(function(){ $(this).removeClass('mouseover'); });
+    $('#sidebar p').mouseleave(function(){ $(this).removeClass('mouseover'); });
 
     /* set up various show/hide toggles */
     $('#search-help-link').click(function() { $('#search-help').slideToggle('fast'); event.preventDefault(); });
-    $('#accounts-toggle-link').click(function() { $('#accounts').slideToggle('fast'); event.preventDefault(); });
+    $('#sidebar-toggle-link').click(function() { $('#sidebar-content').slideToggle('fast'); event.preventDefault(); });
     $('#all-postings-toggle-link').click(function() { $('.posting').toggle(); event.preventDefault(); });
     $('.postings-toggle-link').click(function() { $(this).parent().parent().nextUntil(':not(.posting)').toggle(); event.preventDefault(); });
 

hledger-web/static/style.css

@@ -24,18 +24,16 @@ body                                                                 { backgroun
 .negative                                                            { color:#800; }
 .help                                                                {  }
 
-.balancereport .inacct                                               { /*background-color:#ddd;*/ font-weight:bold; }
+#sidebar .hoverlinks { visibility:hidden; }
-.notinacct, .notinacct :link, .notinacct :visited { color:#888; }
+#sidebar .mouseover { background-color:rgba(208,208,208,0.5); }
-.notinacct .negative { color:#b77; }
+#sidebar .mouseover .hoverlinks { visibility:visible; }
-.balancereport .numpostings                                          { padding-left:1em; color:#aaa; }
+
-.balancereport td.add.mouseover { background-color:rgba(208,208,208,0.5); }
+#sidebar .balancereport .hoverlinks { margin-left:0em; font-weight:normal; /*font-size:smaller;*/ display:inline-block; text-align:right; }
-.balancereport td.journal.mouseover { background-color:rgba(208,208,208,0.5); }
+#sidebar .balancereport .hoverlinks a { margin-left:0.5em; }
-.balancereport td.journal.mouseover .hoverlinks { visibility:visible; }
+#sidebar .notinacct, .notinacct :link, .notinacct :visited { color:#888; }
-.balancereport td.account.mouseover { background-color:rgba(208,208,208,0.5); }
+#sidebar .notinacct .negative { color:#b77; }
-.balancereport td.account.mouseover .hoverlinks { visibility:visible; }
+#sidebar .balancereport .inacct                                               { /*background-color:#ddd;*/ font-weight:bold; }
-.balancereport .hoverlinks { visibility:hidden; }
+#sidebar .balancereport .numpostings                                          { padding-left:1em; color:#aaa; }
-.balancereport .hoverlinks { margin-left:0em; font-weight:normal; /*font-size:smaller;*/ display:inline-block; text-align:right; }
-.balancereport .hoverlinks a { margin-left:0.5em; }
 
 /*------------------------------------------------------------------------------------------*/
 /* 2. font families & sizes */