Upgraded to rails 3.1.8. Fixed various bugs in wiki.

app/assets/javascripts/application.js

@@ -0,0 +1,112 @@
+//= require jquery
+//= require jquery-ui
+//= require jquery_ujs
+//= require jquery.tokeninput
+//= require jquery.observe_field
+//= require jquery.fancybox-1.3.4.pack
+//= require rails.validations
+//= require_self
+//= require ordering
+
+// Load following statements, when DOM is ready
+$(function() {
+
+    // Show/Hide a specific DOM element
+    $('a[data-toggle-this]').live('click', function() {
+        $($(this).data('toggle-this')).toggle();
+        return false;
+    });
+
+    // Remove this item from DOM
+    $('a[data-remove-this]').live('click', function() {
+        $($(this).data('remove-this')).remove();
+        return false;
+    });
+
+    // Check/Uncheck a single checkbox
+    $('[data-check-this]').live('click', function() {
+        var checkbox = $($(this).data('check-this'));
+        checkbox.attr('checked', !checkbox.is(':checked'));
+        highlightRow(checkbox);
+        return false;
+    });
+
+    // Check/Uncheck all checkboxes for a specific form
+    $('input[data-check-all]').live('click', function() {
+        var status = $(this).is(':checked')
+        $($(this).data('check-all')).find('input[type="checkbox"]').each(function() {
+            $(this).attr('checked', status);
+            highlightRow($(this));
+        });
+    });
+
+    // Submit form when changing a select menu.
+    $('form[data-submit-onchange] select').live('change', function() {
+        var confirmMessage = $(this).children(':selected').data('confirm');
+        if (confirmMessage && confirm(confirmMessage)) {
+            $(this).parents('form').submit();
+        } else {
+            $(this).parents('form').submit();
+        }
+        return false;
+    });
+
+    // Submit form when changing text of an input field
+    // Use jquery observe_field plugin
+    $('form[data-submit-onchange] input[type=text]').each(function() {
+        $(this).observe_field(1, function() {
+            $(this).parents('form').submit();
+        });
+    });
+
+    // Submit form when clicking on checkbox
+    $('form[data-submit-onchange] input[type=checkbox]:not(input[data-ignore-onchange])').click(function() {
+        $(this).parents('form').submit();
+    });
+
+    $('[data-redirect-to]').bind('change', function() {
+        var newLocation = $(this).children(':selected').val();
+        if (newLocation != "") {
+            document.location.href = newLocation;
+        }
+    });
+
+    // Remote paginations
+    $('div.pagination[data-remote] a').live('click', function() {
+        $.getScript($(this).attr('href'));
+        return false;
+    });
+
+    // Show and hide loader on ajax callbacks
+    $('*[data-remote]').bind('ajax:beforeSend', function() {
+        $('#loader').show();
+    });
+
+    $('*[data-remote]').bind('ajax:complete', function() {
+        $('#loader').hide();
+    });
+
+    // Disable submit button on ajax forms
+    $('form[data-remote]').bind('ajax:beforeSend', function() {
+        $(this).children('input[type="submit"]').attr('disabled', 'disabled');
+    });
+});
+
+
+// gives the row an yellow background
+function highlightRow(checkbox) {
+    var row = checkbox.parents('tr');
+    if (checkbox.is(':checked')) {
+        row.addClass('selected');
+    } else {
+        row.removeClass('selected');
+    }
+
+}
+
+// Use with auto_complete to set a unique id,
+// e.g. when the user selects a (may not unique) name
+// There must be a hidden field with the id 'hidden_field'
+function setHiddenId(text, li) {
+  $('hidden_id').value = li.id;
+}

app/assets/javascripts/ordering.js

@@ -0,0 +1,187 @@
+// JavaScript that handles the dynamic ordering quantities on the ordering page.
+//
+// In a JavaScript block on the actual view, define the article data by calls to setData().
+// You should also set the available group balance through setGroupBalance(amount).
+//
+// Call setDecimalSeparator(char) to overwrite the default character "." with a localized value.
+
+var modified = false    		// indicates if anything has been clicked on this page
+var groupBalance = 0;			// available group money
+var decimalSeparator = ".";		// default decimal separator
+var toleranceIsCostly = true;   // default tolerance behaviour
+var isStockit = false;          // Wheter the order is from stock oder normal supplier
+
+// Article data arrays:
+var price = new Array();
+var unit = new Array();  		// items per order unit
+var itemTotal = new Array();    // total item price
+var quantityOthers = new Array();
+var toleranceOthers = new Array();
+var itemsAllocated = new Array();  // how many items the group has been allocated and should definitely get
+var quantityAvailable = new Array();  // stock_order. how many items are currently in stock
+
+function setDecimalSeparator(character) {
+    decimalSeparator = character;
+}
+
+function setToleranceBehaviour(value) {
+    toleranceIsCostly = value;
+}
+
+function setStockit(value) {
+    isStockit = value;
+}
+
+function setGroupBalance(amount) {
+    groupBalance = amount;
+}
+
+function addData(orderArticleId, itemPrice, itemUnit, itemSubtotal, itemQuantityOthers, itemToleranceOthers, allocated, available) {
+    var i = orderArticleId;
+    price[i] = itemPrice;
+    unit[i] = itemUnit;
+    itemTotal[i] = itemSubtotal;
+    quantityOthers[i] = itemQuantityOthers;
+    toleranceOthers[i] = itemToleranceOthers;
+    itemsAllocated[i] = allocated;
+    quantityAvailable[i] = available;
+}
+
+function increaseQuantity(item) {
+    var value = Number($('#q_' + item).val()) + 1;
+    if (!isStockit || (value <= (quantityAvailable[item] - quantityOthers[item]))) {
+        update(item, value, $('#t_' + item).val());
+    }
+}
+
+function decreaseQuantity(item) {
+    var value = Number($('#q_' + item).val()) - 1;
+    if (value >= 0) {
+        update(item, value, $('#t_' + item).val());
+    }
+}
+
+function increaseTolerance(item) {
+    var value = Number($('#t_' + item).val()) + 1;
+    update(item, $('#q_' + item).val(), value);
+}
+
+function decreaseTolerance(item) {
+    var value = Number($('#t_' + item).val()) - 1;
+    if (value >= 0) {
+        update(item, $('#q_' + item).val(), value);
+    }
+}
+
+function update(item, quantity, tolerance) {
+    // set modification flag
+    modified = true
+
+    // update hidden input fields
+    $('#q_' + item).val(quantity);
+    $('#t_' + item).val(tolerance);
+
+    // calculate how many units would be ordered in total
+    var units = calcUnits(unit[item], quantityOthers[item] + Number(quantity), toleranceOthers[item] + Number(tolerance));
+    if (unitCompletedFromTolerance(unit[item], quantityOthers[item] + Number(quantity), toleranceOthers[item] + Number(tolerance))) {
+        $('#units_' + item).html('<span style=\"color:grey\">' + String(units) + '</span>');
+    } else {
+        $('#units_' + item).html(String(units));
+    }
+
+    // update used/unused quantity
+    var available = Math.max(0, units * unit[item] - quantityOthers[item]);
+    var q_used = Math.min(available, quantity);
+    // ensure that at least the amout of items this group has already been allocated is used
+    if (quantity >= itemsAllocated[item] && q_used < itemsAllocated[item]) {
+        q_used = itemsAllocated[item];
+    }
+    $('#q_used_' + item).html(String(q_used));
+    $('#q_unused_' + item).html(String(quantity - q_used));
+    $('#q_total_' + item).html(String(Number(quantity) + quantityOthers[item]));
+
+    // update used/unused tolerance
+    if (unit[item] > 1) {
+        available = Math.max(0, available - q_used - toleranceOthers[item]);
+        t_used = Math.min(available, tolerance);
+        $('#t_used_' + item).html(String(t_used));
+        $('#t_unused_' + item).html(String(tolerance - t_used));
+        $('#t_total_' + item).html(String(Number(tolerance) + toleranceOthers[item]));
+    }
+
+    // update total price
+    if(toleranceIsCostly == true) {
+        itemTotal[item] = price[item] * (Number(quantity) + Number(tolerance));
+    } else {
+        itemTotal[item] = price[item] * (Number(quantity));
+    }
+    $('#price_' + item + '_display').html(asMoney(itemTotal[item]));
+
+    // update missing units
+    var missing_units = unit[item] - (((quantityOthers[item] + Number(quantity)) % unit[item]) + Number(tolerance) + toleranceOthers[item])
+    if (missing_units < 0) {
+        missing_units = 0;
+    }
+    $('#missing_units_' + item).html(String(missing_units));
+
+    // update balance
+    updateBalance();
+}
+
+function asMoney(amount) {
+    return String(amount.toFixed(2)).replace(/\./, ",");
+}
+
+function calcUnits(unitSize, quantity, tolerance) {
+    var units = Math.floor(quantity / unitSize)
+    var remainder = quantity % unitSize
+    return units + ((remainder > 0) && (remainder + tolerance >= unitSize) ? 1 : 0)
+}
+
+function unitCompletedFromTolerance(unitSize, quantity, tolerance) {
+    var remainder = quantity % unitSize
+    return (remainder > 0 && (remainder + tolerance >= unitSize));
+}
+
+function updateBalance() {
+    // update total price and order balance
+    var total = 0;
+    for (i in itemTotal) {
+        total += itemTotal[i];
+    }
+    $('#total_price').html(asMoney(total));
+    var balance = groupBalance - total;
+    $('#new_balance').html(asMoney(balance));
+    $('#total_balance').val(asMoney(balance));
+    // determine bgcolor and submit button state according to balance
+    var bgcolor = '';
+    if (balance < 0) {
+        bgcolor = '#FF0000';
+        $('#submit_button').disabled = true;
+    } else {
+        $('#submit_button').disabled = false;
+    }
+    // update bgcolor
+    for (i in itemTotal) {
+        $('#ltd_price_' + i).css('background-color', bgcolor);
+    }
+}
+
+$(function() {
+    $('input[data-increase_quantity]').click(function() {
+        increaseQuantity($(this).data('increase_quantity'));
+    });
+    $('input[data-decrease_quantity]').click(function() {
+        decreaseQuantity($(this).data('decrease_quantity'));
+    });
+    $('input[data-increase_tolerance]').click(function() {
+        increaseTolerance($(this).data('increase_tolerance'));
+    });
+    $('input[data-decrease_tolerance]').click(function() {
+        decreaseTolerance($(this).data('decrease_tolerance'));
+    });
+
+    $('a[data-confirm_switch_order]').click(function() {
+        return (!modified || confirm('Änderungen an dieser Bestellung gehen verloren, wenn zu einer anderen Bestellung gewechselt wird. Möchtest Du trotzdem wechseln?'));
+    });
+});

app/assets/stylesheets/application.css

@@ -0,0 +1,8 @@
+/*
+*= require main
+*= require rails_messages
+*= require nav
+*= require simple_form
+*= require token-input
+*= require jquery.fancybox-1.3.4
+*/

app/assets/stylesheets/ie_hacks.css

@@ -0,0 +1,8 @@
+#nav {
+  text-align: left; }
+  #nav ul {
+    margin: 0; }
+    #nav ul li.current a:hover {
+      color: white; }
+    #nav ul li.current ul {
+      width: 100%; }

app/assets/stylesheets/jquery.fancybox-1.3.4.css

@@ -0,0 +1,359 @@
+/*
+ * FancyBox - jQuery Plugin
+ * Simple and fancy lightbox alternative
+ *
+ * Examples and documentation at: http://fancybox.net
+ * 
+ * Copyright (c) 2008 - 2010 Janis Skarnelis
+ * That said, it is hardly a one-person project. Many people have submitted bugs, code, and offered their advice freely. Their support is greatly appreciated.
+ * 
+ * Version: 1.3.4 (11/11/2010)
+ * Requires: jQuery v1.3+
+ *
+ * Dual licensed under the MIT and GPL licenses:
+ *   http://www.opensource.org/licenses/mit-license.php
+ *   http://www.gnu.org/licenses/gpl.html
+ */
+
+#fancybox-loading {
+	position: fixed;
+	top: 50%;
+	left: 50%;
+	width: 40px;
+	height: 40px;
+	margin-top: -20px;
+	margin-left: -20px;
+	cursor: pointer;
+	overflow: hidden;
+	z-index: 1104;
+	display: none;
+}
+
+#fancybox-loading div {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 40px;
+	height: 480px;
+	background-image: url('fancybox/fancybox.png');
+}
+
+#fancybox-overlay {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	z-index: 1100;
+	display: none;
+}
+
+#fancybox-tmp {
+	padding: 0;
+	margin: 0;
+	border: 0;
+	overflow: auto;
+	display: none;
+}
+
+#fancybox-wrap {
+	position: absolute;
+	top: 0;
+	left: 0;
+	padding: 20px;
+	z-index: 1101;
+	outline: none;
+	display: none;
+}
+
+#fancybox-outer {
+	position: relative;
+	width: 100%;
+	height: 100%;
+	background: #fff;
+}
+
+#fancybox-content {
+	width: 0;
+	height: 0;
+	padding: 0;
+	outline: none;
+	position: relative;
+	overflow: hidden;
+	z-index: 1102;
+	border: 0px solid #fff;
+}
+
+#fancybox-hide-sel-frame {
+	position: absolute;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+	background: transparent;
+	z-index: 1101;
+}
+
+#fancybox-close {
+	position: absolute;
+	top: -15px;
+	right: -15px;
+	width: 30px;
+	height: 30px;
+	background: transparent url('fancybox/fancybox.png') -40px 0px;
+	cursor: pointer;
+	z-index: 1103;
+	display: none;
+}
+
+#fancybox-error {
+	color: #444;
+	font: normal 12px/20px Arial;
+	padding: 14px;
+	margin: 0;
+}
+
+#fancybox-img {
+	width: 100%;
+	height: 100%;
+	padding: 0;
+	margin: 0;
+	border: none;
+	outline: none;
+	line-height: 0;
+	vertical-align: top;
+}
+
+#fancybox-frame {
+	width: 100%;
+	height: 100%;
+	border: none;
+	display: block;
+}
+
+#fancybox-left, #fancybox-right {
+	position: absolute;
+	bottom: 0px;
+	height: 100%;
+	width: 35%;
+	cursor: pointer;
+	outline: none;
+	background: transparent url('fancybox/blank.gif');
+	z-index: 1102;
+	display: none;
+}
+
+#fancybox-left {
+	left: 0px;
+}
+
+#fancybox-right {
+	right: 0px;
+}
+
+#fancybox-left-ico, #fancybox-right-ico {
+	position: absolute;
+	top: 50%;
+	left: -9999px;
+	width: 30px;
+	height: 30px;
+	margin-top: -15px;
+	cursor: pointer;
+	z-index: 1102;
+	display: block;
+}
+
+#fancybox-left-ico {
+	background-image: url('fancybox/fancybox.png');
+	background-position: -40px -30px;
+}
+
+#fancybox-right-ico {
+	background-image: url('fancybox/fancybox.png');
+	background-position: -40px -60px;
+}
+
+#fancybox-left:hover, #fancybox-right:hover {
+	visibility: visible; /* IE6 */
+}
+
+#fancybox-left:hover span {
+	left: 20px;
+}
+
+#fancybox-right:hover span {
+	left: auto;
+	right: 20px;
+}
+
+.fancybox-bg {
+	position: absolute;
+	padding: 0;
+	margin: 0;
+	border: 0;
+	width: 20px;
+	height: 20px;
+	z-index: 1001;
+}
+
+#fancybox-bg-n {
+	top: -20px;
+	left: 0;
+	width: 100%;
+	background-image: url('fancybox/fancybox-x.png');
+}
+
+#fancybox-bg-ne {
+	top: -20px;
+	right: -20px;
+	background-image: url('fancybox/fancybox.png');
+	background-position: -40px -162px;
+}
+
+#fancybox-bg-e {
+	top: 0;
+	right: -20px;
+	height: 100%;
+	background-image: url('fancybox/fancybox-y.png');
+	background-position: -20px 0px;
+}
+
+#fancybox-bg-se {
+	bottom: -20px;
+	right: -20px;
+	background-image: url('fancybox/fancybox.png');
+	background-position: -40px -182px; 
+}
+
+#fancybox-bg-s {
+	bottom: -20px;
+	left: 0;
+	width: 100%;
+	background-image: url('fancybox/fancybox-x.png');
+	background-position: 0px -20px;
+}
+
+#fancybox-bg-sw {
+	bottom: -20px;
+	left: -20px;
+	background-image: url('fancybox/fancybox.png');
+	background-position: -40px -142px;
+}
+
+#fancybox-bg-w {
+	top: 0;
+	left: -20px;
+	height: 100%;
+	background-image: url('fancybox/fancybox-y.png');
+}
+
+#fancybox-bg-nw {
+	top: -20px;
+	left: -20px;
+	background-image: url('fancybox/fancybox.png');
+	background-position: -40px -122px;
+}
+
+#fancybox-title {
+	font-family: Helvetica;
+	font-size: 12px;
+	z-index: 1102;
+}
+
+.fancybox-title-inside {
+	padding-bottom: 10px;
+	text-align: center;
+	color: #333;
+	background: #fff;
+	position: relative;
+}
+
+.fancybox-title-outside {
+	padding-top: 10px;
+	color: #fff;
+}
+
+.fancybox-title-over {
+	position: absolute;
+	bottom: 0;
+	left: 0;
+	color: #FFF;
+	text-align: left;
+}
+
+#fancybox-title-over {
+	padding: 10px;
+	background-image: url('fancybox/fancy_title_over.png');
+	display: block;
+}
+
+.fancybox-title-float {
+	position: absolute;
+	left: 0;
+	bottom: -20px;
+	height: 32px;
+}
+
+#fancybox-title-float-wrap {
+	border: none;
+	border-collapse: collapse;
+	width: auto;
+}
+
+#fancybox-title-float-wrap td {
+	border: none;
+	white-space: nowrap;
+}
+
+#fancybox-title-float-left {
+	padding: 0 0 0 15px;
+	background: url('fancybox/fancybox.png') -40px -90px no-repeat;
+}
+
+#fancybox-title-float-main {
+	color: #FFF;
+	line-height: 29px;
+	font-weight: bold;
+	padding: 0 0 3px 0;
+	background: url('fancybox/fancybox-x.png') 0px -40px;
+}
+
+#fancybox-title-float-right {
+	padding: 0 0 0 15px;
+	background: url('fancybox/fancybox.png') -55px -90px no-repeat;
+}
+
+/* IE6 */
+
+.fancybox-ie6 #fancybox-close { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_close.png', sizingMethod='scale'); }
+
+.fancybox-ie6 #fancybox-left-ico { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_nav_left.png', sizingMethod='scale'); }
+.fancybox-ie6 #fancybox-right-ico { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_nav_right.png', sizingMethod='scale'); }
+
+.fancybox-ie6 #fancybox-title-over { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_over.png', sizingMethod='scale'); zoom: 1; }
+.fancybox-ie6 #fancybox-title-float-left { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_left.png', sizingMethod='scale'); }
+.fancybox-ie6 #fancybox-title-float-main { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_main.png', sizingMethod='scale'); }
+.fancybox-ie6 #fancybox-title-float-right { background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_title_right.png', sizingMethod='scale'); }
+
+.fancybox-ie6 #fancybox-bg-w, .fancybox-ie6 #fancybox-bg-e, .fancybox-ie6 #fancybox-left, .fancybox-ie6 #fancybox-right, #fancybox-hide-sel-frame {
+	height: expression(this.parentNode.clientHeight + "px");
+}
+
+#fancybox-loading.fancybox-ie6 {
+	position: absolute; margin-top: 0;
+	top: expression( (-20 + (document.documentElement.clientHeight ? document.documentElement.clientHeight/2 : document.body.clientHeight/2 ) + ( ignoreMe = document.documentElement.scrollTop ? document.documentElement.scrollTop : document.body.scrollTop )) + 'px');
+}
+
+#fancybox-loading.fancybox-ie6 div	{ background: transparent; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_loading.png', sizingMethod='scale'); }
+
+/* IE6, IE7, IE8 */
+
+.fancybox-ie .fancybox-bg { background: transparent !important; }
+
+.fancybox-ie #fancybox-bg-n { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_n.png', sizingMethod='scale'); }
+.fancybox-ie #fancybox-bg-ne { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_ne.png', sizingMethod='scale'); }
+.fancybox-ie #fancybox-bg-e { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_e.png', sizingMethod='scale'); }
+.fancybox-ie #fancybox-bg-se { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_se.png', sizingMethod='scale'); }
+.fancybox-ie #fancybox-bg-s { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_s.png', sizingMethod='scale'); }
+.fancybox-ie #fancybox-bg-sw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_sw.png', sizingMethod='scale'); }
+.fancybox-ie #fancybox-bg-w { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_w.png', sizingMethod='scale'); }
+.fancybox-ie #fancybox-bg-nw { filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='fancybox/fancy_shadow_nw.png', sizingMethod='scale'); }

app/assets/stylesheets/main.sass

@@ -0,0 +1,662 @@
+// colors which are used in the foodsoft
+$main_red: #ED0606
+$hover_yellow: #ffff72
+$boxContent: #e4eed6
+$lightGrey: #efefef
+$darkGreen: #78b74e
+$lightGreen: #e4eed6
+
+// General rules ...
+body
+  :background-color #fff
+  :color black
+  :margin 0
+  :padding 1% 0 0 0
+  :min-width 990px
+  :font-size 62.5%
+  :font-family verdana, arial, sans-serif
+
+#loader
+  :position fixed
+  :top 1px
+  :right 1px
+  :background #FFF
+  :padding 10px
+  :color black
+  :border
+    :width 2px
+    :style solid 
+    color: $main_red
+
+a, a:visited
+  :text-decoration underline
+  :color black
+
+a:hover
+  color: $main_red
+
+h1, h2
+  color: $main_red
+
+h1
+  :font-size 2.2em
+  :line-height 0.8em
+  :padding 1em 0 5px 5%
+  :margin 0 0 1em 0
+  :border-bottom 
+    :width 1px
+    :style dotted 
+    color: $main_red
+
+h2
+  :font-size 1.4em
+  :margin-top .5em
+    
+h3
+  :font-size 1em
+  :margin-top 1.5em
+    
+input
+  :color #2e2e2e
+
+abbr, acronym
+  :cursor help
+
+input, textarea, select
+  border: 1px solid #D7D7D7
+  font-family: verdana, arial, helvetica, sans-serif
+  font-size: 0.9em
+  padding-left: .2em
+  padding-right: .2em
+
+input:focus, textarea:focus, select:focus
+  border-color: #000
+
+input[type="button"], input[type="submit"], input[type="reset"]
+  background: #EEEEEE none repeat scroll 0%
+  border: 1px outset #CCCCCC
+  color: #222222
+  padding: 0.1em 0.5em
+  font-size: 1em
+  font-weight: bold
+  min-width: 34px
+
+select
+  max-width: 15em
+
+option
+  border-top: 1px solid #D7D7D7
+  margin: .2em 0
+
+.click-me
+  cursor: pointer
+.left
+  float: left
+.right
+  float: right
+.clear
+  clear: both
+
+.description
+  color: grey
+  font-size: 0.9em
+
+.hidden
+  display: none
+
+.warning
+  background: yellow
+  font-weight: bold
+  padding: 1px 10px
+
+// ********************************* loginpage
+#login
+  :margin auto
+  :width 35em
+  :font-size 1.2em
+
+#login #meta
+  :margin-top 2em
+  :padding-top .3em
+  :border-top 1px dotted #ED0606
+  :color #2e2e2e
+
+    
+// ******************************** - Logo - head
+#header 
+  :margin 0
+  :padding 0
+
+
+#logo 
+  background: $main_red
+  :height 1.1em
+  :width 8em
+  :padding 0 20px
+  :text-align left
+  :line-height 54px
+  :font-size 54px
+  :overflow hidden
+  :letter-spacing -3px
+  :margin 0
+  a, a:hover
+    :color white
+    background-color: $main_red
+    :text-decoration none
+  a span
+    color: $main_red
+    :background #FFF
+    :padding-right 0.1em
+    :font-weight bold
+    :border-top
+      :width 2px
+      :style dotted 
+      color: $main_red
+    
+#logininfo
+  :position absolute
+  :top 3px
+  :right 10px
+  :font-size 1em
+  ul 
+    :list-style none
+    li 
+      :margin 0 0 0 5px
+      :float left
+  a 
+    :color #737272
+    :font-weight bold
+  a:hover 
+    color: $main_red
+    
+// *************************************  box structure
+#main 
+  :background #FFF
+  :padding 0
+  :margin 0 15px 0 15px
+
+//  ************************************* infobar
+#infobar 
+  :width 10% 
+  :min-width 5em
+  :float right
+  :padding 2.6em 1em
+  :margin 3em 0 0 0
+  :border-left 1px dotted #ED0606
+  :font-size 1.2em 
+  h3
+    :color #ED0606
+  ul 
+    :list-style none
+  li 
+    :margin .3em 0 0 -3em
+
+// ************************************ embedded menu
+.menu, #start_nav
+  :border 2px solid #e3e3e3
+  :background #f5f5f5
+  :padding 0 10px 0px 5px
+  :float left
+
+  ul 
+    :list-style-type none
+    :margin 0 0 0.2em 0
+    :padding 0
+
+    li 
+      :border-bottom 1px solid #dedede
+      :color #666
+      :margin 0.8em 0 0 0
+      :font-weight bold    
+      a:link, a:visited 
+        :display block
+        :padding 0.25em 1em
+        :text-decoration none
+        :width 12em 
+      a:hover, a:focus 
+        :background-color #e3e3e3
+
+      ul 
+        :margin 0
+        :padding 0
+        li 
+          :border-top 1px solid #dedede
+          :border-bottom none
+          :margin 0
+          :font-weight normal
+          a:link, a:visited 
+            :width 11.5em
+            :padding 0 1em 0.1em 1.5em
+            :font-weight normal
+            :text-decoration none
+.menu
+  :position absolute
+  :top 100px
+  :right 1px
+  
+// ************************************** content
+#content 
+  :padding .5em 0 2.5em 0
+  :margin 0
+  :background #FFF
+  :font-size 1.3em
+  :width 100%
+  :float left
+
+
+/************************************ tables
+table 
+  :border-collapse collapse
+  // border2px solid #e3e3e3
+  :text-align left
+  :width 100%
+  :margin 0
+  
+  thead th, tbody td, th, td 
+    :padding 0.3em  
+
+  thead tr  
+    :background-color #efefef
+  th
+    :color black
+  tr.odd, tr.even
+    :border-top 1px solid #DDDDDD 
+  tr.odd, tr.odd input
+    :background-color #F6F6F6
+  tr.even
+    :background-color #FBFBFB
+  tr.unavailable, tr.unavailable a
+    :color grey 
+  tr.unavailable a:hover
+    :color #ED0606
+  tr.just_updated
+    :color #008000
+  tr.selected, tr.active
+    :background-color #ffffc2
+  tr.ignored
+    color: grey
+  tr.success
+    color: green
+  tr.failed
+    color: red
+      
+table.list
+  //:border 2px solid #78b74e
+  tr
+    :border 1px solid #e3e3e3
+  tbody tr:hover
+    :background-color #EEEEDD
+    
+table tfoot tr
+  :background-color #fff
+  td
+    :padding-top 0.8em
+
+tr.edit_inline
+  background-color: $hover_yellow
+  td, span
+    :padding 0.5em 0.2em
+
+div.legend, div.legend table th  
+  :color grey
+  :font-size .8em
+  :background none
+
+form table 
+  :border none
+
+table.ordered_articles
+  :background-color #fff
+  tbody tr:hover
+    :background-color #EEEEDD
+  a
+    :display block
+  tr.results:hover
+    :background-color none
+  table
+    tfoot
+      :font-weight bold
+      
+td.currency, td.actions
+  :text-align right
+  :padding-right 0.5em
+td.closed
+  background: image-url('arrow_right_red.png') no-repeat center left
+  a
+    display: block
+    text-decoration: none
+    padding-left: 20px
+td.open
+  background: image-url('arrow_down_red.png') no-repeat center left
+
+// ************************************* for edit formulars
+div.edit_form
+  :border 2px solid #e3e3e3
+  :background #f5f5f5
+  :padding 0 0.8em 0.8em 0.8em
+  :margin 5px 0
+  :color black
+  
+#edit_article, #edit_box, #ajax_box
+  :position fixed
+  :top 5em
+  :left 10em
+  :width 55em
+  :background #FBFBFB
+  :padding 3em
+  :padding-top 1em
+  :border 
+    :width 3px
+    :style solid
+    color: $main_red
+  
+// ***************************************** other boxes */
+
+// *********boxes in columns ****/
+div.box 
+  :border-left 2px solid #78b74e
+  :padding-left 5px
+
+div.single_column 
+  :width 100%
+
+div.left_column 
+  :width 40%
+  :float left
+
+div.middle_column
+  :width 40%
+  :margin-left 10px
+  :float left
+
+div.right_column
+  :margin-bottom 3em
+  :width 55%
+  :float right
+
+// *********** content of boxes ******/
+
+div.box_title 
+  :background #78b74e
+  :padding 5px 10px
+  
+  h2, h2 a 
+    :color #FFF
+    :margin 0
+  h2
+    :font-size 1.3em 
+
+div.column_content 
+  background: $boxContent
+  :color black
+  :padding 10px
+  margin-bottom: 2em
+  h2 
+    :color black
+    :font-size 1.3em
+    :margin 1em 0 0 0
+  #links
+    :float right
+
+// for special pages
+// index-page
+
+
+
+
+// * article show
+tr.current_price
+  :background #cdee9e
+    
+
+// **** maybe later for the very little spinner
+li.check div.spinner
+  :display block 
+  :height 5px 
+  :width 21px 
+  :background-image image-url('dots-white.gif')
+  :line-height 16px 
+  :float left 
+  :margin-right 5px
+  :background-position center center
+  :background-repeat no-repeat
+
+
+// ************************************* the order page */
+span.used, span.unused
+  :font-weight bold
+span.used  
+  :color #008000
+span.unused
+  :color #ed0606
+span.total
+  :font-size 80% 
+table#order
+  :text-align center
+  input
+    font-size: 0.9em
+    font-weight: bolder
+    background-color: #78B74E
+    color: #fff
+    -moz-border-radius: 3px
+    -webkit-border-radius: 3px
+    padding: 0
+  th#col_required, th#col_tolerance
+    :width 145px
+  th#col_packages,  th#col_left_units
+    :width 50px
+  td.quantity, td.tolerance
+    text-align: right
+  td#col_left_units
+    :color #ed0606
+  td
+    :padding 0.6em
+  td.name
+    :text-align left
+    :padding-left 10px
+  tfoot
+    tr
+      background-color: $lightGreen
+    td
+      :padding-right 10px
+#order-footer, .article-info
+  text-align: left
+  z-index: 1
+  position: fixed
+  bottom: 0
+  background-color: #E4EED6
+  border-top: 2px solid #78B74E
+  //opacity: 0.95
+  #total-sum
+    width: 22em
+    margin: .5em 2em 0 0
+    float: right
+    #order-button
+      margin: .5em 0
+      input
+        background-color: #78B74E
+        color: #fff
+        -moz-border-radius: 3px
+        -webkit-border-radius: 3px
+      input:disabled
+        background-color: red
+#order-footer
+  width: 100%
+  right: 0
+  left: 0
+.article-info
+  z-index: 2
+  width: 45em
+  height: 8em
+  border: none
+  left: 30px
+  h3
+    text-align: center
+    margin: 0
+    margin-bottom: 5px
+    width: 100%
+  .right
+    width: 35%
+  .left
+    width: 60%
+tr.order-article .article-info
+  display: none
+tr.order-article:hover .article-info
+  display: block
+
+// ********* Comments
+#newComment
+  :margin 1em
+.comment
+  :border-bottom 1px dotted black
+  :padding .5em 0 1em .5em
+  .timestamp
+    :font-size 0.8em
+    :color grey
+    
+// *************** Clearing Order Page ..
+#editOrderNav
+  a
+    :color #fff
+    :font-weight bold
+  ul
+    :margin 0
+    :padding 0
+    li
+      :display inline
+      :list-style none
+      :margin-right 1em
+      
+// *************** Tasks ...
+.accepted
+  color: green
+  font-weight: bold
+.done, .done a, .done .accepted
+  color: grey
+  font-weight: normal
+  
+// **************  auto_complete
+ul.autocomplete
+  .nick, .informal
+    margin: auto
+  .nick
+    font-weight: bold
+  .informal
+    color: grey
+    margin-left: 1em
+    
+// ******* to navigate easy to the next element, e.g. next order
+#element_navigation
+  position: relative
+  top: -1em
+  left: 5%
+
+// group stats
+.stats-bar
+  height: 20px
+  min-width: 10px
+  border: 1px solid #DDDDDD
+  background-color: #fff
+  text-align: center
+  margin: 0 10px 10px 0
+  
+// *** wiki
+#wiki_content
+  border-style: none
+  color: black
+  line-height: 1.5em
+
+.wiki_show, .wiki_version, .wiki_new, .wiki_edit, .wiki_all
+  margin-top: 30px
+  padding: 10px
+  h1
+    padding-left: 0
+    padding-top: 10px
+    border-bottom:
+      :style solid
+  .column_content
+    margin-bottom: 0
+
+#wiki_content
+  min-height: 400px
+  span.editsection
+    display: none
+  h2, h3, h4, h5, h6
+    background: transparent none repeat scroll 0 0
+    border-bottom: 1px solid #AAAAAA
+    padding-bottom: 0,17em
+    padding-top: 0,5em
+    font-weight: normal
+    font-size: 150%
+    color: black
+  h3, h4, h5, h6
+    border-bottom: medium none
+    font-weight: bold
+  h3
+    font-size: 132%
+  h4
+    font-size: 116%
+  ul
+    line-height: 1.5em
+    margin: 0.3em 0 0 1.5em
+    padding: 0
+  ol
+    line-height: 1.5em
+    margin: 0.3em 0 0 3.2em
+    padding: 0
+    list-style-image: none
+  li
+    margin-bottom: 0.1em
+
+a.new_wiki_link
+  color: grey
+#preview
+  border: 1px dotted grey
+  padding: 0 1em
+#wikitoc
+  padding: 5px
+  margin-bottom: 2em
+  width: 25em
+  border: 1px solid grey
+  background-color: $lightGrey
+  h2
+    font-size: 1em
+    color: black
+    span a
+      font-size: 0.5em
+      color: grey
+
+#breadcrump
+  font-size: 0.5em
+  margin-bottom: 5px
+  height: 1em
+  color: #ED0606
+  a
+    color: $main_red
+    text-decoration: none
+  a:hover
+    text-decoration: underline
+#sidebar
+  float: right
+  width: 290px
+  margin-top: -60px
+  #sidebar-links
+    margin-bottom: 18px
+    text-align: right
+  #subpages
+    border: 1px solid #78b74e
+    margin-top: 10px
+    padding: 0 0 0 0
+  #versions
+    margin-top: 10px
+    border: 1px solid #78b74e
+
+#wiki-syntax-help
+  float: right
+  table
+    border-color: #78b74e
+
+.wiki_version
+  #sidebar
+    margin-top: -23px
+    border: 1px solid #78b74e

app/assets/stylesheets/nav.css

@@ -0,0 +1,58 @@
+/* Navigation .... */
+#nav {
+  position: relative;
+  height: 3em;
+  text-align: right;
+  margin-top: 5px; }
+  #nav ul {
+    padding: 0 0 0 0;
+    margin: -2.3em 0 0 0;
+    list-style: none; }
+    #nav ul li {
+      display: inline;
+      list-style: none;
+      padding: 0.3em 0 0.3em 0;
+      margin: 0 0 0 0.2em;
+      background: none;
+      vertical-align: middle; }
+      #nav ul li a {
+        margin: 0.1em 0 0 0;
+        text-align: center;
+        font-size: 1.1em;
+        font-weight: bold;
+        text-decoration: none;
+        color: #737272;
+        border: none;
+        background: #e3e3e3;
+        padding: 0.5em 1.2em 0.6em 1.2em;
+        margin-top: 0; }
+      #nav ul li a:hover {
+        color: #ed0606; }
+      #nav ul li ul {
+        display: none;
+        position: absolute;
+        margin: 0;
+        left: 0;
+        padding: 0.6em;
+        bottom: -1.4em;
+        right: 0em;
+        background: #ed0606; }
+        #nav ul li ul li {
+          border-left: 0.1em dotted white;
+          background: none; }
+        #nav ul li ul a, #nav ul li ul a:hover {
+          border: none;
+          background: none;
+          color: white;
+          font-style: normal;
+          font-size: 1em; }
+    #nav ul li.current a {
+      border: none;
+      border-bottom: none;
+      background: #ed0606;
+      padding-bottom: 0.6em;
+      color: white; }
+    #nav ul li.current ul {
+      display: inline; }
+      #nav ul li.current ul a {
+        background: none; }

app/assets/stylesheets/print.scss

@@ -0,0 +1,621 @@
+/* General rules ... */
+body {
+  background-color: #fff;
+  color: black;
+  margin: 0;
+  padding: 1% 0 0 0;
+  min-width: 990px;
+  font-size: 62.5%;
+  font-family: verdana, arial, sans-serif; }
+
+#loader {
+  position: fixed;
+  top: 1px;
+  right: 1px;
+  background: #FFF;
+  padding: 10px;
+  color: black;
+  border-width: 2px;
+  border-style: solid;
+  border-color: #ed0606; }
+
+a, a:visited {
+  text-decoration: underline;
+  color: black; }
+
+a:hover {
+  color: #ed0606; }
+
+h1, h2 {
+  color: #ed0606; }
+
+h1 {
+  font-size: 2.2em;
+  line-height: 0.8em;
+  padding: 1em 0 5px 5%;
+  margin: 0 0 1em 0;
+  border-bottom-width: 1px;
+  border-bottom-style: dotted;
+  border-bottom-color: #ed0606; }
+
+h2 {
+  font-size: 1.4em;
+  margin-top: .5em; }
+
+h3 {
+  font-size: 1em;
+  margin-top: 1.5em; }
+
+input {
+  color: #2e2e2e; }
+
+abbr, acronym {
+  cursor: help; }
+
+input, textarea, select {
+  border: 1px solid #D7D7D7;
+  font-family: verdana, arial, helvetica, sans-serif;
+  font-size: 0.9em;
+  padding-left: .2em;
+  padding-right: .2em; }
+
+input:focus, textarea:focus, select:focus {
+  border-color: #000; }
+
+input[type="button"], input[type="submit"], input[type="reset"] {
+  background: #EEEEEE none repeat scroll 0%;
+  border: 1px outset #CCCCCC;
+  color: #222222;
+  padding: 0.1em 0.5em;
+  font-size: 1em;
+  font-weight: bold;
+  min-width: 34px; }
+
+select {
+  max-width: 15em; }
+
+option {
+  border-top: 1px solid #D7D7D7;
+  margin: .2em 0; }
+
+span.click-me {
+  cursor: pointer; }
+
+.left {
+  float: left; }
+
+.right {
+  float: right; }
+
+.clear {
+  clear: both; }
+
+.description {
+  color: grey;
+  font-size: 0.9em; }
+
+.hidden {
+  display: none; }
+
+#login {
+  margin: auto;
+  width: 27em;
+  font-size: 1.2em; }
+
+#login #meta {
+  margin-top: 2em;
+  padding-top: .3em;
+  border-top: 1px dotted #ED0606;
+  color: #2e2e2e; }
+
+#header {
+  margin: 0;
+  padding: 0; }
+
+#logo {
+  background: #ed0606;
+  height: 1.1em;
+  width: 8em;
+  padding: 0 20px;
+  text-align: left;
+  line-height: 54px;
+  font-size: 54px;
+  overflow: hidden;
+  letter-spacing: -3px;
+  margin: 0; }
+  #logo a, #logo a:hover {
+    color: white;
+    background-color: #ed0606;
+    text-decoration: none; }
+  #logo a span {
+    color: #ed0606;
+    background: #FFF;
+    padding-right: 0.1em;
+    font-weight: bold;
+    border-top-width: 2px;
+    border-top-style: dotted;
+    border-top-color: #ed0606; }
+
+#logininfo {
+  position: absolute;
+  top: 3px;
+  right: 10px;
+  font-size: 1em; }
+  #logininfo ul {
+    list-style: none; }
+    #logininfo ul li {
+      margin: 0 0 0 5px;
+      float: left; }
+  #logininfo a {
+    color: #737272;
+    font-weight: bold; }
+  #logininfo a:hover {
+    color: #ed0606; }
+
+#main {
+  background: #FFF;
+  padding: 0;
+  margin: 0 15px 0 15px; }
+
+#infobar {
+  width: 10%;
+  min-width: 5em;
+  float: right;
+  padding: 2.6em 1em;
+  margin: 3em 0 0 0;
+  border-left: 1px dotted #ED0606;
+  font-size: 1.2em; }
+  #infobar h3 {
+    color: #ED0606; }
+  #infobar ul {
+    list-style: none; }
+  #infobar li {
+    margin: .3em 0 0 -3em; }
+
+.menu, #start_nav {
+  border: 2px solid #e3e3e3;
+  background: #f5f5f5;
+  padding: 0 10px 0px 5px;
+  float: left; }
+  .menu ul, #start_nav ul {
+    list-style-type: none;
+    margin: 0 0 0.2em 0;
+    padding: 0; }
+    .menu ul li, #start_nav ul li {
+      border-bottom: 1px solid #dedede;
+      color: #666;
+      margin: 0.8em 0 0 0;
+      font-weight: bold; }
+      .menu ul li a:link, .menu ul li a:visited, #start_nav ul li a:link, #start_nav ul li a:visited {
+        display: block;
+        padding: 0.25em 1em;
+        text-decoration: none;
+        width: 12em; }
+      .menu ul li a:hover, .menu ul li a:focus, #start_nav ul li a:hover, #start_nav ul li a:focus {
+        background-color: #e3e3e3; }
+      .menu ul li ul, #start_nav ul li ul {
+        margin: 0;
+        padding: 0; }
+        .menu ul li ul li, #start_nav ul li ul li {
+          border-top: 1px solid #dedede;
+          border-bottom: none;
+          margin: 0;
+          font-weight: normal; }
+          .menu ul li ul li a:link, .menu ul li ul li a:visited, #start_nav ul li ul li a:link, #start_nav ul li ul li a:visited {
+            width: 11.5em;
+            padding: 0 1em 0.1em 1.5em;
+            font-weight: normal;
+            text-decoration: none; }
+
+.menu {
+  position: absolute;
+  top: 100px;
+  right: 1px; }
+
+#content {
+  padding: .5em 0 2.5em 0;
+  margin: 0;
+  background: #FFF;
+  font-size: 1.3em;
+  width: 100%;
+  float: left; }
+
+/* *********************************** tables */
+table {
+  border-collapse: collapse;
+  text-align: left;
+  width: 100%;
+  margin: 0; }
+  table thead th, table tbody td, table th, table td {
+    padding: 0.3em; }
+  table thead tr {
+    background-color: #efefef; }
+  table th {
+    color: black; }
+  table tr.odd, table tr.even {
+    border-top: 1px solid #DDDDDD; }
+  table tr.odd, table tr.odd input {
+    background-color: #F6F6F6; }
+  table tr.even {
+    background-color: #FBFBFB; }
+  table tr.unavailable, table tr.unavailable a {
+    color: grey; }
+  table tr.unavailable a:hover {
+    color: #ED0606; }
+  table tr.just_updated {
+    color: #008000; }
+  table tr.selected, table tr.active {
+    background-color: #ffffc2; }
+  table tr.click-me {
+    cursor: pointer; }
+  table tr.ignored {
+    color: grey; }
+  table tr.success {
+    color: green; }
+  table tr.failed {
+    color: red; }
+
+table.list tr {
+  border: 1px solid #e3e3e3; }
+table.list tbody tr:hover {
+  background-color: #EEEEDD; }
+
+table tfoot tr {
+  background-color: #fff; }
+  table tfoot tr td {
+    padding-top: 0.8em; }
+
+tr.edit_inline {
+  background-color: #ffff72; }
+  tr.edit_inline td, tr.edit_inline span {
+    padding: 0.5em 0.2em; }
+
+div.legend, div.legend table th {
+  color: grey;
+  font-size: .8em;
+  background: none; }
+
+form table {
+  border: none; }
+
+table.ordered_articles {
+  background-color: #fff; }
+  table.ordered_articles tbody tr:hover {
+    background-color: #EEEEDD; }
+  table.ordered_articles a {
+    display: block; }
+  table.ordered_articles tr.results:hover {
+    background-color: none; }
+  table.ordered_articles table tfoot {
+    font-weight: bold; }
+
+td.currency, td.actions {
+  text-align: right;
+  padding-right: 0.5em; }
+
+td.closed {
+  background: image-url('arrow_right_red.png') no-repeat center left; }
+  td.closed a {
+    display: block;
+    text-decoration: none;
+    padding-left: 20px; }
+
+td.open {
+  background: image-url('arrow_down_red.png') no-repeat center left; }
+
+div.edit_form {
+  border: 2px solid #e3e3e3;
+  background: #f5f5f5;
+  padding: 0 0.8em 0.8em 0.8em;
+  margin: 5px 0;
+  color: black; }
+
+#edit_article, #edit_box, #ajax_box {
+  position: fixed;
+  top: 5em;
+  left: 10em;
+  width: 55em;
+  background: #FBFBFB;
+  padding: 3em;
+  padding-top: 1em;
+  border-width: 3px;
+  border-style: solid;
+  border-color: #ed0606; }
+
+div.box {
+  border-left: 2px solid #78b74e;
+  padding-left: 5px; }
+
+div.single_column {
+  width: 100%; }
+
+div.left_column {
+  width: 40%;
+  float: left; }
+
+div.middle_column {
+  width: 40%;
+  margin-left: 10px;
+  float: left; }
+
+div.right_column {
+  margin-bottom: 3em;
+  width: 55%;
+  float: right; }
+
+div.box_title {
+  background: #78b74e;
+  padding: 5px 10px; }
+  div.box_title h2, div.box_title h2 a {
+    color: #FFF;
+    margin: 0; }
+  div.box_title h2 {
+    font-size: 1.3em; }
+
+div.column_content {
+  background: #e4eed6;
+  color: black;
+  padding: 10px;
+  margin-bottom: 2em; }
+  div.column_content h2 {
+    color: black;
+    font-size: 1.3em;
+    margin: 1em 0 0 0; }
+  div.column_content #links {
+    float: right; }
+
+tr.current_price {
+  background: #cdee9e; }
+
+li.check div.spinner {
+  display: block;
+  height: 5px;
+  width: 21px;
+  background-image: image-url('dots-white.gif');
+  line-height: 16px;
+  float: left;
+  margin-right: 5px;
+  background-position: center center;
+  background-repeat: no-repeat; }
+
+span.used, span.unused {
+  font-weight: bold; }
+
+span.used {
+  color: #008000; }
+
+span.unused {
+  color: #ed0606; }
+
+span.total {
+  font-size: 80%; }
+
+table#order {
+  text-align: center; }
+  table#order input {
+    font-size: 0.9em;
+    font-weight: bolder;
+    background-color: #78B74E;
+    color: #fff;
+    -moz-border-radius: 3px;
+    -webkit-border-radius: 3px;
+    padding: 0; }
+  table#order th#col_required, table#order th#col_tolerance {
+    width: 140px; }
+  table#order th#col_packages, table#order th#col_left_units {
+    width: 50px; }
+  table#order td.quantity, table#order td.tolerance {
+    text-align: right; }
+  table#order td#col_left_units {
+    color: #ed0606; }
+  table#order td {
+    padding: 0.6em; }
+  table#order td.name {
+    text-align: left;
+    padding-left: 10px; }
+  table#order tfoot tr {
+    background-color: #e4eed6; }
+  table#order tfoot td {
+    padding-right: 10px; }
+
+#order-footer, .article-info {
+  text-align: left;
+  z-index: 1;
+  position: fixed;
+  bottom: 0;
+  background-color: #E4EED6;
+  border-top: 2px solid #78B74E; }
+  #order-footer #total-sum, .article-info #total-sum {
+    width: 22em;
+    margin: .5em 2em 0 0;
+    float: right; }
+    #order-footer #total-sum #order-button, .article-info #total-sum #order-button {
+      margin: .5em 0; }
+      #order-footer #total-sum #order-button input, .article-info #total-sum #order-button input {
+        background-color: #78B74E;
+        color: #fff;
+        -moz-border-radius: 3px;
+        -webkit-border-radius: 3px; }
+      #order-footer #total-sum #order-button input:disabled, .article-info #total-sum #order-button input:disabled {
+        background-color: red; }
+
+#order-footer {
+  width: 100%;
+  right: 0;
+  left: 0; }
+
+.article-info {
+  z-index: 2;
+  width: 45em;
+  height: 8em;
+  border: none;
+  left: 30px; }
+  .article-info h3 {
+    text-align: center;
+    margin: 0;
+    margin-bottom: 5px;
+    width: 100%; }
+  .article-info .right {
+    width: 35%; }
+  .article-info .left {
+    width: 60%; }
+
+tr.order-article .article-info {
+  display: none; }
+
+tr.order-article:hover .article-info {
+  display: block; }
+
+#newComment {
+  margin: 1em; }
+
+.comment {
+  border-bottom: 1px dotted black;
+  padding: .5em 0 1em .5em; }
+  .comment .timestamp {
+    font-size: 0.8em;
+    color: grey; }
+
+#editOrderNav a {
+  color: #fff;
+  font-weight: bold; }
+#editOrderNav ul {
+  margin: 0;
+  padding: 0; }
+  #editOrderNav ul li {
+    display: inline;
+    list-style: none;
+    margin-right: 1em; }
+
+.accepted {
+  color: green;
+  font-weight: bold; }
+
+.done, .done a, .done .accepted {
+  color: grey;
+  font-weight: normal; }
+
+ul.autocomplete .nick, ul.autocomplete .informal {
+  margin: auto; }
+ul.autocomplete .nick {
+  font-weight: bold; }
+ul.autocomplete .informal {
+  color: grey;
+  margin-left: 1em; }
+
+#element_navigation {
+  position: relative;
+  top: -1em;
+  left: 5%; }
+
+.stats-bar {
+  height: 20px;
+  min-width: 10px;
+  border: 1px solid #DDDDDD;
+  background-color: #fff;
+  text-align: center;
+  margin: 0 10px 10px 0; }
+
+.wiki_show, .wiki_version, .wiki_new, .wiki_edit, .wiki_all {
+  margin-top: 30px;
+  padding: 10px; }
+
+#wiki_content {
+  border: 1px solid grey;
+  margin-right: 300px;
+  padding: 10px;
+  color: black;
+  line-height: 1.5em;
+  min-height: 400px; }
+  #wiki_content span.editsection {
+    display: none; }
+  #wiki_content h1 {
+    padding-left: 0;
+    padding-top: 10px;
+    border: none;
+    margin-bottom: 10px; }
+  #wiki_content h2, #wiki_content h3, #wiki_content h4, #wiki_content h5, #wiki_content h6 {
+    background: transparent none repeat scroll 0 0;
+    border-bottom: 1px solid #AAAAAA;
+    padding-bottom: 0,17em;
+    padding-top: 0,5em;
+    font-weight: normal;
+    font-size: 150%;
+    color: black; }
+  #wiki_content h3, #wiki_content h4, #wiki_content h5, #wiki_content h6 {
+    border-bottom: medium none;
+    font-weight: bold; }
+  #wiki_content h3 {
+    font-size: 132%; }
+  #wiki_content h4 {
+    font-size: 116%; }
+  #wiki_content ul {
+    line-height: 1.5em;
+    margin: 0.3em 0 0 1.5em;
+    padding: 0; }
+  #wiki_content ol {
+    line-height: 1.5em;
+    margin: 0.3em 0 0 3.2em;
+    padding: 0;
+    list-style-image: none; }
+
+a.new_wiki_link {
+  color: grey; }
+
+#preview {
+  border: 1px dotted grey;
+  padding: 0 1em; }
+
+#wikitoc {
+  padding: 5px;
+  margin-bottom: 2em;
+  width: 25em;
+  border: 1px solid grey;
+  background-color: #efefef; }
+  #wikitoc h2 {
+    font-size: 1em;
+    color: black; }
+    #wikitoc h2 span a {
+      font-size: 0.5em;
+      color: grey; }
+
+#breadcrump {
+  font-size: 0.5em;
+  margin-bottom: 5px;
+  height: 1em;
+  color: #ED0606; }
+  #breadcrump a {
+    color: #ed0606;
+    text-decoration: none; }
+  #breadcrump a:hover {
+    text-decoration: underline; }
+
+#sidebar {
+  float: right;
+  width: 290px; }
+  #sidebar #sidebar-links {
+    margin-bottom: 18px;
+    text-align: right; }
+  #sidebar #subpages {
+    border: 1px solid #78b74e;
+    margin-top: 10px;
+    padding: 0 0 0 0; }
+  #sidebar #versions {
+    margin-top: 10px;
+    border: 1px solid #78b74e; }
+
+#wiki-syntax-help {
+  float: right; }
+  #wiki-syntax-help table {
+    border-color: #78b74e; }
+
+.wiki_version #sidebar {
+  margin-top: -23px;
+  border: 1px solid #78b74e; }
+
+#logininfo, #header, #footer {
+  display: none; }
+
+h1, h2 {
+  color: black;
+  border-color: black; }

app/assets/stylesheets/rails_messages.scss

@@ -0,0 +1,68 @@
+/* rails messages .... */
+h3.notice, div.notice {
+  color: #090; }
+
+h3.notice {
+  background: #dfd image-url('icon_message.gif') no-repeat 10px 3px;
+  border: 1px solid #bfb;
+  padding: 4px 40px;
+  margin: 2em 0 1em 0;
+  font-size: 100%;
+  position: relative; }
+
+h3.alert, div.alert, div.error {
+  color: red;
+  font-size: 100%;
+  font-weight: bold; }
+
+h3.alert {
+  background: yellow image-url('error.png') no-repeat 10px 3px;
+  border: 1px solid red;
+  padding: 4px 40px;
+  position: relative;
+  margin: 2em 0 1em 0;
+  font-weight: normal; }
+
+.fieldWithErrors {
+  padding: 2px;
+  background-color: red;
+  display: table; }
+
+.fieldWithErrors input {
+  background-color: yellow; }
+
+#errorExplanation {
+  width: 40em;
+  padding: 7px;
+  padding-bottom: 12px;
+  color: #ed0606; }
+  #errorExplanation h2 {
+    color: #ed0606;
+    text-align: left;
+    font-weight: bold;
+    margin: 0;
+    padding: 5px 5px 5px 5px;
+    font-size: 15px; }
+  #errorExplanation p {
+    margin: 0;
+    padding: 5px; }
+  #errorExplanation ul, #errorExplanation li {
+    margin: 0; }
+  #errorExplanation li {
+    padding: 0;
+    font-size: 12px;
+    list-style: square; }
+
+div.uploadStatus {
+  margin: 5px; }
+
+div.progressBar {
+  margin: 5px; }
+  div.progressBar div.border {
+    background-color: #fff;
+    border: 1px solid grey;
+    width: 100%; }
+  div.progressBar div.background {
+    background-color: #333;
+    height: 18px;
+    width: 0%; }

app/assets/stylesheets/scaffold.css

@@ -0,0 +1,54 @@
+body { background-color: #fff; color: #333; }
+
+body, p, ol, ul, td {
+  font-family: verdana, arial, helvetica, sans-serif;
+  font-size:   13px;
+  line-height: 18px;
+}
+
+pre {
+  background-color: #eee;
+  padding: 10px;
+  font-size: 11px;
+}
+
+a { color: #000; }
+a:visited { color: #666; }
+a:hover { color: #fff; background-color:#000; }
+
+.fieldWithErrors {
+  padding: 2px;
+  background-color: red;
+  display: table;
+}
+
+#errorExplanation {
+  width: 400px;
+  border: 2px solid red;
+  padding: 7px;
+  padding-bottom: 12px;
+  margin-bottom: 20px;
+  background-color: #f0f0f0;
+}
+
+#errorExplanation h2 {
+  text-align: left;
+  font-weight: bold;
+  padding: 5px 5px 5px 15px;
+  font-size: 12px;
+  margin: -7px;
+  background-color: #c00;
+  color: #fff;
+}
+
+#errorExplanation p {
+  color: #333;
+  margin-bottom: 0;
+  padding: 5px;
+}
+
+#errorExplanation ul li {
+  font-size: 12px;
+  list-style: square;
+}
+

app/assets/stylesheets/simple_form.css

@@ -0,0 +1,42 @@
+.simple_form label {
+    float: left;
+    width: 120px;
+    text-align: right;
+    margin: 2px 10px;
+}
+
+.simple_form div.input {
+    margin-bottom: 10px;
+    clear: both;
+}
+
+.simple_form div.boolean, .simple_form input[type='submit'] {
+    margin-left: 140px;
+}
+
+.simple_form div.boolean label, .simple_form label.collection_radio {
+    float: none;
+    margin: 0;
+}
+
+.simple_form label.collection_radio {
+    margin-right: 10px;
+    margin-left: 2px;
+}
+
+.simple_form .error {
+    clear: left;
+    margin-left: 140px;
+    font-size: 12px;
+    color: #D00;
+    display: block;
+}
+
+.simple_form .hint {
+    clear: left;
+    margin-left: 140px;
+    font-size: 12px;
+    color: #555;
+    display: block;
+    font-style: italic;
+}

app/assets/stylesheets/token-input.css

@@ -0,0 +1,112 @@
+/* Example tokeninput style #1: Token vertical list*/
+ul.token-input-list {
+    overflow: hidden; 
+    height: auto !important; 
+    height: 1%;
+    width: 300px;
+    border: 1px solid #999;
+    cursor: text;
+    font-size: 12px;
+    font-family: Verdana;
+    z-index: 999;
+    margin: 0;
+    padding: 0;
+    background-color: #fff;
+    list-style-type: none;
+}
+
+ul.token-input-list li {
+    list-style-type: none;
+}
+
+ul.token-input-list li input {
+    border: 0;
+    width: 350px;
+    padding: 3px 8px;
+    background-color: white;
+    -webkit-appearance: caret;
+}
+
+li.token-input-token {
+    overflow: hidden; 
+    height: auto !important; 
+    height: 1%;
+    margin: 3px;
+    padding: 3px 5px;
+    background-color: #d0efa0;
+    color: #000;
+    font-weight: bold;
+    cursor: default;
+    display: block;
+}
+
+li.token-input-token p {
+    float: left;
+    padding: 0;
+    margin: 0;
+}
+
+li.token-input-token span {
+    float: right;
+    color: #777;
+    cursor: pointer;
+}
+
+li.token-input-selected-token {
+    background-color: #08844e;
+    color: #fff;
+}
+
+li.token-input-selected-token span {
+    color: #bbb;
+}
+
+div.token-input-dropdown {
+    position: absolute;
+    width: 400px;
+    background-color: #fff;
+    overflow: hidden;
+    border-left: 1px solid #ccc;
+    border-right: 1px solid #ccc;
+    border-bottom: 1px solid #ccc;
+    cursor: default;
+    font-size: 12px;
+    font-family: Verdana;
+    z-index: 1;
+}
+
+div.token-input-dropdown p {
+    margin: 0;
+    padding: 5px;
+    font-weight: bold;
+    color: #777;
+}
+
+div.token-input-dropdown ul {
+    margin: 0;
+    padding: 0;
+}
+
+div.token-input-dropdown ul li {
+    background-color: #fff;
+    padding: 3px;
+    list-style-type: none;
+}
+
+div.token-input-dropdown ul li.token-input-dropdown-item {
+    background-color: #fafafa;
+}
+
+div.token-input-dropdown ul li.token-input-dropdown-item2 {
+    background-color: #fff;
+}
+
+div.token-input-dropdown ul li em {
+    font-weight: bold;
+    font-style: normal;
+}
+
+div.token-input-dropdown ul li.token-input-selected-dropdown-item {
+    background-color: #d0efa0;
+}
+