// Colours $white: white; $light-white: white; $red: a13f3e; $light-red: ffefef; $yellow: e9d543; $light-yellow: ffffd7; $green: #3f9d5a; $light-green: e9fce7; $blue: #48609d; $light-blue: ebeffd; $cyan: #99d7ff; $light-cyan: e1f7f7; $magenta: af6bd7; $light-magenta: fbefff;
.container-fluid {
padding-top: 15px;
}
colour {
a { &:before { content: ""; border: 1px solid transparent; padding:6px; display: block; border-radius: 15px; } &.colour-white:before { background: $white; } &.colour-red:before { background: $red; } &.colour-yellow:before { background: $yellow; } &.colour-green:before { background: $green; } &.colour-cyan:before { background: $cyan; } &.colour-blue:before { background: $blue; } &.colour-magenta:before { background: $magenta; } }
}
content {
thead th { padding-top: 0; } td p { margin: 0; &.small { color: #666; } } .amount, tfoot tr > * { text-align: right; } .credit .amount { &:before { content: "($"; } &:after { content: ")"; } } .debit .amount, tfoot td { &:before { content: "$"; } } tr { &.colour-white { background: $light-white; } &.colour-red { background: $light-red; } &.colour-yellow { background: $light-yellow; } &.colour-green { background: $light-green; } &.colour-blue { background: $light-blue; } &.colour-cyan { background: $light-cyan; } &.colour-magenta { background: $light-magenta; } > td, > th { background: inherit; } } tr.colour-white a.picker, li.colour-white a { background: $white; } tr.colour-red a.picker, li.colour-red a { background: $red; } tr.colour-green a.picker, li.colour-green a { background: $green; } tr.colour-blue a.picker, li.colour-blue a { background: $blue; } tr.colour-cyan a.picker, li.colour-cyan a { background: $cyan; } tr.colour-magenta a.picker, li.colour-magenta a { background: $magenta; } tr.colour-yellow a.picker, li.colour-yellow a { background: $yellow; } td.colour { width: 20px; position: relative; a { display: block; border: 1px solid #eee; border-radius: 10px; width: 20px; height: 20px; &:hover { border-color: #ddd; } } ul { list-style: none; position: absolute; display: block; right: 100%; top: 1px; margin-bottom: 0; width: 167px; text-align: right; background: white; border: 1px solid #eee; border-radius: 50px; padding: 3px; height: 28px; li { display: inline-block; margin-right: 3px; &:last-child { margin-right: 0; } } } }
}
footer {
font-size: .8em; text-align: center; padding: 20px 0;
}