slaesvuo/hledger
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

web: more robust layout with wide content, style cleanups

Browse Source
This commit is contained in:
Simon Michael 2010-11-28 14:57:23 +00:00
parent e1bd767f61
commit c3c20492bf
2 changed files with 92 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

54
hledger-web/Hledger/Web/App.hs
View File

@ -414,9 +414,9 @@ filterform TD{here=here,a=a,p=p} = [$hamlet|
visible = "block" visible = "block"
filteringclass = if filtering then "filtering" else "" filteringclass = if filtering then "filtering" else ""
filteringperiodclass = if filteringperiod 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 []) 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 []) where u = (here, if filtering then [("a", a)] else [])
-- | Link to a topic in the manual. -- | Link to a topic in the manual.
@ -507,20 +507,21 @@ getJournalR = do
-- t <- liftIO $ getCurrentLocalTime -- t <- liftIO $ getCurrentLocalTime
let -- args = appArgs app let -- args = appArgs app
-- fspec' = optsToFilterSpec opts args t -- fspec' = optsToFilterSpec opts args t
br = balanceReportAsHtml opts td $ balanceReport opts fspec j sidecontent = balanceReportAsHtml opts td $ balanceReport opts fspec j
jr = journalReportAsHtml opts td $ journalReport 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} td = mktd{here=here, title="hledger journal", msg=msg, a=a, p=p, j=j, today=today}
editform' = editform td editform' = editform td
hamletToRepHtml $ pageLayout td [$hamlet| hamletToRepHtml $ pageLayout td [$hamlet|
%div#ledger %div#content
%div#accounts ^br^ %div#sidebar
^navlinks.td^ ^sidecontent^
^addform.td^ %div#main.journal
^editform'^ ^navlinks.td^
^importform^ ^addform.td^
%div#transactions.journal ^editform'^
^filterform.td^ ^importform^
^jr^ ^filterform.td^
^maincontent^
|] |]
postJournalR :: Handler RepPlain postJournalR :: Handler RepPlain
@ -538,20 +539,21 @@ getRegisterR = do
let -- args = appArgs app let -- args = appArgs app
-- opts' = Empty:opts -- opts' = Empty:opts
-- fspec' = optsToFilterSpec opts' args t -- fspec' = optsToFilterSpec opts' args t
br = balanceReportAsHtml opts td $ balanceReport opts fspec j sidecontent = balanceReportAsHtml opts td $ balanceReport opts fspec j
rr = registerReportAsHtml opts td $ registerReport 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} td = mktd{here=here, title="hledger register", msg=msg, a=a, p=p, j=j, today=today}
editform' = editform td editform' = editform td
hamletToRepHtml $ pageLayout td [$hamlet| hamletToRepHtml $ pageLayout td [$hamlet|
%div#ledger %div#content
%div#accounts ^br^ %div#sidebar
^navlinks.td^ ^sidecontent^
^addform.td^ %div#main.journal
^editform'^ ^navlinks.td^
^importform^ ^addform.td^
%div#transactions.register ^editform'^
^filterform.td^ ^importform^
^rr^ ^filterform.td^
^maincontent^
|] |]
postRegisterR :: Handler RepPlain postRegisterR :: Handler RepPlain
@ -613,13 +615,13 @@ balanceReportAsHtml _ td@TD{here=here,a=a,p=p} (items,total) = [$hamlet|
itemAsHtml' = itemAsHtml td itemAsHtml' = itemAsHtml td
itemAsHtml :: TemplateData -> BalanceReportItem -> Hamlet AppRoute itemAsHtml :: TemplateData -> BalanceReportItem -> Hamlet AppRoute
itemAsHtml TD{p=p} (acct, adisplay, adepth, abal) = [$hamlet| itemAsHtml TD{p=p} (acct, adisplay, adepth, abal) = [$hamlet|
%tr.item.$current$ %tr.item
%td.account %td.account
$indent$ $indent$
%a!href=$aurl$ $adisplay$ %a!href=$aurl$ $adisplay$
%td.balance!align=right $mixedAmountAsHtml.abal$ %td.balance!align=right $mixedAmountAsHtml.abal$
|] where |] 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) "&nbsp;" indent = preEscapedString $ concat $ replicate (2 * adepth) "&nbsp;"
aurl = printf ".?a=%s%s" (accountNameToAccountRegex acct) p' :: String aurl = printf ".?a=%s%s" (accountNameToAccountRegex acct) p' :: String
p' = if null p then "" else printf "&p=%s" p p' = if null p then "" else printf "&p=%s" p

106
hledger-web/data/static/style.css
View File

@ -1,72 +1,94 @@
/* hledger web ui styles */ /* 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 */ /* overspecified for cross-browser robustness */
body { font-family:helvetica,arial,"sans serif"; } body { font-family:helvetica,arial,"sans serif"; }
pre { font-family:courier,"courier new",monospace; } pre { font-family:courier,"courier new",monospace; }
input.textinput, .dhx_combo_input, .dhx_combo_list { font-size:small; } input.textinput, .dhx_combo_input, .dhx_combo_list { font-size:small; }
#editform textarea { font-family:courier,"courier new",monospace; font-size:small; } #editform textarea { font-family:courier,"courier new",monospace; font-size:small; }
.nav2 { font-size:small; } .nav2 { font-size:small; }
#filterform { font-size:small; } #filterform { font-size:small; }
.topleftlink { font-size:small; } .topleftlink { font-size:small; }
.toprightlink { font-size:small; } .toprightlink { font-size:small; }
#journaldesc { font-size:small; } #journaldesc { font-size:small; }
.help { font-size:smaller; } .help { font-size:smaller; }
.form { font-size:small; } .form { font-size:small; }
.journalreport { font-size:small; } .journalreport { font-size:small; }
.balancereport { font-size:small; } .balancereport { font-size:small; }
.registerreport { font-size:small; } .registerreport { font-size:small; }
#showmoreaccounts { font-size:small; } #showmoreaccounts { font-size:small; }
/* #addformlink { font-size:small; } */ /* #addformlink { font-size:small; } */
/* #editformlink { font-size:small; } */ /* #editformlink { font-size:small; } */
/*------------------------------------------------------------------------------------------*/
/* 3. layout */
body { margin:0; } body { margin:0; }
#navbar { padding:2px; } #navbar { padding:2px; }
.topleftlink { float:left; margin-right:1em; padding:2px; } .topleftlink { float:left; margin-right:1em; padding:2px; }
.toprightlink { float:right; margin-left:1em; padding:2px; } .toprightlink { float:right; margin-left:1em; padding:2px; }
#navbar h1 { display:inline-block; vertical-align:top; margin:0; } #navbar h1 { display:inline-block; vertical-align:top; margin:0; }
#journalinfo { vertical-align:middle; margin:0; } #journalinfo { vertical-align:middle; margin:0; }
/* #navbar { padding:4px; background-color:#eee; border-bottom:2px solid #ddd; } */ /* #navbar { padding:4px; border-bottom:2px solid #ddd; } */
#messages { color:red; background-color:#ffeeee; margin:0.5em;}
#messages { margin:0.5em;}
.help { font-style: italic; } .help { font-style: italic; }
.helprow td { padding-bottom:8px; } .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; } #navlinks { margin-bottom:1em; }
.navlink { } .navlink { }
.navlinkcurrent { font-weight:bold; } .navlinkcurrent { font-weight:bold; }
.form { margin:1em; } .form { margin:0em; }
#filterformdiv { margin:0 0 1em 0; white-space:nowrap; } #filterformdiv { margin:0 0 1em 0; white-space:nowrap; }
#filterform { margin:0; } #filterform { margin:0; }
#filterform span { padding:4px; } #filterform span { padding:4px; }
#stopfilterlink { font-weight:bold; } #stopfilterlink { font-weight:bold; }
.filtering { background-color:#ddd; } .filtering { font-weight:bold; }
div#floatcontainer { white-space:nowrap; } #main .journal { }
div#accounts { float:left; padding-right:1em; border-right:thin solid #eee; margin-right:1em; margin-bottom:5em; } #main .register { }
div#transactions { } /* .current { font-weight:bold; } */
div.journal { }
div.register { }
.current { font-weight:bold; background-color:#ddd; }
.description { padding-left:1em; white-space:normal; } .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; } .amount { white-space:nowrap; padding-left:1em; }
.balance { white-space:nowrap; padding-left:1em; } .balance { white-space:nowrap; padding-left:1em; }
.account, .amount, .balance { width:2em; } /* minimum width */ .account, .amount, .balance { width:2em; } /* minimum width */
.positive { } .positive { }
.negative { color:#800; }
/* .odd { background-color:#e8e8e8; } */
/* .even { background-color:#e8f8e8; } */
/* .even { background-color:#f0fff0; } */
table.journalreport { border-spacing: 0; } table.journalreport { border-spacing: 0; }
.journalreport td { border-top:thin solid #eee; } .journalreport td { border-top:thin solid #eee; }
.journalreport pre { margin-top:0; } .journalreport pre { margin-top:0; }
.balancereport tr { vertical-align:top; } .balancereport { border-spacing:0; }
table.balancereport { border-spacing:0; } .balancereport tr { vertical-align:bottom; border-spacing:0; }
.balancereport .title { white-space:nowrap; }
.balancereport .item { }
.balancereport td { padding:0; } .balancereport td { padding:0; }
.totalrule td { border-top:thin solid black; } .totalrule td { border-top:thin solid black; }
@ -75,17 +97,17 @@ table.registerreport { border-spacing:0; }
.registerreport td { padding-bottom:0.2em; } .registerreport td { padding-bottom:0.2em; }
.registerreport .date { white-space:nowrap; } .registerreport .date { white-space:nowrap; }
.firstposting td { } .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 table { }
#addform #addbuttonrow { text-align:right; } #addform #addbuttonrow { text-align:right; }
/* #editform { width:95%; } */ /* #editform { width:95%; } */
#editform textarea { width:100%; background-color:#eee; padding:4px; } #editform textarea { width:100%; padding:4px; }
#filterform table { border-spacing:0; padding-left:1em; } #filterform table { border-spacing:0; padding-left:0em; }
/*------------------------------------------------------------------------------------------*/ /*------------------------------------------------------------------------------------------*/
/* 4. dhtmlx.com auto-completing combo box styles */
.dhx_combo_input{ .dhx_combo_input{
/* color:#333333; */ /* color:#333333; */