hledger/hledger-web/static/hledger.css
Simon Michael ec51d28839 web: a bunch of ui cleanup & improvement
- the web UI has been streamlined; edit form, raw & entries views dropped
- we now remember whether sidebar is open or closed
- better help dialog
- keyboard shortcuts are now available
- better add form
- more bootstrap styling
- static file cleanups
- report filtering fixes
- upgrade jquery to 2.1.1, bootstrap to 3.1.1, drop select2, add typeahead, cookie, hotkeys
- clarify debug helpers a little
- refactoring
2014-06-13 00:19:00 +01:00

262 lines
9.8 KiB
CSS

/* hledger web ui styles */
/*------------------------------------------------------------------------------------------*/
/* 1. colours */
/* green */
body { background-color:white; color:black; }
.registerreport .odd { background-color:#ded; }
/* .transactionsreport .odd { background-color:#eee; } */
.filtering { background-color:#e0e0e0; }
a:link, a:visited { color:#00e; }
/* a:link:hover, a:visited:hover { color:red; } */
/* #main { border-color:#e0e0e0; } see below */
/* .journalreport td { border-color:thin solid #e0e0e0; } see below */
/* white */
/* body { background-color:#fff; } */
/* .registerreport .odd { background-color:#eee; } */
/* .filtering { background-color:#ddd; } */
/* #main { border-color:#eee; } see below */
/* .journalreport td { border-color:thin solid #eee; } see below */
#message { color:red; background-color:#fee; }
/* #addform input.textinput, #addform .dhx_combo_input, .dhx_combo_list { /\*background-color:#eee;*\/ } */
#editform textarea { background-color:#eee; }
.negative { color:#800; }
.help { }
#sidebar .hoverlinks { visibility:hidden; }
/* #sidebar .mouseover { background-color:rgba(208,208,208,0.5); } */
#sidebar .mouseover .hoverlinks { visibility:visible; }
#sidebar .balancereport .hoverlinks { margin-left:0em; font-weight:normal; /*font-size:smaller;*/ display:inline-block; text-align:right; }
#sidebar .balancereport .hoverlinks a { margin-left:0.5em; }
/* #sidebar .notinacct, .notinacct :link, .notinacct :visited { color:#888; } */
#sidebar .notinacct .negative { color:#b77; }
#sidebar .balancereport .inacct { font-weight:bold; }
/* #sidebar .balancereport .inacct { background-color:#e0e0e0; } */
#sidebar .balancereport .numpostings { padding-left:1em; color:#aaa; }
#sidebar .current { font-weight:bold; }
/*------------------------------------------------------------------------------------------*/
/* 2. font families & sizes */
/* overspecified for cross-browser robustness */
body { font-size:16px; }
/*
body { font-family:helvetica,arial,sans-serif; }
pre { font-family:courier,"courier new",monospace; }
.dhx_combo_input, .dhx_combo_list { font-size:small; }
#editform textarea { font-family:courier,"courier new",monospace; font-size:small; }
.nav2 { font-size:small; }
#searchform { font-size:small; }
.topleftlink { font-size:small; }
.toprightlink { font-size:small; }
#journaldesc { font-size:small; }
.togglelink { font-size:smaller; white-space:nowrap }
.help { font-size:smaller; }
.form { font-size:small; }
.transactionsreport { font-size:small; }
.entriesreport { font-size:small; }
.balancereport { font-size:small; }
.registerreport { font-size:small; }
.showall { font-size:small; }
*/
/* #addformlink { font-size:small; } */
/* #editformlink { font-size:small; } */
/*
#contenttitle { font-size:1.2em; }
*/
/*------------------------------------------------------------------------------------------*/
/* 3. layout */
body { margin:0; }
#topbar { padding:2px; }
.topleftlink { float:left; margin-right:1em; padding:2px; }
.toprightlink { float:right; margin-left:1em; padding:2px; }
#topbar h1 { display:inline-block; vertical-align:top; margin:0; }
#journalinfo { vertical-align:middle; margin:0; }
/* #topbar { padding:4px; border-bottom:2px solid #ddd; } */
#message { margin:0.5em;}
.help { font-style: italic; }
.helprow td { padding-bottom:8px; }
#outermain { overflow:auto; }
#main { overflow:auto; padding-left:1em; }
#sidebar {
float:left;
padding-right:1em;
border-right:thin solid #e0e0e0;
margin-bottom:5em;
}
/* #sidebar.affix { */
/* position: fixed; */
/* top: 20px; */
/* } */
.balancereport .item { border-top:thin solid #e0e0e0; }
#navlinks { margin-bottom:1em; }
.navlink { }
.navlinkcurrent { font-weight:bold; }
.form { margin:0em; }
#searchformdiv { margin:0 0 1em 0; }
#searchform { margin:0; }
#searchform span { padding:4px; }
#stopfilterlink { font-weight:bold; }
.filtering { font-weight:bold; }
#main .journal { }
#main .register { }
.current { font-weight:bold; }
.date { padding-left:0em; }
.description { padding-left:1em; white-space:normal; }
.account { padding-left:1em; white-space:normal; }
.amount { padding-left:1em; white-space:nowrap; }
.balance { padding-left:1em; padding-right:0.3em; white-space:nowrap; }
.amount, .balance { width:2em; } /* minimise width */
.positive { }
/* table.transactionsreport { border-spacing: 0; } */
/* .transactionsreport td { } */
/* .transactionsreport pre { margin-top:0; } */
/* table.entriesreport { border-spacing: 0; } */
/* .entriesreport td { } */
/* .entriesreport pre { margin-top:0; } */
.balancereport { border-spacing:0; }
.balancereport tr { vertical-align:bottom; border-spacing:0; }
.balancereport .title { white-space:nowrap; }
.balancereport .item { }
/* .balancereport .depth0 { padding-top:1em; } */
.balancereport td { padding:0; }
.totalrule td { border-top:thin solid black; }
.balancereport .account { white-space:nowrap; }
.hidden { display:none; }
table.registerreport { border-spacing:0; }
table.registerreport tr { vertical-align:top; }
table.registerreport td { padding-bottom:0.2em; }
table.registerreport .date { white-space:nowrap; }
table.registerreport tr.posting { font-size:smaller; }
table.registerreport tr.posting .account { padding-left:1.5em; }
table.registerreport tr.posting .amount { padding-right:0.5em; }
tr.firstposting td { }
/* tr.newday td { border-top: 1px solid #797; } */
/* tr.newday .date { font-weight:bold; } */
/* tr.newmonth td { border-top: 2px solid #464; } */
/* tr.newyear td { border-top: 3px solid black; } */
#accountsheading { white-space:nowrap; }
#addform {
/* margin:0 0 2em; */
/* padding:.5em 0; */
/* border-top:thin solid #e0e0e0; */
/* border-bottom:thin solid #e0e0e0; */
}
#addform tr {
vertical-align:top;
}
/* #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%; padding:4px; }
/* #searchform table { border-spacing:0; padding-left:0em; } */
::-moz-placeholder {
font-style:italic;
}
:-moz-placeholder {
font-style:italic;
}
::-webkit-input-placeholder {
font-style:italic;
}
:-ms-input-placeholder {
font-style:italic;
}
/*------------------------------------------------------------------------------------------*/
/* 4. typeahead styles */
/*
.typeahead,
.tt-query,
.tt-hint {
width: 396px;
height: 30px;
padding: 8px 12px;
font-size: 24px;
line-height: 30px;
border: 2px solid #ccc;
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
outline: none;
}
.typeahead {
background-color: #fff;
}
.typeahead:focus {
border: 2px solid #0097cf;
}
.tt-query {
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}
*/
.tt-hint {
color: #bbb;
}
.tt-dropdown-menu {
padding: 8px 0;
background-color: #fff;
border: 1px solid #ccc;
border: 1px solid rgba(0, 0, 0, 0.2);
-webkit-border-radius: 8px;
-moz-border-radius: 8px;
border-radius: 8px;
-webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
-moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
box-shadow: 0 5px 10px rgba(0,0,0,.2);
overflow:auto;
max-height:300px;
}
.tt-suggestions {
}
.tt-suggestion {
padding: 3px 20px;
font-size: 18px;
line-height: 24px;
}
.tt-suggestion.tt-cursor {
color: #fff;
background-color: #0097cf;
}
.tt-suggestion p {
margin: 0;
}
.twitter-typeahead {
width:100%;
}