web: more robust layout with wide content, style cleanups
This commit is contained in:
Simon Michael
parent
e1bd767f61
commit
c3c20492bf
@ -414,9 +414,9 @@ filterform TD{here=here,a=a,p=p} = [$hamlet|
|
||||
visible = "block"
|
||||
filteringclass = if filtering then "filtering" else ""
|
||||
filteringperiodclass = if filteringperiod then "filtering" else ""
|
||||
stopfiltering = if filtering then [$hamlet|%a#stopfilterlink!href=@?u@ stop filtering acct/desc|] else nulltemplate
|
||||
stopfiltering = if filtering then [$hamlet|%a#stopfilterlink!href=@?u@ clear filter|] else nulltemplate
|
||||
where u = (here, if filteringperiod then [("p", p)] else [])
|
||||
stopfilteringperiod = if filteringperiod then [$hamlet|%a#stopfilterlink!href=@?u@ stop filtering period|] else nulltemplate
|
||||
stopfilteringperiod = if filteringperiod then [$hamlet|%a#stopfilterlink!href=@?u@ clear filter|] else nulltemplate
|
||||
where u = (here, if filtering then [("a", a)] else [])
|
||||
|
||||
-- | Link to a topic in the manual.
|
||||
@ -507,20 +507,21 @@ getJournalR = do
|
||||
-- t <- liftIO $ getCurrentLocalTime
|
||||
let -- args = appArgs app
|
||||
-- fspec' = optsToFilterSpec opts args t
|
||||
br = balanceReportAsHtml opts td $ balanceReport opts fspec j
|
||||
jr = journalReportAsHtml opts td $ journalReport opts fspec j
|
||||
sidecontent = balanceReportAsHtml opts td $ balanceReport opts fspec j
|
||||
maincontent = journalReportAsHtml opts td $ journalReport opts fspec j
|
||||
td = mktd{here=here, title="hledger journal", msg=msg, a=a, p=p, j=j, today=today}
|
||||
editform' = editform td
|
||||
hamletToRepHtml $ pageLayout td [$hamlet|
|
||||
%div#ledger
|
||||
%div#accounts ^br^
|
||||
^navlinks.td^
|
||||
^addform.td^
|
||||
^editform'^
|
||||
^importform^
|
||||
%div#transactions.journal
|
||||
^filterform.td^
|
||||
^jr^
|
||||
%div#content
|
||||
%div#sidebar
|
||||
^sidecontent^
|
||||
%div#main.journal
|
||||
^navlinks.td^
|
||||
^addform.td^
|
||||
^editform'^
|
||||
^importform^
|
||||
^filterform.td^
|
||||
^maincontent^
|
||||
|]
|
||||
|
||||
postJournalR :: Handler RepPlain
|
||||
@ -538,20 +539,21 @@ getRegisterR = do
|
||||
let -- args = appArgs app
|
||||
-- opts' = Empty:opts
|
||||
-- fspec' = optsToFilterSpec opts' args t
|
||||
br = balanceReportAsHtml opts td $ balanceReport opts fspec j
|
||||
rr = registerReportAsHtml opts td $ registerReport opts fspec j
|
||||
sidecontent = balanceReportAsHtml opts td $ balanceReport opts fspec j
|
||||
maincontent = registerReportAsHtml opts td $ registerReport opts fspec j
|
||||
td = mktd{here=here, title="hledger register", msg=msg, a=a, p=p, j=j, today=today}
|
||||
editform' = editform td
|
||||
hamletToRepHtml $ pageLayout td [$hamlet|
|
||||
%div#ledger
|
||||
%div#accounts ^br^
|
||||
^navlinks.td^
|
||||
^addform.td^
|
||||
^editform'^
|
||||
^importform^
|
||||
%div#transactions.register
|
||||
^filterform.td^
|
||||
^rr^
|
||||
%div#content
|
||||
%div#sidebar
|
||||
^sidecontent^
|
||||
%div#main.journal
|
||||
^navlinks.td^
|
||||
^addform.td^
|
||||
^editform'^
|
||||
^importform^
|
||||
^filterform.td^
|
||||
^maincontent^
|
||||
|]
|
||||
|
||||
postRegisterR :: Handler RepPlain
|
||||
@ -613,13 +615,13 @@ balanceReportAsHtml _ td@TD{here=here,a=a,p=p} (items,total) = [$hamlet|
|
||||
itemAsHtml' = itemAsHtml td
|
||||
itemAsHtml :: TemplateData -> BalanceReportItem -> Hamlet AppRoute
|
||||
itemAsHtml TD{p=p} (acct, adisplay, adepth, abal) = [$hamlet|
|
||||
%tr.item.$current$
|
||||
%tr.item
|
||||
%td.account
|
||||
$indent$
|
||||
%a!href=$aurl$ $adisplay$
|
||||
%td.balance!align=right $mixedAmountAsHtml.abal$
|
||||
|] where
|
||||
current = "" -- if not (null a) && containsRegex a acct then "current" else ""
|
||||
-- current = if not (null a) && containsRegex a acct then "current" else ""
|
||||
indent = preEscapedString $ concat $ replicate (2 * adepth) " "
|
||||
aurl = printf ".?a=%s%s" (accountNameToAccountRegex acct) p' :: String
|
||||
p' = if null p then "" else printf "&p=%s" p
|
||||
|
||||
@ -1,72 +1,94 @@
|
||||
/* hledger web ui styles */
|
||||
|
||||
/* font families & sizes */
|
||||
/*------------------------------------------------------------------------------------------*/
|
||||
/* 1. colours */
|
||||
|
||||
/* green */
|
||||
body { background-color:#efe; }
|
||||
.registerreport .odd { background-color:#ded; }
|
||||
.filtering { background-color:#ded; }
|
||||
/* white */
|
||||
/* body { background-color:#fff; } */
|
||||
/* .registerreport .odd { background-color:#eee; } */
|
||||
/* .filtering { background-color:#ddd; } */
|
||||
|
||||
.negative { color:#800; }
|
||||
#messages { color:red; background-color:#fee; }
|
||||
#addform input.textinput, #addform .dhx_combo_input, .dhx_combo_list { background-color:#eee; }
|
||||
#editform textarea { background-color:#eee; }
|
||||
|
||||
/*------------------------------------------------------------------------------------------*/
|
||||
/* 2. font families & sizes */
|
||||
/* overspecified for cross-browser robustness */
|
||||
body { font-family:helvetica,arial,"sans serif"; }
|
||||
pre { font-family:courier,"courier new",monospace; }
|
||||
input.textinput, .dhx_combo_input, .dhx_combo_list { font-size:small; }
|
||||
#editform textarea { font-family:courier,"courier new",monospace; font-size:small; }
|
||||
.nav2 { font-size:small; }
|
||||
#filterform { font-size:small; }
|
||||
.topleftlink { font-size:small; }
|
||||
.toprightlink { font-size:small; }
|
||||
#journaldesc { font-size:small; }
|
||||
.help { font-size:smaller; }
|
||||
.form { font-size:small; }
|
||||
.journalreport { font-size:small; }
|
||||
.balancereport { font-size:small; }
|
||||
.registerreport { font-size:small; }
|
||||
#showmoreaccounts { font-size:small; }
|
||||
/* #addformlink { font-size:small; } */
|
||||
/* #editformlink { font-size:small; } */
|
||||
body { font-family:helvetica,arial,"sans serif"; }
|
||||
pre { font-family:courier,"courier new",monospace; }
|
||||
input.textinput, .dhx_combo_input, .dhx_combo_list { font-size:small; }
|
||||
#editform textarea { font-family:courier,"courier new",monospace; font-size:small; }
|
||||
.nav2 { font-size:small; }
|
||||
#filterform { font-size:small; }
|
||||
.topleftlink { font-size:small; }
|
||||
.toprightlink { font-size:small; }
|
||||
#journaldesc { font-size:small; }
|
||||
.help { font-size:smaller; }
|
||||
.form { font-size:small; }
|
||||
.journalreport { font-size:small; }
|
||||
.balancereport { font-size:small; }
|
||||
.registerreport { font-size:small; }
|
||||
#showmoreaccounts { font-size:small; }
|
||||
/* #addformlink { font-size:small; } */
|
||||
/* #editformlink { font-size:small; } */
|
||||
|
||||
/*------------------------------------------------------------------------------------------*/
|
||||
/* 3. layout */
|
||||
|
||||
body { margin:0; }
|
||||
|
||||
#navbar { padding:2px; }
|
||||
.topleftlink { float:left; margin-right:1em; padding:2px; }
|
||||
.toprightlink { float:right; margin-left:1em; padding:2px; }
|
||||
#navbar h1 { display:inline-block; vertical-align:top; margin:0; }
|
||||
#journalinfo { vertical-align:middle; margin:0; }
|
||||
/* #navbar { padding:4px; background-color:#eee; border-bottom:2px solid #ddd; } */
|
||||
#messages { color:red; background-color:#ffeeee; margin:0.5em;}
|
||||
/* #navbar { padding:4px; border-bottom:2px solid #ddd; } */
|
||||
|
||||
#messages { margin:0.5em;}
|
||||
.help { font-style: italic; }
|
||||
.helprow td { padding-bottom:8px; }
|
||||
#content { margin:1em; }
|
||||
|
||||
#content { padding:4px; }
|
||||
|
||||
#sidebar { float:left; padding-right:1em; margin-bottom:5em; }
|
||||
|
||||
#main { overflow:auto; border-left:thin solid #ded; padding-left:1em; }
|
||||
|
||||
#navlinks { margin-bottom:1em; }
|
||||
.navlink { }
|
||||
.navlinkcurrent { font-weight:bold; }
|
||||
.form { margin:1em; }
|
||||
.form { margin:0em; }
|
||||
|
||||
#filterformdiv { margin:0 0 1em 0; white-space:nowrap; }
|
||||
#filterform { margin:0; }
|
||||
#filterform span { padding:4px; }
|
||||
#stopfilterlink { font-weight:bold; }
|
||||
.filtering { background-color:#ddd; }
|
||||
.filtering { font-weight:bold; }
|
||||
|
||||
div#floatcontainer { white-space:nowrap; }
|
||||
div#accounts { float:left; padding-right:1em; border-right:thin solid #eee; margin-right:1em; margin-bottom:5em; }
|
||||
div#transactions { }
|
||||
|
||||
div.journal { }
|
||||
div.register { }
|
||||
|
||||
.current { font-weight:bold; background-color:#ddd; }
|
||||
#main .journal { }
|
||||
#main .register { }
|
||||
/* .current { font-weight:bold; } */
|
||||
.description { padding-left:1em; white-space:normal; }
|
||||
.account { white-space:nowrap; padding-left:1em; }
|
||||
#transactions .account { white-space:nowrap; padding-left:1em; }
|
||||
.amount { white-space:nowrap; padding-left:1em; }
|
||||
.balance { white-space:nowrap; padding-left:1em; }
|
||||
.account, .amount, .balance { width:2em; } /* minimum width */
|
||||
.positive { }
|
||||
.negative { color:#800; }
|
||||
/* .odd { background-color:#e8e8e8; } */
|
||||
/* .even { background-color:#e8f8e8; } */
|
||||
/* .even { background-color:#f0fff0; } */
|
||||
|
||||
table.journalreport { border-spacing: 0; }
|
||||
.journalreport td { border-top:thin solid #eee; }
|
||||
.journalreport pre { margin-top:0; }
|
||||
|
||||
.balancereport tr { vertical-align:top; }
|
||||
table.balancereport { border-spacing:0; }
|
||||
.balancereport { border-spacing:0; }
|
||||
.balancereport tr { vertical-align:bottom; border-spacing:0; }
|
||||
.balancereport .title { white-space:nowrap; }
|
||||
.balancereport .item { }
|
||||
.balancereport td { padding:0; }
|
||||
.totalrule td { border-top:thin solid black; }
|
||||
|
||||
@ -75,17 +97,17 @@ table.registerreport { border-spacing:0; }
|
||||
.registerreport td { padding-bottom:0.2em; }
|
||||
.registerreport .date { white-space:nowrap; }
|
||||
.firstposting td { }
|
||||
.registerreport .odd { background-color:#f0f0f0; }
|
||||
|
||||
#addform input.textinput, #addform .dhx_combo_input, .dhx_combo_list { background-color:#eee; padding:4px; }
|
||||
#addform input.textinput, #addform .dhx_combo_input, .dhx_combo_list { padding:4px; }
|
||||
#addform table { }
|
||||
#addform #addbuttonrow { text-align:right; }
|
||||
/* #editform { width:95%; } */
|
||||
#editform textarea { width:100%; background-color:#eee; padding:4px; }
|
||||
#filterform table { border-spacing:0; padding-left:1em; }
|
||||
#editform textarea { width:100%; padding:4px; }
|
||||
#filterform table { border-spacing:0; padding-left:0em; }
|
||||
|
||||
|
||||
/*------------------------------------------------------------------------------------------*/
|
||||
/* 4. dhtmlx.com auto-completing combo box styles */
|
||||
|
||||
.dhx_combo_input{
|
||||
/* color:#333333; */
|
||||
|
||||
Loading…
Reference in New Issue
Block a user