git.plutz.net Git - invoices/blob - invoices.css

   1 * {
   2   margin: 0; padding: 0;
   3   color: inherit; background-color: inherit;
   4   font-size: medium; font-weight: normal;
   5   text-decoration: none;
   6   box-sizing: border-box;
   7 }
   8 body {
   9   color: black; background-color: white;
  10 }
  11
  12 strong {font-weight: bold;}
  13 em {text-decoration: italic;}
  14
  15 /* ==================== MENU ==================== */
  16
  17 #menu {
  18   margin: 0; padding: .5em 1em;
  19   border-bottom: 1px solid black;
  20 }
  21 #menu a {
  22   background-color: #EEF;
  23   border: 1px solid black;
  24   margin: .5em 1em .5em 0;
  25   padding: .125em .5em;
  26 }
  27 #menu a:hover {
  28   background-color: #FFF;
  29   border-color: #888;
  30 }
  31
  32
  33 /* ==================== ADDRESS LISTS ==================== */
  34
  35 .invoices .invoice,
  36 .clients .address,
  37 .senders .address {
  38   display: inline-block;
  39   background-color: #EEE;
  40   white-space: pre;
  41   padding: 1em 1em .5em 1em;
  42   margin: 1em 0 0 1em;
  43   width: 20em;
  44 }
  45 .invoices .invoice {
  46   white-space: normal;
  47 }
  48 .invoices .invoice h2{
  49   display: block;
  50   letter-spacing: .25em;
  51   text-align: center;
  52   margin-bottom: -.5em;
  53   font-size: 1.125em;
  54 }
  55 .invoices .invoice label {
  56   font-weight: bold;
  57 }
  58 .invoices .invoice label::before {
  59   white-space: pre;
  60   content: '\0A';
  61 }
  62 .invoices .invoice a,
  63 .clients .address a,
  64 .senders .address a,
  65 a.new {
  66   display: block;
  67   background-color: #DEF;
  68   text-align: center;
  69   margin: .5em 3em 0 3em;
  70   padding: .125em 1em;
  71   border: 1px solid #08F;
  72 }
  73 .invoices .invoice a:hover,
  74 .clients .address a:hover,
  75 .senders .address a:hover,
  76 a.new:hover {
  77   border-color: #8EF;
  78 }
  79 a.new {
  80   display: inline-block;
  81   margin: 1em;
  82 }
  83
  84
  85 /* ==================== ADDRESS FORMS ==================== */
  86
  87 form select,
  88 form textarea,
  89 form input {
  90   padding: .125em .5em;
  91   background-color: #FFF;
  92   text-align: left;
  93   font-size: 12pt;
  94 }
  95 form input[type=number] {
  96   width: 5em;
  97   text-align: right;
  98 }
  99
 100 .invoice form,
 101 .client form,
 102 .sender form {
 103   position: relative;
 104   display: inline-block;
 105   margin: 1em; padding: 1em;
 106   background-color: #EEE;
 107   text-align: right;
 108 }
 109 .client form textarea,
 110 .sender form textarea {
 111   display: block;
 112   min-width: 30em;
 113   min-height: 7em;
 114   margin-bottom: .5em;
 115 }
 116 .sender form textarea {
 117   min-height: 13em;
 118 }
 119 .client form label[for=hourly] {
 120   margin-right: .5em;
 121   line-height: 2em;
 122   text-align: right;
 123   font-weight: bold;
 124 }
 125 .invoice form button[type=submit],
 126 .client form button[type=submit],
 127 .sender form button[type=submit] {
 128   margin: .5em 0 0 auto;
 129   padding: .25em .5em;
 130   background-color: #DEF;
 131   border-radius: .25em;
 132   border: 1px solid #08F;
 133 }
 134 .client form button[type=submit],
 135 .sender form button[type=submit] {
 136   display: block;
 137 }
 138
 139 /* ==================== INVOICE FORMS ==================== */
 140 .invoice form select {
 141   display: inline-block;
 142   min-width: 20em;
 143   margin-bottom: .5em;
 144 }
 145
 146 .invoice form label {
 147   font-weight: bold;
 148   line-height: 2em;
 149 }
 150
 151 .invoice form input#date {
 152   margin-right: .25em;
 153 }
 154
 155 .invoice form label::before {
 156   white-space: pre;
 157   content: '\0A';
 158 }
 159 .invoice form label:first-of-type::before {
 160   content: '';
 161 }
 162
 163 .invoice form label[for=vatsb],
 164 .invoice form label[for=vatrate] {
 165   display: block;
 166   text-align: left;
 167 }
 168 .invoice form label[for=vatnett],
 169 .invoice form label[for=vatgross] {
 170   display: inline-block;
 171   float: left; margin-right: 1em;
 172   line-height: 1em;
 173 }
 174 .invoice form input[type=radio] { display: none; }
 175 .invoice form input[type=radio] + label::before {
 176   content: '(  ) ';
 177 }
 178 .invoice form input:checked + label[for^=vat]::before {
 179   content: '(x) ';
 180 }
 181
 182 .invoice form table {
 183   width: 30em;
 184   margin-top: 1em;
 185   border-spacing: 0;
 186 }
 187 .invoice form table tr > th {
 188   text-align: left;
 189   padding-left: .5em;
 190   font-weight: bold;
 191 }
 192 .invoice form table tr:last-child {
 193   font-family: monospace;
 194   white-space: pre;
 195   text-align: right;
 196 }
 197 .invoice form table tr > th:nth-child(3),
 198 .invoice form table tr > td:nth-child(4),
 199 .invoice form table tr > th:nth-child(4) {
 200   text-align: right;
 201 }
 202 .invoice form table tr > :nth-child(1) { width: 7em; }
 203 .invoice form table tr > :nth-child(2) { width: 15em; }
 204 .invoice form table tr > :nth-child(3) { width: 4em; }
 205 .invoice form table tr > :nth-child(4) { width: 4em; font-family: monospace; }
 206 .invoice form table tr > * textarea,
 207 .invoice form table tr > * input[type=number],
 208 .invoice form table tr > * input {
 209   display: block;
 210   font-size: 12pt;
 211   width: 100%; height: 100%;
 212   height: 4.625em;
 213 }