reintegrate Bootstrapification

css/custom.css

@@ -0,0 +1,112 @@
+.text-align-left {
+    text-align: left !important;
+}
+
+.text-align-right {
+    text-align: right !important;
+}
+
+.text-align-center {
+    text-align: center !important;
+}
+
+.dropdown-dark {
+    background-color: #1b1b1b;
+}
+
+.dropdown-dark  li > a {
+    color: #999999;
+}
+
+.table-condensed .progress {
+    margin-bottom: 0px !important;
+}
+
+@media (min-width: 768px) {
+    body {
+        padding-top: 60px;
+        padding-bottom: 30px;
+    }
+
+    .sidebar-nav {
+        padding: 9px 0;
+        position: fixed;
+    }
+
+    .table-condensed input[type="radio"],
+    .form-horizontal input[type="radio"] {
+        vertical-align: top !important;
+    }
+
+    /*
+    form-horizontal-condensed reduces the amount of spacing between the 'rows' of the form
+    */
+    .form-horizontal-condensed .control-group {
+        margin-bottom: 5px !important;
+    }
+
+    .form-horizontal-condensed input + .help-block {
+        margin-top: 0 !important;
+        margin-bottom: 5px !important;
+    }
+
+    /*
+    form-horizontal-super-condensed removes all spacing between the 'rows' of the form
+    */
+    .form-horizontal-super-condensed .control-group {
+        margin-bottom: 0px !important;
+    }
+
+    .form-horizontal-super-condensed input[type="radio"],
+    .form-horizontal-super-condensed input[type="checkbox"] {
+        vertical-align: bottom !important;
+    }
+
+    /*
+    form-horizontal-wide gives more space to the labels
+    */
+    .form-horizontal-wide .control-label {
+        width: 250px;
+    }
+
+    .form-horizontal-wide .controls {
+        margin-left: 260px;
+    }
+
+    /*
+    form-horizontal-large gives more space for the input fields of the form
+    */
+    .form-horizontal-large .controls input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
+    .form-horizontal-large .controls textarea,
+    .form-horizontal-large .controls .input-append,
+    .form-horizontal-large .controls span[class="input uneditable-input"] {
+        width: 65.95744680851064%;
+        *width: 65.90425531914893%;
+    }
+
+    .form-horizontal-large .controls .input-append input {
+        width: 100%;
+        *width: 99.94680851063829%;
+    }
+
+    /*
+    used to force the height of the main screen so there is no overlap between the footer and the sidebar
+    */
+    .force-height{
+        min-height: 300px;
+    }
+}
+
+.row-fluid .span8 {
+    width: 65.95744680851064%;
+    *width: 65.90425531914893%;
+}
+
+.well-code {
+    margin-top: 10px;
+    padding: 10px;
+}
+
+.table-centered td {
+    vertical-align: middle;
+}

css/old.css

@@ -0,0 +1,29 @@
+#kaslogo { margin-top:2px; margin-left:0px; padding:6px; border-bottom:1px #cccccc solid; font-size:130%; vertical-align:middle; }
+#kaslogo a:link { text-decoration: none }
+#kaslogo a:visited { text-decoration: none }
+#kashead { position:absolute; right:10px; top:12px; font-family:Verdana,sans-serif; font-size:65%; vertical-align:middle; }
+#kashead input { font-size:85%; }
+#kasside { width:128px; padding:0px; border-right:1px #cccccc solid; line-height:1.33em; font-size:9.4pt; font-family:Verdana,sans-serif; }
+#kasside .vspace { margin-top:1.125em; }
+#kasside a { text-decoration:none; color:black; }
+#kasside a:hover { background-color:#ccccff }
+#kasside ul { list-style:none; padding:0px; margin:0px; }
+#kasside li { margin:0px; padding: 0px;  border-bottom:1px #cccccc solid; }
+#kasside li a { display:block; padding:3px; height:100%; width:95.5%; vertical-align:bottom;}
+.hilight { background-color:#bbbbbb; }
+#kasbody { padding:10px 10px 10px 10px; background-color:white; font-size:11pt; overflow:auto; vertical-align:top; }
+#kasbody table { border:0px; border-spacing:0px 1px; margin:0px; }
+#kasbody th { text-align: left; padding: 1px 4px 1px 4px; }
+#kasbody td { padding:1px 4px 1px 4px; }
+.msginfo  { border:1px #00ff00 solid; background-color: #ccffcc; padding:4px; margin-bottom:10px }
+.msgwarn  { border:1px #cccc00 solid; background-color: #ffffaa; padding:4px; margin-bottom:10px }
+.msgerror { border:1px #ff0000 solid; background-color: #ffcccc; padding:4px; margin-bottom:10px }
+.helpnav  { border-bottom:1px #959595 solid; padding:4px; margin-bottom:10px; font-size:13pt; }
+.helpnav a { text-decoration:none; }
+.helpnav a:hover { text-decoration:underline; }
+.tblhead { background-color: #c8c8c8; }
+.tbleven { background-color: #e0e0ff; vertical-align:middle; }
+.tblodd  { background-color: #e0ffe0; vertical-align:middle; }
+.tblunif { background-color: #e2e2e2; vertical-align:middle; }
+.code    { background-color: #e0e0f0; border: 1px #aaaaff solid; padding:4px; margin:12px; font-family: monospace; }
+#kasfoot { padding-left: 10px; padding-bottom:4px; border-top:1px #cccccc solid; font-family:Verdana,sans-serif; font-size:65%; padding-top: 3px; text-align:right; padding-right:10px; }

doc/help-bill-advanced.shtml

@@ -9,28 +9,28 @@ If you prefer to list the individual shares that people consume, instead of
 the total, you can prefix the the price with an asterisk.<br/>
 If you paid a $UNIT2.2 icecream for Woody and Buzz Lightyear, and two for Mr. Potato Head,
 you could write:
-<div class='code'>
+<div class='well well-code'>
 *2.2 ice cream: Woody, Buzz Lightyear, 2 Mr. Potato Head
 </div>
 or (using abbreviations):
-<div class='code'>
+<div class='well well-code'>
 *2.2 ice cream: woody, buzz, 2 mr. potato
 </div>
 or (using shorthands)
-<div class='code'>
+<div class='well well-code'>
 w = woody<br/>
 b = buzz<br/>
 p = mr. potato<br/>
 *2.2 ice cream: w, b, 2 p
 </div>
 or (removing optional comma's and spaces):
-<div class='code'>
+<div class='well well-code'>
 ...<br/>
 *2.2 ice cream: w b 2p
 </div>
 <br/>
 The alternative without individual prices would be:
-<div class='code'>
+<div class='well well-code'>
 ...<br/>
 8.8 ice cream: w b 2p
 </div>
@@ -39,7 +39,7 @@ The alternative without individual prices would be:
 
 Simply put, everything after a hash symbol (&#35;) is ignored, until the end of the line.
 So if you feel like explaining everything, this is possible:
-<div class='code'>
+<div class='well well-code'>
 # some Toy Story characters:<br/>
 w = woody&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;# you know, the cowboy<br/>
 b = buzz&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;# he does't fly, but falls with style<br/>
@@ -54,18 +54,18 @@ p = mr. potato&nbsp;&nbsp;&nbsp;# everything fits in his belly, even two icecrea
 It is possible to define a shorthand for a group of people, using the same syntax
 as is used for items. In the definition of these shorthands, it is allowed to
 refer to other (group) shorthands. So all these bills are identical:
-<div class='code'>
+<div class='well well-code'>
 IceCreamers = Woody, Buzz, 2 Mr. Potato<br/>
 *2.2 ice creams: IceCreamers
 </div>
-<div class='code'>
+<div class='well well-code'>
 w = Woody<br/>
 b = Buzz<br/>
 p = Mr. Potato<br/>
 IceCreamers = w b 2p<br/>
 *2.2 ice creams: IceCreamers
 </div>
-<div class='code'>
+<div class='well well-code'>
 p = mr. potato<br/>
 ToyStory = Woody, Buzz, p<br/>
 *2.2 ice creams: ToyStory, p

doc/help-bill.shtml

@@ -8,48 +8,44 @@ In what follows, its features will be introduced step-by-step.</p>
 
 To start with a very simple example, imagine you paid a $UNIT1.0 bread for &quot;Mickey Mouse&quot; (a friend of yours).
 In that case you could write:
-<div class='code'>
+<div class='well well-code'>
 1.0 bread: Mickey Mouse
 </div>
-<br/>
 It is possible to assign a single item to more than one person, by using a comma-separated list of
 names. <br/>
 In case you shared the bread with Mickey, and each ate half of it, you can write:
-<div class='code'>
+<div class='well well-code'>
 1.0 bread: Mickey Mouse, $FULLNAME
 </div>
-<br/>
 Now if he also drank a $UNIT1.5 bottle of water (and you paid for it), it becomes somewhat tedious to
 keep writing all names in full:
-<div class='code'>
+<div class='well well-code'>
 1.0 bread: Mickey Mouse, $FULLNAME<br/>
 1.5 water: Mickey Mouse
 </div>
 Therefore, it is possible to define shorthands (single words) that refer to people:
-<div class='code'>
+<div class='well well-code'>
 i = $FULLNAME<br/>
 m = Mickey Mouse<br/>
 <br/>
 1.0 bread: i, m<br/>
 1.5 water: m
 </div>
-<br/>
 If it happens that someone involved in the transaction contributes some money, you can simply
 write an at-symbol (@) followed by that amount after the name of this person. The difference in money between all items
 and all contributions is assumed to come from yourself.<br/>
 So, if it happened that Mickey did pay $UNIT1.0, you could write:
-<div class='code'>
+<div class='well well-code'>
 i = $FULLNAME<br/>
 m = Mickey Mouse @1.0<br/>
 <br/>
 1.0 bread: i, m<br/>
 1.5 water: m
 </div>
-<br/>
 If some people consumed more than others, you could just list them more than once after the item,
 but you can also write a number in front (called a multiplier). So if you ate 2/3 of the bread, and Mickey only 1/3,
 you could write:
-<div class='code'>
+<div class='well well-code'>
 i = $FULLNAME<br/>
 m = Mickey Mouse @1.0<br/>
 <br/>
@@ -62,7 +58,7 @@ m = Mickey Mouse @1.0<br/>
 In fact, it is not necessary to type the names of all people involved in the transaction.
 You can abbreviate all names or change their capitalization, as long as they remain unambiguous. If Mickey is the only
 one you know whose name starts with 'Mi', you can just type:
-<div class='code'>
+<div class='well well-code'>
 i = $FULLNAME<br/>
 m = mi @1.0<br/>
 ...
@@ -80,17 +76,16 @@ There are two simplifications allowed when using shorthands: <ul>
 <li>The space between a multiplier and a shorthand is optional</li>
 </ul>
 Therefore, it is possible to simplify the running example to:
-<div class='code'>
+<div class='well well-code'>
 i = $FULLNAME<br/>
 m = mick @1.0<br/>
 <br/>
 1.0 bread: 2i m<br/>
 1.5 water: m
 </div>
-<br/>
 Also, the name of an item is optional. If no item name is present,
 the colon after it is also optional. So you could reduce the code to:
-<div class='code'>
+<div class='well well-code'>
 i = $FULLNAME<br/>
 m = mick @1.0<br/>
 1.0 2i m<br/>
@@ -101,5 +96,5 @@ m = mick @1.0<br/>
 
 If you got here, you know more than enough to use bills. In case you are
 interested, there are a few additional features. You can read about
-them <a href="$URL(help/bill/advanced)">here</a>
+them <a href="$URL(help/bill/advanced)">here</a>.