Updating translations for config/locales/nb.yml [skip ci]

in method Spree::Adjustment#find_closest_tax_rates_from_included_tax

CONTRIBUTING.md

@@ -1,3 +1,6 @@
+See this here post on raising a github issue:
+https://community.openfoodnetwork.org/t/how-to-raise-a-github-issue/912
+
 # Contributing
 
 We love pull requests from everyone. Here are some instructions for

Gemfile

@@ -63,6 +63,7 @@ gem 'wkhtmltopdf-binary'
 
 gem 'foreigner'
 gem 'immigrant'
+gem 'roo', '~> 2.7.0'
 
 gem 'whenever', require: false
 
@@ -90,6 +91,7 @@ gem 'jquery-rails'
 gem 'jquery-migrate-rails'
 gem 'css_splitter'
 
+gem 'ofn-qz', github: 'openfoodfoundation/ofn-qz'
 
 group :test, :development do
   # Pretty printed test output
@@ -113,7 +115,6 @@ end
 
 group :test do
   gem 'webmock'
-
   # See spec/spec_helper.rb for instructions
   #gem 'perftools.rb'
 end

Gemfile.lock

@@ -21,6 +21,13 @@ GIT
       paypal-sdk-merchant (= 1.106.1)
       spree_core (~> 1.3.4)
 
+GIT
+  remote: git://github.com/openfoodfoundation/ofn-qz.git
+  revision: 024680ccea429b2e5428d7b964fa67c52add34ec
+  specs:
+    ofn-qz (0.1.0)
+      railties (~> 3.1)
+
 GIT
   remote: git://github.com/openfoodfoundation/spree.git
   revision: a4c439570b77afa50f9e36299811f293232bd281
@@ -551,6 +558,9 @@ GEM
     roadie-rails (1.0.3)
       rails (>= 3.0, < 4.2)
       roadie (~> 3.0)
+    roo (2.7.1)
+      nokogiri (~> 1)
+      rubyzip (~> 1.1, < 2.0.0)
     rspec (2.14.1)
       rspec-core (~> 2.14.0)
       rspec-expectations (~> 2.14.0)
@@ -569,6 +579,7 @@ GEM
     rspec-retry (0.4.2)
       rspec-core
     ruby-progressbar (1.7.1)
+    rubyzip (1.2.0)
     safe_yaml (0.9.5)
     sass (3.3.14)
     sass-rails (3.2.6)
@@ -632,9 +643,8 @@ GEM
     whenever (0.9.2)
       activesupport (>= 2.3.4)
       chronic (>= 0.6.3)
-    wicked_pdf (0.11.0)
-      rails
-    wkhtmltopdf-binary (0.9.9.3)
+    wicked_pdf (1.1.0)
+    wkhtmltopdf-binary (0.12.3.1)
     xml-simple (1.1.4)
     xpath (2.0.0)
       nokogiri (~> 1.3)
@@ -694,6 +704,7 @@ DEPENDENCIES
   momentjs-rails
   newrelic_rpm
   nokogiri (>= 1.6.7.1)
+  ofn-qz!
   oj
   paper_trail (~> 3.0.8)
   paperclip
@@ -709,6 +720,7 @@ DEPENDENCIES
   redcarpet
   representative_view
   roadie-rails (~> 1.0.3)
+  roo (~> 2.7.0)
   rspec-rails
   rspec-retry
   sass (~> 3.3)
@@ -737,4 +749,4 @@ RUBY VERSION
    ruby 2.1.5p273
 
 BUNDLED WITH
-   1.13.6
+   1.14.3

README.md

@@ -98,6 +98,14 @@ The site is configured to use
 startup time while Rails loads. See the Zeus github page for
 usage instructions.
 
+Once [npm dependencies are
+installed](https://github.com/openfoodfoundation/openfoodnetwork/wiki/Karma), AngularJS tests can be run with:
+
+    ./script/karma run
+
+If you want karma to automatically rerun the tests on file modification, use:
+
+    ./script/karma start
 
 ## Credits
 

app/assets/javascripts/admin/enterprises/controllers/enterprise_controller.js.coffee

@@ -11,7 +11,7 @@ angular.module("admin.enterprises")
     $scope.StatusMessage = StatusMessage
 
     $scope.$watch 'enterprise_form.$dirty', (newValue) ->
-      StatusMessage.display 'notice', 'You have unsaved changes' if newValue
+      StatusMessage.display 'notice', t('admin.unsaved_changes') if newValue
 
     $scope.setFormDirty = ->
       $scope.$apply ->
@@ -24,13 +24,12 @@ angular.module("admin.enterprises")
       $scope.navClear()
       enterprise_form.submit()
 
-
     # Provide a callback for generating warning messages displayed before leaving the page. This is passed in
     # from a directive "nav-check" in the page - if we pass it here it will be called in the test suite,
     # and on all new uses of this contoller, and we might not want that.
     enterpriseNavCallback = ->
-      if $scope.Enterprise.$dirty
-        "Your changes to the enterprise are not saved yet."
+      if $scope.enterprise_form.$dirty
+        t('admin.unsaved_confirm_leave')
 
     # Register the NavigationCheck callback
     NavigationCheck.register(enterpriseNavCallback)
@@ -39,6 +38,8 @@ angular.module("admin.enterprises")
       if manager.id?
         for i, user of $scope.Enterprise.users when user.id == manager.id
           $scope.Enterprise.users.splice i, 1
+        if $scope.enterprise_form?
+          $scope.enterprise_form.$setDirty()
 
     $scope.addManager = (manager) ->
       if manager.id? and manager.email?

app/assets/javascripts/admin/enterprises/directives/enterprise_switcher.js.coffee

@@ -0,0 +1,16 @@
+angular.module('admin.enterprises').directive 'enterpriseSwitcher', (NavigationCheck) ->
+  restrict: 'A'
+  require: 'ngModel'
+  link: (scope, element, attr, ngModel) ->
+    initial = element[0].getAttribute('data-initial')
+
+    element.on 'change', ->
+      if not NavigationCheck.confirmLeave()
+        # Reset the current dropdown selection if staying on page
+        ngModel.$setViewValue initial
+        ngModel.$render()
+        element.select2 'val', initial
+        return
+
+      NavigationCheck.clear() # Don't ask twice if leaving
+      window.location = element[0].querySelector('option[selected]').getAttribute('data-url')

app/assets/javascripts/admin/order_cycles/controllers/create.js.coffee

@@ -12,7 +12,10 @@ angular.module('admin.orderCycles')
     $scope.StatusMessage = StatusMessage
 
     $scope.$watch 'order_cycle_form.$dirty', (newValue) ->
-      StatusMessage.display 'notice', 'You have unsaved changes' if newValue
+      StatusMessage.display 'notice', t("admin.unsaved_changes") if newValue
+
+    $scope.$watch 'order_cycle_form.$valid', (isValid) ->
+      StatusMessage.setValidation(isValid)
 
     $scope.loaded = ->
       Enterprise.loaded && EnterpriseFee.loaded && OrderCycle.loaded

app/assets/javascripts/admin/order_cycles/controllers/edit.js.coffee

@@ -13,7 +13,10 @@ angular.module('admin.orderCycles')
     $scope.StatusMessage = StatusMessage
 
     $scope.$watch 'order_cycle_form.$dirty', (newValue) ->
-      StatusMessage.display 'notice', 'You have unsaved changes' if newValue
+      StatusMessage.display 'notice', t("admin.unsaved_changes") if newValue
+
+    $scope.$watch 'order_cycle_form.$valid', (isValid) ->
+      StatusMessage.setValidation(isValid)
 
     $scope.loaded = ->
       Enterprise.loaded && EnterpriseFee.loaded && OrderCycle.loaded

app/assets/javascripts/admin/order_cycles/controllers/simple_create.js.coffee

@@ -8,7 +8,10 @@ angular.module('admin.orderCycles').controller "AdminSimpleCreateOrderCycleCtrl"
     $scope.enterprise_fees = EnterpriseFee.index(coordinator_id: ocInstance.coordinator_id)
 
   $scope.$watch 'order_cycle_form.$dirty', (newValue) ->
-      StatusMessage.display 'notice', 'You have unsaved changes' if newValue
+      StatusMessage.display 'notice', t("admin.unsaved_changes") if newValue
+
+  $scope.$watch 'order_cycle_form.$valid', (isValid) ->
+    StatusMessage.setValidation(isValid)
 
   $scope.init = (enterprises) ->
     enterprise = enterprises[Object.keys(enterprises)[0]]

app/assets/javascripts/admin/order_cycles/controllers/simple_edit.js.coffee

@@ -10,7 +10,10 @@ angular.module('admin.orderCycles').controller "AdminSimpleEditOrderCycleCtrl",
     $scope.init()
 
   $scope.$watch 'order_cycle_form.$dirty', (newValue) ->
-      StatusMessage.display 'notice', 'You have unsaved changes' if newValue
+      StatusMessage.display 'notice', t("admin.unsaved_changes") if newValue
+
+  $scope.$watch 'order_cycle_form.$valid', (isValid) ->
+    StatusMessage.setValidation(isValid)
 
   $scope.loaded = ->
     Enterprise.loaded && EnterpriseFee.loaded && OrderCycle.loaded

app/assets/javascripts/admin/product_import/controllers/dropdown_panels.js.coffee

@@ -0,0 +1,5 @@
+angular.module("ofn.admin").controller "DropdownPanelsCtrl", ($scope) ->
+  $scope.active = false
+
+  $scope.togglePanel = ->
+    $scope.active = !$scope.active

app/assets/javascripts/admin/product_import/controllers/import_options_form.js.coffee

@@ -0,0 +1,15 @@
+angular.module("ofn.admin").controller "ImportOptionsFormCtrl", ($scope, $rootScope, ProductImportService) ->
+
+  $scope.toggleResetAbsent = () ->
+    confirmed = confirm 'This will set stock level to zero on all products for this \n' +
+      'enterprise that are not present in the uploaded file.' if $scope.resetAbsent
+
+    if confirmed or !$scope.resetAbsent
+      ProductImportService.updateResetAbsent($scope.supplierId, $scope.resetCount, $scope.resetAbsent)
+    else
+      $scope.resetAbsent = false
+
+  $scope.resetTotal = ProductImportService.resetTotal
+
+  $rootScope.$watch 'resetTotal', (newValue) ->
+    $scope.resetTotal = newValue if newValue || newValue == 0

app/assets/javascripts/admin/product_import/services/product_import_service.js.coffee

@@ -0,0 +1,15 @@
+angular.module("ofn.admin").factory "ProductImportService", ($rootScope) ->
+  new class ProductImportService
+    suppliers: {}
+    resetTotal: 0
+
+    updateResetAbsent: (supplierId, resetCount, resetAbsent) ->
+      if resetAbsent
+        @suppliers[supplierId] = resetCount
+        @resetTotal += resetCount
+      else
+        @suppliers[supplierId] = null
+        @resetTotal -= resetCount
+
+      $rootScope.resetTotal = @resetTotal
+

app/assets/javascripts/admin/products/controllers/edit_units_controller.js.coffee

@@ -0,0 +1,24 @@
+angular.module("admin.products").controller "editUnitsCtrl", ($scope, VariantUnitManager) ->
+
+  $scope.product =
+    variant_unit: angular.element('#variant_unit').val()
+    variant_unit_scale: angular.element('#variant_unit_scale').val()
+
+  $scope.variant_unit_options = VariantUnitManager.variantUnitOptions()
+
+  if $scope.product.variant_unit == 'items'
+    $scope.variant_unit_with_scale = 'items'
+  else
+    $scope.variant_unit_with_scale = $scope.product.variant_unit + '_' + $scope.product.variant_unit_scale
+
+  $scope.setFields = ->
+    if $scope.variant_unit_with_scale == 'items'
+      variant_unit = 'items'
+      variant_unit_scale = null
+    else
+      options = $scope.variant_unit_with_scale.split('_')
+      variant_unit = options[0]
+      variant_unit_scale = options[1]
+
+    $scope.product.variant_unit = variant_unit
+    $scope.product.variant_unit_scale = variant_unit_scale

app/assets/javascripts/admin/products/controllers/variant_units_controller.js.coffee

@@ -0,0 +1,14 @@
+angular.module("admin.products").controller "variantUnitsCtrl", ($scope, VariantUnitManager, $timeout) ->
+
+  $scope.unitName = (scale, type) ->
+    VariantUnitManager.getUnitName(scale, type)
+
+  $scope.scale = angular.element('#product_variant_unit_scale').val()
+
+  $scope.updateValue = ->
+    unit_value_human = angular.element('#unit_value_human').val()
+    $scope.unit_value = unit_value_human * $scope.scale
+
+  variant_unit_value = angular.element('#variant_unit_value').val()
+  $scope.unit_value_human = variant_unit_value / $scope.scale
+  $timeout -> $scope.updateValue()

app/assets/javascripts/admin/products/products.js.coffee

@@ -1 +1 @@
-angular.module("admin.products", [])
+angular.module("admin.products", ["textAngular", "admin.utils"])

app/assets/javascripts/admin/tag_rules/controllers/tag_rules_controller.js.coffee

@@ -38,7 +38,6 @@ angular.module("admin.tagRules").controller "TagRulesCtrl", ($scope, $http, $fil
         newRule.peferred_exchange_tags = []
         newRule.preferred_matched_order_cycles_visibility = "visible"
     tagGroup.rules.push(newRule)
-    $scope.enterprise_form.$setDirty()
     $scope.updateRuleCounts()
 
   $scope.addNewTag = ->
@@ -58,3 +57,4 @@ angular.module("admin.tagRules").controller "TagRulesCtrl", ($scope, $http, $fil
         .success ->
           tagGroup.rules.splice(index, 1)
           $scope.updateRuleCounts()
+          $scope.enterprise_form.$setDirty()

app/assets/javascripts/admin/utils/directives/textangular_strip.js.coffee

@@ -0,0 +1,5 @@
+angular.module("admin.utils").directive "textangularStrip", () ->
+  restrict: 'CA'
+  link: (scope, element, attrs) ->
+    scope.stripFormatting = ($html) ->
+      return String($html).replace(/<[^>]+>/gm, '')

app/assets/javascripts/admin/utils/services/navigation_check.js.coffee

@@ -10,7 +10,6 @@ angular.module("admin.utils")
 
         $rootScope.$on "$locationChangeStart", @locationChangeStartHandler
 
-
       # Action for regular browser navigation.
       onBeforeUnloadHandler: ($event) =>
         message = @getMessage()
@@ -21,13 +20,17 @@ angular.module("admin.utils")
 
       # Action for angular navigation.
       locationChangeStartHandler: ($event) =>
-        message = @getMessage()
-        if message and not $window.confirm(message)
+        if not @confirmLeave()
           $event.stopPropagation() if $event.stopPropagation
           $event.preventDefault() if $event.preventDefault
           $event.cancelBubble = true
           $event.returnValue = false
 
+      # Check if leaving is okay
+      confirmLeave: =>
+        message = @getMessage()
+        !message or $window.confirm(message)
+
       # Runs callback functions to retreive most recently added non-empty message.
       getMessage: ->
         message = null

app/assets/javascripts/admin/utils/services/status_message.js.coffee

@@ -11,6 +11,14 @@ angular.module("admin.utils").factory "StatusMessage", ($timeout) ->
       text: ""
       style: {}
 
+    invalidMessage: ""
+
+    setValidation: (isValid) ->
+      if isValid
+        StatusMessage.invalidMessage = ''
+      else
+        StatusMessage.invalidMessage = t("admin.form_invalid")
+
     active: ->
       @statusMessage.text != ''
 

app/assets/javascripts/darkswarm/cart.js.coffee

@@ -1,8 +1,8 @@
 $ ->
-  if ($ 'form#update-cart').is('*')
-    ($ 'form#update-cart a.delete').show().one 'click', ->
-      ($ this).parents('.line-item').first().find('input.line_item_quantity').val 0
-      ($ this).parents('form').first().submit()
+  if $('form#update-cart').is('*') || $('form#update-order').is('*')
+    $('form#update-cart a.delete, form#update-order a.delete').show().one 'click', ->
+      $(this).parents('.line-item').first().find('input.line_item_quantity').val 0
+      $(this).parents('form').first().submit()
       false
 
   ($ 'form#update-cart').submit ->

app/assets/javascripts/darkswarm/controllers/edit_bought_order_controller.js.coffee

@@ -0,0 +1,12 @@
+Darkswarm.controller "EditBoughtOrderController", ($scope, $resource, Cart) ->
+  $scope.showBought = false
+
+  $scope.deleteLineItem = (id) ->
+    params = {id: id}
+    success = (response) ->
+      $(".line-item-" + id).remove()
+      Cart.removeFinalisedLineItem(id)
+    fail = (error) ->
+      console.log error
+
+    $resource("/line_items/:id").delete(params, success, fail)

app/assets/javascripts/darkswarm/controllers/order_cycle_controller.js.coffee

@@ -10,7 +10,7 @@ Darkswarm.controller "OrderCycleCtrl", ($scope, $timeout, OrderCycle) ->
       $("#order_cycle_id").trigger("openTrigger")
 
 
-Darkswarm.controller "OrderCycleChangeCtrl", ($scope, $timeout, OrderCycle, Products, Variants, Cart) ->
+Darkswarm.controller "OrderCycleChangeCtrl", ($scope, $timeout, OrderCycle, Products, Variants, Cart, ChangeableOrdersAlert) ->
   # Track previous order cycle id for use with revertOrderCycle()
   $scope.previous_order_cycle_id = OrderCycle.order_cycle.order_cycle_id
   $scope.$watch 'order_cycle.order_cycle_id', (newValue, oldValue)->
@@ -30,3 +30,5 @@ Darkswarm.controller "OrderCycleChangeCtrl", ($scope, $timeout, OrderCycle, Prod
     Variants.clear()
     Cart.clear()
     Products.update()
+    Cart.reloadFinalisedLineItems()
+    ChangeableOrdersAlert.reload()

app/assets/javascripts/darkswarm/darkswarm.js.coffee

@@ -11,8 +11,7 @@ window.Darkswarm = angular.module("Darkswarm", ["ngResource",
   'angularFileUpload',
   'angularSlideables'
   ]).config ($httpProvider, $tooltipProvider, $locationProvider, $anchorScrollProvider) ->
-  $httpProvider.defaults.headers.post['X-CSRF-Token'] = $('meta[name="csrf-token"]').attr('content')
-  $httpProvider.defaults.headers.put['X-CSRF-Token'] = $('meta[name="csrf-token"]').attr('content')
+  $httpProvider.defaults.headers['common']['X-CSRF-Token'] = $('meta[name="csrf-token"]').attr('content')
   $httpProvider.defaults.headers['common']['X-Requested-With'] = 'XMLHttpRequest'
   $httpProvider.defaults.headers.common.Accept = "application/json, text/javascript, */*"
 

app/assets/javascripts/darkswarm/directives/changeable_order_alert.js.coffee

@@ -0,0 +1,5 @@
+Darkswarm.directive "changeableOrdersAlert", (ChangeableOrdersAlert) ->
+  restrict: "C"
+  scope: true
+  link: (scope, element, attrs) ->
+    scope.alert = ChangeableOrdersAlert

app/assets/javascripts/darkswarm/directives/confirm_link_click.js.coffee

@@ -0,0 +1,9 @@
+Darkswarm.directive "confirmLinkClick", ($window) ->
+  restrict: 'A'
+  scope:
+    confirmMsg: '@confirmLinkClick'
+  link: (scope, elem, attr) ->
+    elem.bind 'click', (event) ->
+      unless confirm(scope.confirmMsg)
+        event.preventDefault()
+        event.stopPropagation()

app/assets/javascripts/darkswarm/directives/map_osm_tiles.js.coffee

@@ -15,7 +15,7 @@ Darkswarm.directive 'mapOsmTiles', ($timeout) ->
           if x < 0
             x = tilesPerGlobe + x
           # Wrap y (latitude) in a like manner if you want to enable vertical infinite scroll
-          'http://tile.openstreetmap.org/' + zoom + '/' + x + '/' + coord.y + '.png'
+          'https://a.tile.openstreetmap.org/' + zoom + '/' + x + '/' + coord.y + '.png'
         tileSize: new google.maps.Size(256, 256)
         name: 'OpenStreetMap'
         maxZoom: 18

app/assets/javascripts/darkswarm/directives/on_hand.js.coffee

@@ -6,7 +6,11 @@ Darkswarm.directive "ofnOnHand", ->
     # In cases where this field gets its value from the HTML element rather than the model,
     # initialise the model with the HTML value.
     if scope.$eval(attr.ngModel) == undefined
-      ngModel.$setViewValue elem.val()
+      # Don't dirty the model when we do this
+      setDirty = ngModel.$setDirty
+      ngModel.$setDirty = angular.noop
+      ngModel.$setViewValue(elem.val())
+      ngModel.$setDirty = setDirty
 
     ngModel.$parsers.push (viewValue) ->
       on_hand = parseInt(attr.ofnOnHand)

app/assets/javascripts/darkswarm/services/cart.js.coffee

@@ -1,4 +1,4 @@
-Darkswarm.factory 'Cart', (CurrentOrder, Variants, $timeout, $http, $modal, $rootScope, localStorageService)->
+Darkswarm.factory 'Cart', (CurrentOrder, Variants, $timeout, $http, $modal, $rootScope, $resource, localStorageService) ->
   # Handles syncing of current cart/order state to server
   new class Cart
     dirty: false
@@ -6,11 +6,15 @@ Darkswarm.factory 'Cart', (CurrentOrder, Variants, $timeout, $http, $modal, $roo
     update_enqueued: false
     order: CurrentOrder.order
     line_items: CurrentOrder.order?.line_items || []
+    line_items_finalised: CurrentOrder.order?.finalised_line_items || []
 
     constructor: ->
       for line_item in @line_items
         line_item.variant.line_item = line_item
         Variants.register line_item.variant
+      for line_item in @line_items_finalised
+        line_item.variant.line_item = line_item
+        Variants.extend line_item.variant
 
     adjust: (line_item) =>
       line_item.total_price = line_item.variant.price_with_fees * line_item.quantity
@@ -115,3 +119,15 @@ Darkswarm.factory 'Cart', (CurrentOrder, Variants, $timeout, $http, $modal, $roo
     clear: ->
       @line_items = []
       localStorageService.clearAll() # One day this will have to be moar GRANULAR
+
+    removeFinalisedLineItem: (id) =>
+      @line_items_finalised = @line_items_finalised.filter (item) ->
+        item.id != id
+
+    reloadFinalisedLineItems: =>
+      @line_items_finalised = []
+      $resource("/line_items/bought").query (items) =>
+        for line_item in items
+          line_item.variant.line_item = line_item
+          Variants.extend line_item.variant
+        @line_items_finalised = items

app/assets/javascripts/darkswarm/services/changeable_orders_alert.js.coffee

@@ -0,0 +1,14 @@
+Darkswarm.factory 'ChangeableOrdersAlert', ($http) ->
+  new class ChangeableOrdersAlert
+    html: ''
+    visible: true
+
+    constructor: ->
+      @reload()
+
+    reload: ->
+      $http.get('/shop/changeable_orders_alert').then (response) =>
+        @html = response.data.trim()
+
+    close: =>
+      @visible = false

app/assets/javascripts/darkswarm/services/orders.js.coffee

@@ -3,10 +3,12 @@ Darkswarm.factory 'Orders', (orders_by_distributor, currencyConfig, CurrentHub,
     constructor: ->
       # Populate Orders.orders from json in page.
       @orders_by_distributor = orders_by_distributor
+      @changeable_orders = []
       @currency_symbol = currencyConfig.symbol
 
       for distributor in @orders_by_distributor
-        @updateRunningBalance(distributor.distributed_orders)  
+        @findChangeableOrders(distributor.distributed_orders)
+        @updateRunningBalance(distributor.distributed_orders)
 
 
     updateRunningBalance: (orders) ->
@@ -14,3 +16,7 @@ Darkswarm.factory 'Orders', (orders_by_distributor, currencyConfig, CurrentHub,
         balances = orders.slice(i,orders.length).map (o) -> parseFloat(o.outstanding_balance)
         running_balance = balances.reduce (a,b) -> a+b
         order.running_balance = running_balance.toFixed(2)
+
+    findChangeableOrders: (orders) ->
+      for order in orders when order.changes_allowed
+        @changeable_orders.push(order)

app/assets/javascripts/templates/admin/links_dropdown.html.haml

@@ -1,7 +1,7 @@
 .ofn-drop-down
   %span
     %i.icon-check
-    Actions
+    = t('admin.actions')
     %i{ 'ng-class' => "expanded && 'icon-caret-up' || !expanded && 'icon-caret-down'" }
   %div.menu{ 'ng-show' => "expanded" }
     %a.menu_item{ 'ng-repeat' => "link in links", href: '{{link.url}}', target: "{{link.target || '_self'}}", data: { method: "{{ link.method || 'get' }}", confirm: "{{link.confirm}}" } }

app/assets/javascripts/templates/admin/modals/tag_rule_help.html.haml

@@ -1,18 +1,19 @@
 #tag-rule-help
   .margin-bottom-30.text-center
-    .text-big Tag Rules
+    .text-big
+      = t('js.admin.modals.tag_rule_help.title')
 
   .margin-bottom-30
-    .text-normal Overview
-    %p Tag rules provide a way to describe which items are visible or otherwise to which customers. Items can be Shipping Methods, Payment Methods, Products and Order Cycles.
+    .text-normal= t('js.admin.modals.tag_rule_help.overview')
+    %p= t('js.admin.modals.tag_rule_help.overview_text')
 
   .margin-bottom-30
-    .text-normal 'By Default...' Rules
-    %p Default rules allow you to hide items so that they are not visible by default. This behaviour can then be overriden by non-default rules for customers with particular tags.
+    .text-normal= t('js.admin.modals.tag_rule_help.by_default_rules')
+    %p= t('js.admin.modals.tag_rule_help.by_default_rules_text')
 
   .margin-bottom-30
-    .text-normal 'Customers Tagged...' Rules
-    %p By creating rules related to a specific customer tag, you can override the default behaviour (whether it be to show or to hide items) for customers with the specified tag.
+    .text-normal= t('js.admin.modals.tag_rule_help.customer_tagged_rules')
+    %p= t('js.admin.modals.tag_rule_help.customer_tagged_rules_text')
 
   .text-center
-    %input.button.red.icon-plus{ type: 'button', value: 'Got it', ng: { click: 'close()' } }
+    %input.button.red.icon-plus{ type: 'button', value: t('js.admin.modals.got_it'), ng: { click: 'close()' } }

app/assets/javascripts/templates/admin/new_tag_rule_dialog.html.haml

@@ -1,6 +1,6 @@
 #new-tag-rule-dialog
   .text-normal.margin-bottom-30.text-center
-    Select a rule type:
+    = t('js.admin.new_tag_rule_dialog.select_rule_type')
 
   .text-center.margin-bottom-30
     -# %select.fullwidth{ 'select2-min-search' => 5, 'ng-model' => 'newRuleType', 'ng-options' => 'ruleType.id as ruleType.name for ruleType in availableRuleTypes' }

app/assets/javascripts/templates/admin/panels/enterprise_package.html.haml

@@ -2,130 +2,128 @@
   .alpha.eight.columns
     %div{ ng: { if: "!enterprise.is_primary_producer", switch: "enterprise.sells" } }
       .info{ ng: { switch: { when: "none" } } }
-        %h3 Hub Profile
+        %h3= t('js.admin.panels.enterprise_package.hub_profile')
 
         %p
-          %strong COST: ALWAYS FREE
+          %strong= t('js.admin.panels.enterprise_package.hub_profile_cost')
 
-        %p People can find and contact you on the Open Food Network. Your enterprise will be visible on the map, and will be searchable in listings.
+        %p= t('js.admin.panels.enterprise_package.hub_profile_text1')
 
-        %p Having a profile, and making connections within your local food system through the Open Food Network will always be free.
+        %p= t('js.admin.panels.enterprise_package.hub_profile_text2')
 
       .info{ ng: { switch: { when: "any" } } }
-        %h3 Hub Shop
+        %h3= t('js.admin.panels.enterprise_package.hub_shop')
 
         %p
           %strong
             %monthly-pricing-description{ joiner: "comma" }
 
-        %p Your enterprise is the backbone of your local food system. You aggregate produce from other enterprises and can sell it through your shop on the Open Food Network.
+        %p= t('js.admin.panels.enterprise_package.hub_shop_text1')
 
-        %p Hubs can take many forms, whether they be a food co-op, a buying group, a veggie-box program, or a local grocery store.
+        %p= t('js.admin.panels.enterprise_package.hub_shop_text2')
 
-        %p If you also want to sell your own products, you will need to switch this enterprise to be a producer.
+        %p= t('js.admin.panels.enterprise_package.hub_shop_text3')
 
       .info{ ng: { switch: { default: true } } }
         %h3
-          Please Choose a Package
+          = t('js.admin.panels.enterprise_package.choose_package')
           %i.icon-arrow-right
 
         %p
-          %strong Your enterprise will not be fully activated until a package is selected from the options on the left.
+          %strong= t('js.admin.panels.enterprise_package.choose_package_text1')
 
         %p
-          Click on an option to see more detailed information about each package, and hit the red SAVE button when you are done!
-
-
+          = t('js.admin.panels.enterprise_package.choose_package_text2')
 
     %div{ ng: { if: "enterprise.is_primary_producer", switch: "enterprise.sells" } }
       .info{ ng: { switch: { when: "none" } } }
-        %h3 Profile Only
+        %h3= t('js.admin.panels.enterprise_package.profile_only')
 
         %p
-          %strong COST: ALWAYS FREE
+          %strong= t('js.admin.panels.enterprise_package.profile_only_cost')
 
-        %p A profile makes you visible and contactable to others and is a way to share your story.
+        %p= t('js.admin.panels.enterprise_package.profile_only_text1')
 
-        %p If you prefer to focus on producing food, and want to leave the work of selling it to someone else, you won't require a shop on the Open Food Network.
+        %p= t('js.admin.panels.enterprise_package.profile_only_text2')
 
-        %p Add your products to Open Food Network, allowing hubs to stock your products in their stores.
+        %p= t('js.admin.panels.enterprise_package.profile_only_text3')
 
       .info{ ng: { switch: { when: "own" } } }
-        %h3 Producer Shop
+        %h3= t('js.admin.panels.enterprise_package.producer_shop')
 
         %p
           %strong
             %monthly-pricing-description{ joiner: "comma" }
 
-        %p Sell your products directly to customers through your very own Open Food Network shopfront.
+        %p= t('js.admin.panels.enterprise_package.producer_shop_text1')
 
-        %p A Producer Shop is for your produce only, if you want to sell produce grown/produced off site, please select 'Producer Hub'.
+        %p= t('js.admin.panels.enterprise_package.producer_shop_text2')
 
       .info{ ng: { switch: { when: "any" } } }
-        %h3 Producer Hub
+        %h3= t('js.admin.panels.enterprise_package.producer_hub')
 
         %p
           %strong
             %monthly-pricing-description{ joiner: "comma" }
 
-        %p Your enterprise is the backbone of your local food system. You can sell your own produce as well as produce aggregated from other enterprises through your shopfront on the Open Food Network.
+        %p= t('js.admin.panels.enterprise_package.producer_hub_text1')
 
-        %p Producer Hubs can take many forms, whether they be a CSA, a veggie-box program, or a food co-op with a rooftop garden.
+        %p= t('js.admin.panels.enterprise_package.producer_hub_text2')
 
-        %p The Open Food Network aims to support as many hub models as possible, so no matter your situation, we want to provide the tools you need to run your organisation or local food business.
+        %p= t('js.admin.panels.enterprise_package.producer_hub_text3')
 
       .info{ ng: { switch: { default: true } } }
         %h3
-          Please Choose a Package
+          = t('js.admin.panels.enterprise_package.choose_package')
           %i.icon-arrow-right
 
         %p
-          %strong Your producer enterprise will not be fully activated until a package is selected from the options on the left.
+          %strong= t('js.admin.panels.enterprise_package.choose_package_text1')
 
         %p
-          Click on an option to see more detailed information about each package, and hit the red SAVE button when you are done!
+          = t('js.admin.panels.enterprise_package.choose_package_text2')
 
   .omega.eight.columns{ ng: { switch: "enterprise.is_primary_producer" } }
     %div{ ng: { switch: { when: "false" } } }
       %a.button.selector.hub-profile{ ng: { click: "enterprise.owned && (enterprise.sells='none')", class: "{selected: enterprise.sells=='none', disabled: !enterprise.owned}" } }
         .top
-          %h3 Profile Only
-          %p Get a listing
-        .bottom ALWAYS FREE
+          %h3= t('js.admin.panels.enterprise_package.profile_only')
+          %p= t('js.admin.panels.enterprise_package.get_listing')
+        .bottom= t('js.admin.panels.enterprise_package.always_free')
       %a.button.selector.hub{ ng: { click: "enterprise.owned && (enterprise.sells='any')", class: "{selected: enterprise.sells=='any', disabled: !enterprise.owned}" } }
         .top
-          %h3 Hub Shop
-          %p Sell produce from others
+          %h3= t('js.admin.panels.enterprise_package.hub_shop')
+          %p= t('js.admin.panels.enterprise_package.sell_produce_others')
         .bottom
           %monthly-pricing-description{ joiner: "newline" }
 
     %div{ ng: { switch: { when: "true" } } }
       %a.button.selector.producer-profile{ ng: { click: "enterprise.owned && (enterprise.sells='none')", class: "{selected: enterprise.sells=='none', disabled: !enterprise.owned}" } }
         .top
-          %h3 Profile Only
-          %p Get a listing
-        .bottom ALWAYS FREE
+          %h3= t('js.admin.panels.enterprise_package.profile_only')
+          %p= t('js.admin.panels.enterprise_package.get_listing')
+        .bottom= t('js.admin.panels.enterprise_package.always_free')
       %a.button.selector.producer-shop{ ng: { click: "enterprise.owned && (enterprise.sells='own')", class: "{selected: enterprise.sells=='own', disabled: !enterprise.owned}" } }
         .top
-          %h3 Producer Shop
-          %p Sell your own produce
+          %h3= t('js.admin.panels.enterprise_package.producer_shop')
+          %p= t('js.admin.panels.enterprise_package.sell_own_produce')
         .bottom
           %monthly-pricing-description{ joiner: "newline" }
 
       %a.button.selector.producer-hub{ ng: { click: "enterprise.owned && (enterprise.sells='any')", class: "{selected: enterprise.sells=='any', disabled: !enterprise.owned}" } }
         .top
-          %h3 Producer Hub
-          %p Sell produce from self and others
+          %h3= t('js.admin.panels.enterprise_package.producer_hub')
+          %p= t('js.admin.panels.enterprise_package.sell_both')
         .bottom
           %monthly-pricing-description{ joiner: "newline" }
 
     %a.button.update.fullwidth{ ng: { show: "enterprise.owned", class: "{disabled: saved() && !saving, saving: saving}", click: "save()" } }
       %span{ ng: {hide: "saved() || saving" } }
-        SAVE
+        = t('js.admin.panels.save')
         %i.icon-save
       %span{ ng: {show: "saved() && !saving" } }
-        SAVED
+        = t('js.admin.panels.saved')
         %i.icon-ok-sign
       %span{ ng: {show: "saving" } }
-        SAVING
+        = t('js.admin.panels.saving')
         %i.icon-refresh

app/assets/javascripts/templates/admin/panels/enterprise_producer.html.haml

@@ -1,39 +1,37 @@
 .row.enterprise_producer_panel{ ng: { controller: 'indexProducerPanelCtrl' } }
-
   .alpha.eight.columns
     .info{ ng: { show: "enterprise.is_primary_producer==true" } }
-      %h3 Producer
-      %p Producers make yummy things to eat &/or drink. You're a producer if you grow it, raise it, brew it, bake it, ferment it, milk it or mould it.
-
-      %p Producers can also perform other functions, such as aggregating food from other enterprises and selling it through a shop on the Open Food Network.
+      %h3= t('js.admin.panels.enterprise_producer.producer')
+      %p= t('js.admin.panels.enterprise_producer.producer_text1')
 
+      %p= t('js.admin.panels.enterprise_producer.producer_text2')
 
     .info{ ng: { show: "enterprise.is_primary_producer==false" } }
-      %h3 Non-Producer
-      %p Non-producers do not produce any food themselves, meaning that they cannot create their own products for sale through the Open Food Network.
+      %h3= t('js.admin.panels.enterprise_producer.non_producer')
+      %p= t('js.admin.panels.enterprise_producer.non_producer_text1')
 
-      %p Instead, non-producers specialise in linking producers to the end eater, whether it be by aggregating, grading, packing, selling or delivering food.
+      %p= t('js.admin.panels.enterprise_producer.non_producer_text2')
 
   .omega.eight.columns
     %a.button.selector.producer{ ng: { click: 'enterprise.owned && changeToProducer()', class: "{selected: enterprise.is_primary_producer==true, disabled: !enterprise.owned}" } }
       .top
-        %h3 PRODUCER
-        %p Producers of food
-      .bottom eg. GROWERS, BAKERS, BREWERS, MAKERS
+        %h3= t('js.admin.panels.enterprise_producer.producer')
+        %p= t('js.admin.panels.enterprise_producer.producer_desc')
+      .bottom= t('js.admin.panels.enterprise_producer.producer_example')
 
     %a.button.selector.non-producer{ ng: { click: 'enterprise.owned && changeToNonProducer()', class: "{selected: enterprise.is_primary_producer==false, disabled: !enterprise.owned}" } }
       .top
-        %h3 Non-Producer
-        %p All other food enterprises
-      .bottom eg. Grocery stores, Food co-ops, Buying groups
+        %h3= t('js.admin.panels.enterprise_producer.non_producer')
+        %p= t('js.admin.panels.enterprise_producer.non_producer_desc')
+      .bottom= t('js.admin.panels.enterprise_producer.non_producer_example')
 
     %a.button.update.fullwidth{ ng: { show: "enterprise.owned", class: "{disabled: saved() && !saving, saving: saving}", click: "save()" } }
       %span{ ng: {hide: "saved() || saving" } }
-        SAVE
+        = t('js.admin.panels.save')
         %i.icon-save
       %span{ ng: {show: "saved() && !saving" } }
-        SAVED
+        = t('js.admin.panels.saved')
         %i.icon-ok-sign
       %span{ ng: {show: "saving" } }
-        SAVING
+        = t('js.admin.panels.saving')
         %i.icon-refresh

app/assets/javascripts/templates/admin/panels/enterprise_status.html.haml

@@ -1,18 +1,17 @@
 .row.enterprise_status_panel{ ng: { controller: 'indexStatusPanelCtrl' } }
   .alpha.omega.sixteen.columns
-
     %h4.status-ok.text-center{ ng: { show: "issues.length == 0 && warnings.length == 0" } }
       %i.icon-ok-sign
-      {{ object.name }} is set up and ready to go!
+      = t('js.admin.panels.enterprise_status.status_title', name: '{{ object.name }}')
 
     %table{ ng: { show: "issues.length > 0 || warnings.length > 0" } }
       %thead
         %th.severity
-          Severity
+          = t('js.admin.panels.enterprise_status.severity')
         %th.description
-          Description
+          = t('js.admin.panels.enterprise_status.description')
         %th.resolve
-          Resolve
+          = t('js.admin.panels.enterprise_status.resolve')
       %tr{ ng: { repeat: "issue in issues"} }
         %td.severity
           %i.icon-warning-sign.issue

app/assets/javascripts/templates/admin/save_bar.html.haml

@@ -1,6 +1,9 @@
 #save-bar.animate-show{ ng: { show: 'dirty || persist || StatusMessage.active()' } }
   .container
     .eight.columns.alpha
-      %h5#status-message{ ng: { style: 'StatusMessage.statusMessage.style' } }
+      %h5#status-message{ ng: { show: "StatusMessage.invalidMessage == ''", style: 'StatusMessage.statusMessage.style' } }
         {{ StatusMessage.statusMessage.text || " " }}
+      %h5#status-message{ ng: { show: "StatusMessage.invalidMessage !== ''" }, style: 'color: #da5354' }
+        {{ StatusMessage.invalidMessage || " " }}
     .eight.columns.omega.text-right{ ng: { transclude: true } }
+

app/assets/javascripts/templates/admin/show_more.html.haml

@@ -1,4 +1,4 @@
 %div{ ng: { show: "data.length > limit" } }
-  %input{ type: 'button', value: 'Show More', ng: { click: 'limit = limit + increment' } }
+  %input{ type: 'button', value: t(:show_more), ng: { click: 'limit = limit + increment' } }
   or
-  %input{ type: 'button', value: "Show All ({{ data.length - limit }}  More)", ng: { click: 'limit = data.length' } }
+  %input{ type: 'button', value: t(:show_all_with_more, num: '{{ data.length - limit }}'), ng: { click: 'limit = data.length' } }

app/assets/javascripts/templates/admin/tag_autocomplete.html.haml

@@ -3,9 +3,9 @@
     {{$getDisplayText()}}
     %span.tag-with-rules{ ng: { if: "data.rules == 1" } }
       —
-      = t 'admin.has_one_rule'
+      = t('admin.has_one_rule')
     %span.tag-with-rules{ ng: { if: "data.rules > 1" } }
       —
-      = t 'admin.has_n_rules', { num: '{{data.rules}}' }
+      = t('admin.has_n_rules', { num: '{{data.rules}}' })
   %span{ ng: { if: "!data.rules" } }
     {{$getDisplayText()}}

app/assets/javascripts/templates/out_of_stock.html.haml

@@ -1,13 +1,13 @@
 %a.close-reveal-modal{"ng-click" => "$close()"}
   %i.ofn-i_009-close
 
-%h3 Reduced stock available
+%h3= t('js.out_of_stock.reduced_stock_available')
 
-%p While you've been shopping, the stock levels for one or more of the products in your cart have reduced. Here's what's changed:
+%p= t('js.out_of_stock.out_of_stock_text')
 
 %p{'ng-repeat' => "v in variants"}
   %em {{ v.name_to_display }} - {{ v.unit_to_display }}
   %span{'ng-if' => "v.count_on_hand == 0"}
-    is now out of stock.
+    = t('js.out_of_stock.now_out_of_stock')
   %span{'ng-if' => "v.count_on_hand > 0"}
-    now only has {{ v.count_on_hand }} remaining.
+    = t('js.out_of_stock.only_n_remainging', num: '{{ v.count_on_hand }}')

app/assets/javascripts/templates/partials/contact.html.haml

@@ -3,9 +3,9 @@
     %p.modal-header {{'contact' | t}}
     %p{"ng-if" => "::enterprise.phone", "ng-bind" => "::enterprise.phone"}
 
-    %p.word-wrap{"ng-if" => "::enterprise.email_address"}
+    %p{"ng-if" => "::enterprise.email_address"}
       %a{"ng-href" => "{{::enterprise.email_address | stripUrl}}", target: "_blank", mailto: true}
         %span.email{"ng-bind" => "::enterprise.email_address | stripUrl"}
 
-    %p.word-wrap{"ng-if" => "enterprise.website"}
+    %p{"ng-if" => "enterprise.website"}
       %a{"ng-href" => "http://{{::enterprise.website | stripUrl}}", target: "_blank", "ng-bind" => "::enterprise.website | stripUrl"}

app/assets/javascripts/templates/product_modal.html.haml

@@ -14,9 +14,9 @@
     .filter-shopfront.property-selectors.inline-block
       %filter-selector{ 'selector-set' => "productPropertySelectors", objects: "[product] | propertiesWithValuesOf" }
 
-    %div{"ng-if" => "product.description"}
+    %div{"ng-if" => "product.description_html"}
       %hr
-      %p.text-small{"ng-bind" => "::product.description"}
+      %p.text-small{"ng-bind-html" => "::product.description_html"}
       %hr
 
   .columns.small-12.large-6

app/assets/javascripts/templates/registration.html.haml

@@ -1,10 +0,0 @@
-%div#registration-modal{"ng-controller" => "RegistrationCtrl"}
-  %div{ ng: { show: "currentStep() == 'introduction'" } }
-    %ng-include{ src: "'registration/introduction.html'" }
-  %div{ ng: { repeat: 'step in steps', show: "currentStep() == step" } }
-    %ng-include{ src: "'registration/'+ step + '.html'" }
-  %div{ ng: { show: "currentStep() == 'finished'" } }
-    %ng-include{ src: "'registration/finished.html'" }
-        
-%a.close-reveal-modal{"ng-click" => "$close()"}  
-  %i.ofn-i_009-close

app/assets/javascripts/templates/registration/about.html.haml

@@ -1,57 +0,0 @@
-.container#registration-about
-  %ng-include{ src: "'registration/steps.html'" }
-  .row
-    .small-12.columns
-      %header
-        %h2 {{'enterprise_about_headline' | t}}
-        %h5
-          {{'enterprise_about_message' | t}}
-          %span{ ng: { class: "{brick: !enterprise.is_primary_producer, turquoise: enterprise.is_primary_producer}" } }
-            {{ enterprise.name }}
-
-  %form{ name: 'about', novalidate: true, ng: { controller: "RegistrationFormCtrl", submit: "update('images',about)" } }
-    .row
-      .small-12.columns
-        .alert-box.info{ "ofn-inline-alert" => true, ng: { show: "visible" } }
-          %h6{ "ng-bind" => "'enterprise_success' | t:{enterprise: enterprise.name}" }
-          %span {{'enterprise_registration_exit_message' | t}}
-          %a.close{ ng: { click: "close()" } } ×
-
-      .small-12.large-8.columns
-        .row
-          .small-12.columns
-            .field
-              %label{ for: 'enterprise_description' } {{'enterprise_description' | t}}:
-              %input.chunky{ id: 'enterprise_description', placeholder: "{{'enterprise_description_placeholder' | t}}", ng: { model: 'enterprise.description' } }
-        .row
-          .small-12.columns
-            .field
-              %label{ for: 'enterprise_long_desc' } {{'enterprise_long_desc' | t}}:
-              %textarea.chunky{ id: 'enterprise_long_desc',  rows: 6, placeholder: "{{'enterprise_long_desc_placeholder' | t}}", ng: { model: 'enterprise.long_description' } }
-                %small{ "ng-bind" => "'enterprise_long_desc_length' | t:{num: enterprise.long_description.length}" }
-      .small-12.large-4.columns
-        .row
-          .small-12.columns
-            .field
-              %label{ for: 'enterprise_abn' } {{'enterprise_abn' | t}}:
-              %input.chunky{ id: 'enterprise_abn', placeholder: "{{'enterprise_abn_placeholder' | t}}", ng: { model: 'enterprise.abn' } }
-        .row
-          .small-12.columns
-            .field
-              %label{ for: 'enterprise_acn' } {{'enterprise_acn' | t}}:
-              %input.chunky{ id: 'enterprise_acn', placeholder: "{{'enterprise_acn_placeholder' | t}}", ng: { model: 'enterprise.acn' } }
-        .row
-          .small-12.columns
-            .field
-              %label{ for: 'enterprise_charges_sales_tax' }= t(:charges_sales_tax)
-              %input{ id: 'enterprise_charges_sales_tax_true', type: 'radio', name: 'charges_sales_tax', value: 'true', required: true, ng: { model: 'enterprise.charges_sales_tax' } }
-              %label{ for: 'enterprise_charges_sales_tax_true' } {{'say_yes' | t}}
-              %input{ id: 'enterprise_charges_sales_tax_false', type: 'radio', name: 'charges_sales_tax', value: 'false', required: true, ng: { model: 'enterprise.charges_sales_tax' } }
-              %label{ for: 'enterprise_charges_sales_tax_false' } {{'say_no' | t}}
-              %span.error.small-12.columns{ ng: { show: "about.charges_sales_tax.$error.required && submitted" } }
-                {{'enterprise_tax_required' | t}}
-
-    .row.buttons.pad-top
-      .small-12.columns
-        %input.button.primary.right{ type: "submit", value: "{{'continue' | t}}" }
-        

app/assets/javascripts/templates/registration/contact.html.haml

@@ -1,31 +0,0 @@
-.container#registration-contact
-  %ng-include{ src: "'registration/steps.html'" }
-  .row
-    .small-12.columns
-      %header
-        %h2 {{'registration_greeting' | t}}
-        %h5{ "ng-bind" => "'who_is_managing_enterprise' | t:{enterprise: enterprise.name}" }
-  
-  %form{ name: 'contact', novalidate: true, ng: { controller: "RegistrationFormCtrl", submit: "selectIfValid('type',contact)" } }
-    .row.content
-      .small-12.medium-12.large-7.columns
-        .row
-          .small-12.columns.field
-            %label{ for: 'enterprise_contact' } {{'enterprise_contact' | t}}:
-            %input.chunky.small-12.columns{ id: 'enterprise_contact', name: 'contact', required: true, placeholder: "Contact Name", ng: { model: 'enterprise.contact' } }
-            %span.error.small-12.columns{ ng: { show: "contact.contact.$error.required && submitted" } }
-              {{'enterprise_contact_required' | t}}
-        .row
-          .small-12.columns.field
-            %label{ for: 'enterprise_email_address' } {{'enterprise_email_address' | t}}:
-            %input.chunky.small-12.columns{ id: 'enterprise_email_address', name: 'email_address', type: 'email', placeholder: "eg. charlie@thefarm.com", ng: { model: 'enterprise.email_address' } }
-        .row
-          .small-12.columns.field
-            %label{ for: 'enterprise_phone' } {{'enterprise_phone' | t}}:
-            %input.chunky.small-12.columns{ id: 'enterprise_phone', name: 'phone', placeholder: "eg. (03) 1234 5678", ng: { model: 'enterprise.phone' } }
-      .small-12.medium-12.large-5.hide-for-small-only
-
-    .row.buttons
-      .small-12.columns
-        %input.button.secondary{ type: "button", value: "{{'back' | t}}", ng: { click: "select('details')" } }
-        %input.button.primary.right{ type: "submit", value: "{{'continue' | t}}" }

app/assets/javascripts/templates/registration/details.html.haml

@@ -1,64 +0,0 @@
-.container#registration-details
-  %ng-include{ src: "'registration/steps.html'" }
-  .row
-    .small-12.columns
-      %header
-        %h2 {{'registration_detail_headline' | t}}
-        %h5{ ng: { if: "::enterprise.type != 'own'" } } {{'registration_detail_enterprise' | t}}
-        %h5{ ng: { if: "::enterprise.type == 'own'" } } {{'registration_detail_producer' | t}}
-
-  %form{ name: 'details', novalidate: true, ng: { controller: "RegistrationFormCtrl", submit: "selectIfValid('contact',details)" } }
-
-    .row
-      .small-12.medium-9.large-12.columns.end
-        .field
-          %label{ for: 'enterprise_name', ng: { if: "::enterprise.type != 'own'" } } {{'registration_detail_name_enterprise' | t}}
-          %label{ for: 'enterprise_name', ng: { if: "::enterprise.type == 'own'" } } {{'registration_detail_name_producer' | t}}
-          %input.chunky{ id: 'enterprise_name', name: 'name', placeholder: "{{'registration_detail_name_placeholder' | t}}", required: true, ng: { model: 'enterprise.name' } }
-          %span.error{ ng: { show: "details.name.$error.required && submitted" } }
-            {{'registration_detail_name_error' | t}}
-
-    .row
-      .small-12.medium-9.large-6.columns
-        .field
-          %label{ for: 'enterprise_address' } {{'registration_detail_address1' | t}}
-          %input.chunky{ id: 'enterprise_address', name: 'address1', required: true, placeholder: "{{'registration_detail_address1_placeholder' | t}}", required: true, ng: { model: 'enterprise.address.address1' } }
-          %span.error{ ng: { show: "details.address1.$error.required && submitted" } }
-            {{'registration_detail_address1_error' | t}}
-        .field
-          %label{ for: 'enterprise_address2' } {{'registration_detail_address2' | t}}
-          %input.chunky{ id: 'enterprise_address2', name: 'address2', required: false, placeholder: "", required: false, ng: { model: 'enterprise.address.address2' } }
-
-      .small-12.medium-9.large-6.columns.end
-        .row
-          .small-12.medium-8.large-8.columns
-            .field
-              %label{ for: 'enterprise_city' } {{'registration_detail_suburb' | t}}
-              %input.chunky{ id: 'enterprise_city', name: 'city', required: true, placeholder: "{{'registration_detail_suburb_placeholder' | t}}", ng: { model: 'enterprise.address.city' } }
-              %span.error{ ng: { show: "details.city.$error.required && submitted" } }
-                {{'registration_detail_suburb_error' | t}}
-          .small-12.medium-4.large-4.columns
-            .field
-              %label{ for: 'enterprise_zipcode' } {{'registration_detail_postcode' | t}}
-              %input.chunky{ id: 'enterprise_zipcode', name: 'zipcode', required: true, placeholder: "{{'registration_detail_postcode_placeholder' | t}}", ng: { model: 'enterprise.address.zipcode' } }
-              %span.error{ ng: { show: "details.zipcode.$error.required && submitted" } }
-                {{'registration_detail_postcode_error' | t}}
-        .row
-          .small-12.medium-4.large-4.columns
-            .field
-              %label{ for: 'enterprise_state' } {{'registration_detail_state' | t}}
-              %select.chunky{ id: 'enterprise_state', name: 'state', ng: { model: 'enterprise.address.state_id', options: 's.id as s.abbr for s in enterprise.country.states', show: 'countryHasStates()', required: 'countryHasStates()' } }
-              %span.error{ ng: { show: "details.state.$error.required && submitted" } }
-                {{'registration_detail_state_error' | t}}
-          .small-12.medium-8.large-8.columns
-            .field
-              %label{ for: 'enterprise_country' } {{'registration_detail_country' | t}}
-              %select.chunky{ id: 'enterprise_country', name: 'country', required: true, ng: { model: 'enterprise.country', options: 'c as c.name for c in countries' } }
-              %span.error{ ng: { show: "details.country.$error.required && submitted" } }
-                {{'registration_detail_country_error' | t}}
-
-
-    .row.buttons
-      .small-12.columns
-        %hr
-        %input.button.primary.right{ type: "submit", value: "{{'continue' | t}}" }

app/assets/javascripts/templates/registration/finished.html.haml

@@ -1,15 +0,0 @@
-.container#registration-finished
-  .row
-    .small-12.columns.pad-top
-      %header
-        %h2 {{'registration_finished_headline' | t}}
-        .panel.callout
-          %p{ "ng-bind" => "'registration_finished_thanks' | t:{enterprise: enterprise.name}" }
-          %p {{'registration_finished_login' | t}}
-  .row
-    .small-12.columns.text-center
-      %h4{ "ng-bind" => "'registration_finished_activate' | t:{enterprise: enterprise.name}" }
-
-      %p{ "ng-bind-html" => "'registration_finished_activate_instruction_html' | t:{email: enterprise.email}"}
-
-      %a.button.primary{ type: "button", href: "/" } {{'registration_finished_action' | t}} >

app/assets/javascripts/templates/registration/images.html.haml

@@ -1,22 +0,0 @@
-.container#registration-images{ 'nv-file-drop' => true, uploader: "imageUploader", options:"{ alias: imageStep }", ng: { controller: "EnterpriseImageCtrl" } }
-  %ng-include{ src: "'registration/steps.html'" }
-  .row
-    .small-12.columns
-      %header
-        %h2 {{'registration_images_headline' | t}}
-        %h5 {{'registration_images_description' | t}}
-        
-  %form{ name: 'images', novalidate: true, ng: { controller: "RegistrationFormCtrl", submit: "select('social')" } }
-    .row{ ng: { repeat: 'image_step in imageSteps', show: "imageStep == image_step" } }
-      %ng-include{ src: "'registration/images/'+ image_step + '.html'" }
-
-    .row.buttons.pad-top{ ng: { if: "imageStep == 'logo'" } }
-      .small-12.columns
-        %input.button.secondary{ type: "button", value: "Back", ng: { click: "select('about')" } }
-         
-        %input.button.primary.right{ type: "button", value: "Continue", ng: { click: "imageSelect('promo')" } }
-
-    .row.buttons.pad-top{ ng: { if: "imageStep == 'promo'" } }
-      .small-12.columns
-        %input.button.secondary{ type: "button", value: "{{'back' | t}}", ng: { click: "imageSelect('logo')" } }
-          %input.button.primary.right{ type: "submit", value: "{{'continue' | t}}" }

app/assets/javascripts/templates/registration/images/logo.html.haml

@@ -1,45 +0,0 @@
-.small-12.medium-12.large-6.columns
-  .row
-    .small-12.columns.center
-      .row
-        .small-12.columns.center
-          %h4
-            {{'select_logo' | t}}
-      .row
-        .small-12.columns.center
-          %span.small
-            {{'logo_tip' | t}}
-      .row.pad-top
-        .small-12.columns
-          .image-select.small-12.columns
-            %label.small-12.columns.button{ for: 'image-select' } {{'logo_label' | t}}
-            %input#image-select{ type: 'file', hidden: true, 'nv-file-select' => true, uploader: "imageUploader", options: '{ alias: imageStep }' }
-  .row.show-for-large-up
-    .large-12.columns
-      %span#or.large-12.columns
-        {{'action_or' | t}}
-  .row.show-for-large-up
-    .large-12.columns
-      #image-over{ 'nv-file-over' => true, uploader: "imageUploader" }
-        {{'logo_drag' | t}}
-.small-12.medium-12.large-6.columns
-  .row
-    .small-12.columns.center
-      .row
-        .small-12.columns.center
-          %h4
-            {{'review_logo' | t}}
-      .row
-        .small-12.columns.center
-          %span.small
-            {{'review_logo_tip' | t}}
-      .row.pad-top
-        .small-12.columns.center
-          #image-placeholder.logo
-            %img{ ng: { show: "imageSrc() && !imageUploader.isUploading", src: '{{ imageSrc() }}' } }
-            .message{ ng: { hide: "imageSrc() || imageUploader.isUploading" } }
-              {{'logo_placeholder' | t}}
-            .loading{ ng: { hide: "!imageUploader.isUploading" } }
-              %img.spinner{ src: "/assets/spinning-circles.svg" }
-              %br/
-              {{'uploading' | t}}

app/assets/javascripts/templates/registration/images/promo.html.haml

@@ -1,43 +0,0 @@
-.small-12.medium-12.large-12.columns
-  .row
-    .small-12.columns.center
-      %h4
-        {{'select_promo_image' | t}}
-  .row
-    .small-12.medium-12.large-5.columns.center
-      .row
-        .small-12.columns.center
-          %span.small
-            {{'promo_image_tip' | t}}
-      .row.pad-top
-        .small-12.columns
-          .image-select.small-12.columns
-            %label.small-12.columns.button{ for: 'image-select' } {{'promo_image_label' | t}}
-            %input#image-select{ type: 'file', hidden: true, 'nv-file-select' => true, uploader: "imageUploader", options: '{ alias: imageStep }' }
-    .large-2.columns
-      %span#or.horizontal.large-12.columns
-        {{'action_or' | t}}
-    .large-5.columns
-      #image-over{ 'nv-file-over' => true, uploader: "imageUploader" }
-        {{'promo_image_drag' | t}}
-.small-12.medium-12.large-12.columns.pad-top
-  .row
-    .small-12.columns.center
-      %h4
-        {{'review_promo_image' | t}}
-  .row
-    .small-12.columns.center
-      .row
-        .small-12.columns.center
-          %span.small
-            {{'review_promo_image_tip' | t}}
-      .row.pad-top
-        .small-12.columns.center
-          #image-placeholder.promo
-            %img{ ng: { show: "imageSrc() && !imageUploader.isUploading", src: '{{ imageSrc() }}' } }
-            .message{ ng: { hide: "imageSrc() || imageUploader.isUploading" } }
-              {{'promo_image_placeholder' | t}}
-            .loading{ ng: { hide: "!imageUploader.isUploading" } }
-              %img.spinner{ src: "/assets/spinning-circles.svg" }
-              %br/
-              {{'uploading' | t}}

app/assets/javascripts/templates/registration/introduction.html.haml

@@ -1,41 +0,0 @@
-.row
-  .small-12.columns
-    %header
-      %h2 {{'registration_greeting' | t}}
-      %h4
-        %small
-          %i.ofn-i_040-hub
-        {{'registration_intro' | t}}
-    .hide-for-large-up
-      %hr
-      %input.button.small.primary{ type: "button", value: "{{'registration_action' | t}}", ng: { click: "select('details')" } } 
-    %hr 
-
-.row{ 'data-equalizer' => true }
-  .small-12.medium-12.large-6.columns.pad-top{ 'data-equalizer-watch' => true }
-    %h5 {{'registration_checklist' | t}}:
-    %ul.check-list
-      %li 
-        {{'registration_time' | t}}
-      %li 
-        {{'registration_enterprise_address' | t}}
-      %li 
-        {{'registration_contact_details' | t}}
-      %li 
-        {{'registration_logo' | t}}
-      %li 
-        {{'registration_promo_image' | t}}
-      %li 
-        {{'registration_about_us' | t}}
-
-  .small-9.medium-8.large-5.columns.pad-top.end{ 'data-equalizer-watch' => true}
-    %h5
-      {{'registration_outcome_headline' | t}}
-    %p{ "ng-bind-html" => "t('registration_outcome1_html')" }
-    %p {{'registration_outcome2' | t}}
-    %p {{'registration_outcome3' | t}}
-
-.row.show-for-large-up
-  .small-12.columns
-    %hr
-    %input.button.primary.right{ type: "button", value: "{{'registration_action' | t}}", ng: { click: "select('details')" } }

app/assets/javascripts/templates/registration/limit_reached.html.haml

@@ -1,16 +0,0 @@
-.row
-  .small-12.columns
-    %header
-      %h2 {{'limit_reached_headline' | t}}
-      %h4 {{'limit_reached_message' | t}}
-.row
-  .small-12.medium-3.large-2.columns.text-right.hide-for-small-only
-    %img{:src => "/assets/potatoes.png"}
-  .small-12.medium-9.large-10.columns
-    %p
-      {{'limit_reached_text' | t}}
-      %strong Open Food Network.
-.row
-  .small-12.columns
-    %hr
-    %input.button.primary{ type: "button", value: "{{'limit_reached_action' | t}}", ng: { click: "close()" } }

app/assets/javascripts/templates/registration/social.html.haml

@@ -1,45 +0,0 @@
-.container#registration-social
-  %ng-include{ src: "'registration/steps.html'" }
-
-  .row
-    .small-12.columns
-      %header
-        %h2 {{'enterprise_final_step' | t}}
-        %h5{ "ng-bind" => "'enterprise_social_text' | t:{enterprise: enterprise.name}" }
-
-  %form{ name: 'social', novalidate: true, ng: { controller: "RegistrationFormCtrl", submit: "update('finished',social)" } }
-    .row.content
-      .small-12.large-7.columns
-        .row
-          .small-12.columns
-            .field
-              %label{ for: 'enterprise_website' } {{'website' | t}}:
-              %input.chunky{ id: 'enterprise_website', placeholder: "{{'website_placeholder' | t}}", ng: { model: 'enterprise.website' } }
-        .row
-          .small-12.columns
-            .field
-              %label{ for: 'enterprise_facebook' } {{'facebook' | t}}:
-              %input.chunky{ id: 'enterprise_facebook', placeholder: "{{'facebook_placeholder' | t}}", ng: { model: 'enterprise.facebook' } }
-        .row
-          .small-12.columns
-            .field
-              %label{ for: 'enterprise_linkedin' } {{'linkedin' | t}}:
-              %input.chunky{ id: 'enterprise_linkedin', placeholder: "{{'linkedin_placeholder' | t}}", ng: { model: 'enterprise.linkedin' } }
-      .small-12.large-5.columns
-        .row
-          .small-12.columns
-            .field
-              %label{ for: 'enterprise_twitter' } {{'twitter' | t}}:
-              %input.chunky{ id: 'enterprise_twitter', placeholder: "{{'twitter_placeholder' | t}}", ng: { model: 'enterprise.twitter' } }
-        .row
-          .small-12.columns
-            .field
-              %label{ for: 'enterprise_instagram' } {{'instagram' | t}}:
-              %input.chunky{ id: 'enterprise_instagram', placeholder: "{{'instagram_placeholder' | t}}", ng: { model: 'enterprise.instagram' } }
-
-    .row.buttons
-      .small-12.columns
-        %input.button.secondary{ type: "button", value: "{{'back' | t}}", ng: { click: "select('images')" } }
-          %input.button.primary.right{ type: "submit", value: "{{'continue' | t}}" }
-
-

app/assets/javascripts/templates/registration/steps.html.haml

@@ -1,3 +0,0 @@
-.row#progress-bar
-  .small-12.medium-2.columns.item{ ng: { repeat: 'step in steps', class: "{active: (currentStep() == step),'show-for-medium-up': (currentStep() != step)}" } }
-    {{ $index+1 + ". " + step }}

app/assets/javascripts/templates/registration/type.html.haml

@@ -1,47 +0,0 @@
-.container#registration-type
-
-  %ng-include{ src: "'registration/steps.html'" }
-
-  .row
-    .small-12.columns
-      %header
-        %h2{ "ng-bind" => "'registration_type_headline' | t:{enterprise: enterprise.name}" }
-        %h4
-          {{'registration_type_question' | t}}
-
-  %form{ name: 'type', novalidate: true, ng: { controller: "RegistrationFormCtrl", submit: "create(type)" } }
-    .row#enterprise-types{ 'data-equalizer' => true, ng: { if: "::enterprise.type != 'own'" } }
-      .small-12.columns.field
-        .row
-          .small-12.medium-6.large-6.columns{ 'data-equalizer-watch' => true }
-            %a.btnpanel#producer-panel{ href: "#", ng: { click: "enterprise.is_primary_producer = true", class: "{selected: enterprise.is_primary_producer}" } }
-              %i.ofn-i_059-producer
-              %h4 {{'registration_type_producer' | t}}
-
-          .small-12.medium-6.large-6.columns{ 'data-equalizer-watch' => true }
-            %a.btnpanel#hub-panel{ href: "#", ng: { click: "enterprise.is_primary_producer = false", class: "{selected: enterprise.is_primary_producer == false}" } }
-              %i.ofn-i_063-hub
-              %h4 {{'registration_type_no_producer' | t}}
-
-        .row
-          .small-12.columns
-            %input.chunky{ id: 'enterprise_is_primary_producer', name: 'is_primary_producer', hidden: true, required: true, ng: { model: 'enterprise.is_primary_producer' } }
-            %span.error{ ng: { show: "type.is_primary_producer.$error.required && submitted" } }
-              {{'registration_type_error' | t}}
-        .row
-          .small-12.columns
-            .panel.callout
-              .left
-                %i.ofn-i_013-help
-                 
-              %p {{'registration_type_producer_help' | t}}
-            .panel.callout
-              .left
-                %i.ofn-i_013-help
-                 
-              %p {{'registration_type_no_producer_help' | t}}
-
-    .row.buttons
-      .small-12.columns
-        %input.button.secondary{ type: "button", value: "{{'back' | t}}", ng: { click: "select('contact')" } }
-        %input.button.primary.right{ type: "submit", value: "{{'create_profile' | t}}" }

app/assets/stylesheets/admin/alert.css.sass

@@ -1,15 +0,0 @@
-.alert
-  border: 3px solid #919191
-  border-radius: 6px
-  margin-bottom: 20px
-  color: #919191
-  padding: 5px 10px
-  h6
-    color: #919191
-  .message
-    font-weight: bold
-  &:hover
-    border-color: #DA5354
-    color: #DA5354
-    h6
-      color: #DA5354

app/assets/stylesheets/admin/alert.css.scss

@@ -0,0 +1,24 @@
+.alert {
+  border: 3px solid #919191;
+  border-radius: 6px;
+  margin-bottom: 20px;
+  color: #919191;
+  padding: 5px 10px;
+
+  h6 {
+    color: #919191;
+  }
+
+  .message {
+    font-weight: bold;
+  }
+
+  &:hover {
+    border-color: #DA5354;
+    color: #DA5354;
+
+    h6 {
+      color: #DA5354;
+    }
+  }
+}

app/assets/stylesheets/admin/animations.css.scss

@@ -1,10 +1,14 @@
-@-webkit-keyframes slideInUp
-  0%
-    -webkit-transform: translateY(20px)
-    transform: translateY(20px)
-  100%
-    -webkit-transform: translateY(0)
-    transform: translateY(0)
+@-webkit-keyframes slideInUp {
+  0% {
+    -webkit-transform: translateY(20px);
+    transform: translateY(20px);
+  }
+
+  100% {
+    -webkit-transform: translateY(0);
+    transform: translateY(0);
+  }
+}
 
 // @-webkit-keyframes slideOutDown
 //   0%
@@ -14,13 +18,14 @@
 //     -webkit-transform: translateY(20px)
 //     transform: translateY(20px)
 
-.animate-show
-  -webkit-animation-name: slideInUp
-  animation-name: slideInUp
-  -webkit-animation-duration: 0.3s
-  animation-duration: 0.3s
-  -webkit-animation-fill-mode: both
-  animation-fill-mode: both
+.animate-show {
+  -webkit-animation-name: slideInUp;
+  animation-name: slideInUp;
+  -webkit-animation-duration: 0.3s;
+  animation-duration: 0.3s;
+  -webkit-animation-fill-mode: both;
+  animation-fill-mode: both;
+
   // line-height: 20px
   // opacity: 1
 
@@ -33,3 +38,4 @@
   //   animation-fill-mode: both
   //   // line-height: 20px
   //   // opacity: 1
+}

app/assets/stylesheets/admin/change_type_form.css.sass

@@ -1,72 +0,0 @@
-@import ../darkswarm/branding
-@import ../darkswarm/mixins
-
-#change_type
-  section
-    margin: 2em 0 0 0
-    &, & *
-      color: #5498da
-
-  .description
-    background-color: #eff5fc
-    margin-top: -2em
-    padding: 4em 2em 2em 1em
-    @media all and (max-width: 786px)
-      margin-bottom: 2em
-
-  .admin-cta
-    border: 1px solid #5498da
-    @include border-radius(3px)
-    text-align: center
-    padding: 1em
-
-  .error
-    display: block
-    color: #f57e80
-    border: 1px solid #f57e80
-    background-color: #fde6e7
-    @include border-radius(3px)
-    margin-bottom: 1em
-    padding: 0.5em
-
-  a.selector
-    position: relative
-    border: 2px solid black
-    text-align: center
-    width: 100%
-    cursor: pointer
-    &, & *
-      color: white
-    &:after, &:before
-      top: 100%
-      left: 50%
-      border: solid transparent
-      content: " "
-      height: 0
-      width: 0
-      position: absolute
-      pointer-events: none
-    &:after
-      border-color: rgba(136, 183, 213, 0)
-      border-top-color: #5498da
-      border-width: 12px
-      margin-left: -12px
-    &:hover
-      &:after
-        border-top-color: #9fc820
-    &:before
-      border-color: rgba(84, 152, 218, 0)
-      border-top-color: black
-      border-width: 15px
-      margin-left: -15px
-    .bottom
-      background: repeating-linear-gradient(60deg, rgba(84, 152, 218, 0), rgba(84, 152, 218, 0) 5px, rgba(255, 255, 255, 0.25) 5px, rgba(255, 255, 255, 0.25) 10px)
-      margin-top: 1em
-      margin-left: -15px
-      margin-right: -15px
-      padding: 5px
-      text-transform: uppercase
-    &.selected
-      background-color: black
-      &:after, &:hover &:after
-        border-top-color: black

app/assets/stylesheets/admin/change_type_form.css.scss

@@ -0,0 +1,103 @@
+@import "../darkswarm/branding";
+@import "../darkswarm/mixins";
+
+#change_type {
+  section {
+    margin: 2em 0 0 0;
+
+    &, & * {
+      color: #5498da;
+    }
+  }
+
+  .description {
+    background-color: #eff5fc;
+    margin-top: -2em;
+    padding: 4em 2em 2em 1em;
+
+    @media all and (max-width: 786px) {
+      margin-bottom: 2em;
+    }
+  }
+
+  .admin-cta {
+    border: 1px solid #5498da;
+
+    @include border-radius(3px);
+
+    text-align: center;
+    padding: 1em;
+  }
+
+  .error {
+    display: block;
+    color: #f57e80;
+    border: 1px solid #f57e80;
+    background-color: #fde6e7;
+
+    @include border-radius(3px);
+
+    margin-bottom: 1em;
+    padding: 0.5em;
+  }
+
+  a.selector {
+    position: relative;
+    border: 2px solid black;
+    text-align: center;
+    width: 100%;
+    cursor: pointer;
+
+    &, & * {
+      color: white;
+    }
+
+    &:after, &:before {
+      top: 100%;
+      left: 50%;
+      border: solid transparent;
+      content: " ";
+      height: 0;
+      width: 0;
+      position: absolute;
+      pointer-events: none;
+    }
+
+    &:after {
+      border-color: rgba(136, 183, 213, 0);
+      border-top-color: #5498da;
+      border-width: 12px;
+      margin-left: -12px;
+    }
+
+    &:hover {
+      &:after {
+        border-top-color: #9fc820;
+      }
+    }
+
+    &:before {
+      border-color: rgba(84, 152, 218, 0);
+      border-top-color: black;
+      border-width: 15px;
+      margin-left: -15px;
+    }
+
+    .bottom {
+      background: repeating-linear-gradient(60deg, rgba(84, 152, 218, 0), rgba(84, 152, 218, 0) 5px, rgba(255, 255, 255, 0.25) 5px, rgba(255, 255, 255, 0.25) 10px);
+      margin-top: 1em;
+      margin-left: -15px;
+      margin-right: -15px;
+      padding: 5px;
+      text-transform: uppercase;
+    }
+
+    &.selected {
+      background-color: black;
+
+      &:after, &:hover &:after {
+        border-top-color: black;
+      }
+    }
+  }
+}

app/assets/stylesheets/admin/components/save_bar.sass

@@ -1,14 +0,0 @@
-#save-bar
-  position: fixed
-  width: 100%
-  z-index: 100
-  bottom: 0px
-  left: 0
-  padding: 8px 8px
-  font-weight: bold
-  background-color: #eff5fc
-  color: #5498da
-  h5
-    color: #5498da
-  input
-    margin-right: 5px

app/assets/stylesheets/admin/components/save_bar.scss

@@ -0,0 +1,19 @@
+#save-bar {
+  position: fixed;
+  width: 100%;
+  z-index: 100;
+  bottom: 0px;
+  left: 0;
+  padding: 8px 8px;
+  font-weight: bold;
+  background-color: #eff5fc;
+  color: #5498da;
+
+  h5 {
+    color: #5498da;
+  }
+
+  input {
+    margin-right: 5px;
+  }
+}

app/assets/stylesheets/admin/components/trial_progess_bar.sass

@@ -1,9 +0,0 @@
-#trial_progress_bar
-  position: fixed
-  left: 0px
-  bottom: 0px
-  width: 100vw
-  padding: 8px 10px
-  font-weight: bold
-  background-color: #5498da
-  color: white

app/assets/stylesheets/admin/components/trial_progess_bar.scss

@@ -0,0 +1,10 @@
+#trial_progress_bar {
+  position: fixed;
+  left: 0px;
+  bottom: 0px;
+  width: 100vw;
+  padding: 8px 10px;
+  font-weight: bold;
+  background-color: #5498da;
+  color: white;
+}

app/assets/stylesheets/admin/dashboard-single-ent.css.sass

@@ -1,33 +0,0 @@
-@import ../darkswarm/mixins
-
-.alert-box
-  position: relative
-  display: block
-  background-color: #eff5dc
-  border: 1px solid #9fc820
-  color: #666
-  margin-top: 1em
-  margin-bottom: 1em
-  @include border-radius(3px)
-  transition: opacity 300ms ease-out
-  padding: 0.77778em 1.33333em 0.77778em 0.77778em
-  a.close
-    position: absolute
-    right: 5px
-    top: 0px
-    font-size: 1.5em
-
-
-.dashboard_item.single-ent
-  .header
-    padding: 0.77778em 1.33333em 0.77778em 0.77778em
-    height: auto !important
-  .list
-    .button.bottom
-      width: 100%
-
-.button.big
-  width: 100%
-  font-size: 1rem
-  @include border-radius(25px)
-  padding: 15px

app/assets/stylesheets/admin/dashboard-single-ent.css.scss

@@ -0,0 +1,45 @@
+@import "../darkswarm/mixins";
+
+.alert-box {
+  position: relative;
+  display: block;
+  background-color: #eff5dc;
+  border: 1px solid #9fc820;
+  color: #666;
+  margin-top: 1em;
+  margin-bottom: 1em;
+
+  @include border-radius(3px);
+
+  transition: opacity 300ms ease-out;
+  padding: 0.77778em 1.33333em 0.77778em 0.77778em;
+
+  a.close {
+    position: absolute;
+    right: 5px;
+    top: 0px;
+    font-size: 1.5em;
+  }
+}
+
+.dashboard_item.single-ent {
+  .header {
+    padding: 0.77778em 1.33333em 0.77778em 0.77778em;
+    height: auto !important;
+  }
+
+  .list {
+    .button.bottom {
+      width: 100%;
+    }
+  }
+}
+
+.button.big {
+  width: 100%;
+  font-size: 1rem;
+
+  @include border-radius(25px);
+
+  padding: 15px;
+}

app/assets/stylesheets/admin/dashboard_item.css.sass

@@ -1,159 +0,0 @@
-div.dashboard_item
-  margin-bottom: 30px
-
-  .centered
-    text-align: center
-
-  .text-icon
-    margin-top: 8px
-    display: block
-    font-size: 16px
-    font-weight: bold
-    color: #fff
-    padding: 0px 6px
-    border-radius: 10px
-    &.green
-      background-color: #9fc820
-    &.red
-      background-color: #DA5354
-    &.orange
-      background-color: #DA7F52
-
-  div.header
-    height: 50px
-    border-radius: 6px 6px 0px 0px
-    border: 1px solid #5498da
-    position: relative
-
-    a[ofn-with-tip]
-      position: absolute
-      right: 5px
-      bottom: 5px
-
-    &.red
-      border-color: #DA5354
-      border-width: 3px
-      h3
-        color: #DA5354
-
-    &.orange
-      border-color: #DA7F52
-      border-width: 3px
-      h3
-        color: #DA7F52
-
-    h3.alpha
-      height: 100%
-      padding: 10px 5px 0px 3%
-
-    a
-      border-radius: 0px 4px 0px 0px
-      margin-left: 8px
-      height: 100%
-      padding: 15px 2px 0px 2px
-
-  .tabs
-    height: 30px
-    border: solid #5498da
-    border-width: 0px 0px 1px 0px
-    margin-top: 3px
-    div.dashboard_tab
-      cursor: pointer
-      height: 30px
-      color: #fff
-      background-color: #5498da
-      padding: 5px 5px 0px 5px
-      text-align: center
-      font-weight: bold
-      border: solid #5498da
-      border-width: 1px 1px 0px 1px
-      &:hover
-        background-color: #9fc820
-      &.selected
-        color: #5498da
-        background-color: #fff
-
-  .list
-    max-height: 250px
-    overflow-y: auto
-    overflow-x: hidden
-
-  .list-title
-    border: solid #5498da
-    border-width: 0px 1px 0px 1px
-    span
-      font-size: 105%
-      padding: 10px 0px
-      font-weight: bold
-    span.alpha
-      padding: 10px 2px 10px 5%
-
-  .list-item
-    border: solid #5498da
-    border-width: 0px 1px 0px 1px
-    height: 38px
-    span.alpha
-      font-weight: bold
-      margin-left: -3px
-      padding: 10px 2px 0px 5%
-    span.omega
-      padding-right: 13px
-      margin-right: -3px
-      text-align: right
-    .icon-arrow-right
-      padding-top: 6px
-      font-size: 20px
-    .icon-warning-sign
-      color: #DA7F52
-      font-size: 30px
-    .icon-remove-sign
-      color: #DA5354
-      font-size: 30px
-    .icon-ok-sign
-      color: #9fc820
-      font-size: 30px
-    &.orange
-      color: #DA7F52
-      border: solid #DA7F52
-    &.red
-      color: #DA5354
-      border: solid #DA5354
-    &.orange, &.red
-      border-width: 0px 3px 0px 3px
-    &.even
-      background-color: #fff
-    &.odd
-      background-color: #eff5fc
-    &.even, &.odd
-      &:hover
-        color: #ffffff
-        background-color: #9fc820
-        .icon-arrow-right
-          color: #fff
-        .icon-remove-sign
-          color: #fff
-        .icon-warning-sign
-          color: #fff
-        .icon-ok-sign
-          color: #fff
-        .text-icon
-          &.green
-            color: #9fc820
-            background-color: #fff
-
-  a.button
-    color: #fff
-    font-size: 110%
-    font-weight: bold
-    text-align: center
-    &.orange
-      background-color: #DA7F52
-    &.blue
-      background-color: #5498da
-    &.red
-      background-color: #DA5354
-    &:hover
-      background-color: #9fc820
-    &.bottom
-      border-radius: 0px 0px 6px 6px
-      padding: 15px 15px

app/assets/stylesheets/admin/dashboard_item.css.scss

@@ -0,0 +1,239 @@
+div.dashboard_item {
+  margin-bottom: 30px;
+
+  .centered {
+    text-align: center;
+  }
+
+  .text-icon {
+    margin-top: 8px;
+    display: block;
+    font-size: 16px;
+    font-weight: bold;
+    color: #fff;
+    padding: 0px 6px;
+    border-radius: 10px;
+
+    &.green {
+      background-color: #9fc820;
+    }
+
+    &.red {
+      background-color: #DA5354;
+    }
+
+    &.orange {
+      background-color: #DA7F52;
+    }
+  }
+
+  div.header {
+    height: 50px;
+    border-radius: 6px 6px 0px 0px;
+    border: 1px solid #5498da;
+    position: relative;
+
+    a[ofn-with-tip] {
+      position: absolute;
+      right: 5px;
+      bottom: 5px;
+    }
+
+    &.red {
+      border-color: #DA5354;
+      border-width: 3px;
+
+      h3 {
+        color: #DA5354;
+      }
+    }
+
+    &.orange {
+      border-color: #DA7F52;
+      border-width: 3px;
+
+      h3 {
+        color: #DA7F52;
+      }
+    }
+
+    h3.alpha {
+      height: 100%;
+      padding: 10px 5px 0px 3%;
+    }
+
+    a {
+      border-radius: 0px 4px 0px 0px;
+      margin-left: 8px;
+      height: 100%;
+      padding: 15px 2px 0px 2px;
+    }
+  }
+
+  .tabs {
+    height: 30px;
+    border: solid #5498da;
+    border-width: 0px 0px 1px 0px;
+    margin-top: 3px;
+
+    div.dashboard_tab {
+      cursor: pointer;
+      height: 30px;
+      color: #fff;
+      background-color: #5498da;
+      padding: 5px 5px 0px 5px;
+      text-align: center;
+      font-weight: bold;
+      border: solid #5498da;
+      border-width: 1px 1px 0px 1px;
+
+      &:hover {
+        background-color: #9fc820;
+      }
+
+      &.selected {
+        color: #5498da;
+        background-color: #fff;
+      }
+    }
+  }
+
+  .list {
+    max-height: 250px;
+    overflow-y: auto;
+    overflow-x: hidden;
+  }
+
+  .list-title {
+    border: solid #5498da;
+    border-width: 0px 1px 0px 1px;
+
+    span {
+      font-size: 105%;
+      padding: 10px 0px;
+      font-weight: bold;
+    }
+
+    span.alpha {
+      padding: 10px 2px 10px 5%;
+    }
+  }
+
+  .list-item {
+    border: solid #5498da;
+    border-width: 0px 1px 0px 1px;
+    height: 38px;
+
+    span.alpha {
+      font-weight: bold;
+      margin-left: -3px;
+      padding: 10px 2px 0px 5%;
+    }
+
+    span.omega {
+      padding-right: 13px;
+      margin-right: -3px;
+      text-align: right;
+    }
+
+    .icon-arrow-right {
+      padding-top: 6px;
+      font-size: 20px;
+    }
+
+    .icon-warning-sign {
+      color: #DA7F52;
+      font-size: 30px;
+    }
+
+    .icon-remove-sign {
+      color: #DA5354;
+      font-size: 30px;
+    }
+
+    .icon-ok-sign {
+      color: #9fc820;
+      font-size: 30px;
+    }
+
+    &.orange {
+      color: #DA7F52;
+      border: solid #DA7F52;
+    }
+
+    &.red {
+      color: #DA5354;
+      border: solid #DA5354;
+    }
+
+    &.orange, &.red {
+      border-width: 0px 3px 0px 3px;
+    }
+
+    &.even {
+      background-color: #fff;
+    }
+
+    &.odd {
+      background-color: #eff5fc;
+    }
+
+    &.even, &.odd {
+      &:hover {
+        color: #ffffff;
+        background-color: #9fc820;
+
+        .icon-arrow-right {
+          color: #fff;
+        }
+
+        .icon-remove-sign {
+          color: #fff;
+        }
+
+        .icon-warning-sign {
+          color: #fff;
+        }
+
+        .icon-ok-sign {
+          color: #fff;
+        }
+
+        .text-icon {
+          &.green {
+            color: #9fc820;
+            background-color: #fff;
+          }
+        }
+      }
+    }
+  }
+
+  a.button {
+    color: #fff;
+    font-size: 110%;
+    font-weight: bold;
+    text-align: center;
+
+    &.orange {
+      background-color: #DA7F52;
+    }
+
+    &.blue {
+      background-color: #5498da;
+    }
+
+    &.red {
+      background-color: #DA5354;
+    }
+
+    &:hover {
+      background-color: #9fc820;
+    }
+
+    &.bottom {
+      border-radius: 0px 0px 6px 6px;
+      padding: 15px 15px;
+    }
+  }
+}

app/assets/stylesheets/admin/enterprise_index_panels.css.scss

@@ -111,3 +111,27 @@
     }
   }
 }
+
+tags-input .tags li.tag-item  {
+  -webkit-border-radius: 3px;
+  -moz-border-radius: 3px;
+  -ms-border-radius: 3px;
+  -o-border-radius: 3px;
+  border-radius: 3px;
+  margin: 2px 0 2px 3px;
+  background-image: none;
+  background-color: #5fa5e8;
+  border: none;
+  box-shadow: none;
+  color: white !important;
+  font-size: 85%;
+  height: 25px;
+}
+
+tags-input .tags .tag-item .remove-button {
+  color: white;
+}
+
+table th.actions .no-text[class*="icon-"], table td.actions .no-text[class*="icon-"] {
+  cursor: pointer;
+}

app/assets/stylesheets/admin/enterprises.css.scss

@@ -0,0 +1,3 @@
+form[name="enterprise_form"] div.row.warning {
+  color: #DA7F52;
+}

app/assets/stylesheets/admin/openfoodnetwork.css.scss

@@ -74,6 +74,9 @@ form.order_cycle {
       margin-bottom: 0.5em;
     }
   }
+  .icon-question-sign {
+    font-size: 18px;
+  }
   table.exchanges {
     tr td.active {
       width: 20px;
@@ -113,6 +116,14 @@ form.order_cycle {
         margin-right: 2em;
       }
     }
+    .collection-details {
+      input {
+        width: 90%
+      }
+      span {
+        font-size: 1rem
+      }
+    }
   }
   .coordinator-fees {
     margin-top: 1em;
@@ -200,6 +211,13 @@ table#listing_enterprise_groups {
 
 // textAngular wysiwyg
 text-angular {
+  .ta-toolbar {
+    border: 1px solid #cdd9e4;
+    padding: 0.4em;
+    margin-bottom: -1px;
+    background-color: #f1f1f1;
+    border-radius: 0.25em 0.25em 0 0;
+  }
   .ta-scroll-window > .ta-bind {
     max-height: 400px;
     min-height: 100px;
@@ -210,12 +228,18 @@ text-angular {
   }
   .ta-scroll-window.form-control {
     min-height: 100px;
+    box-shadow: none !important;
   }
   .btn-group {
     display: inline;
     margin-right: 8px;
     button {
       padding: 5px 10px;
+      margin-right: 0.25em;
+    }
+    button.active:not(:hover) {
+      box-shadow: 0 0 0.7em rgba(0,0,0,0.3) inset;
+      background-color: #4583bf;
     }
   }
 }

app/assets/stylesheets/admin/product_import.css.scss

@@ -0,0 +1,225 @@
+div.panel-section {
+
+  .neutral {
+    color: #bfbfbf;
+  }
+  .warning {
+    color: #da5354;
+  }
+  .success {
+    color: #86d83a;
+  }
+  .info {
+    color: #68b7c0;
+  }
+
+  div.panel-header {
+    width: 100%;
+    //font-size: 1.5em;
+    clear: both;
+    //border: 1px solid #ccc;
+    float: left;
+    padding: 0.5em;
+
+    div {
+      font-size: 1.25em;
+      float: left;
+    }
+
+    div.header-caret {
+      width: 2em;
+      text-align: center;
+      min-height: 0.1em; //Empty div fix
+    }
+
+    div.header-icon {
+      width: 2.5em;
+      text-align: center;
+      padding-top: 0.18em;
+
+      i {
+        font-size: 1.5em;
+        line-height: 0.9em;
+      }
+    }
+
+    div.header-count {
+      min-width: 2em;
+      text-align: right;
+      padding-right: 0.5em;
+    }
+
+    div.header-description {
+      width: auto;
+    }
+
+  }
+
+  div.panel-header:hover {
+    cursor: pointer;
+    background-color: #f7f7f7;
+  }
+
+  div.panel-header.active {
+    background-color: #efefef;
+    text-shadow: 1px 1px 0px rgba(255,255,255,0.75);
+  }
+
+  div.panel-content {
+    width: 100%;
+    clear: both;
+    //border: 1px solid #ccc;
+    margin-bottom: 0.5em;
+    background-color: #f9f9f9;
+    padding: 1.5em;
+
+    div.table-wrap {
+      width: 100%;
+      overflow: auto;
+      border-right: 1px solid #ceede3;
+      max-height: 23em;
+    }
+
+    table {
+      background-color: white;
+      margin-bottom: 0;
+      td, th {
+        white-space: nowrap;
+      }
+      tr.error {
+        //background-color: #ffe6e4;
+        //color: #ee4728;
+        color: #c84C4c;
+      }
+      tr:hover td.invalid {
+        background-color: #ed5135;
+      }
+      tr i {
+        display: block;
+        margin-bottom: -0.2em;
+        font-size: 1.4em !important;
+      }
+      td.invalid {
+        background-color: #f05c51;
+        box-shadow: inset 0px 0px 1px red;
+        color: white;
+      }
+    }
+
+    div.import-errors {
+      margin-bottom: 0.85em;
+
+      p.line {
+        font-size: 1.15em;
+        margin-bottom: 0.2em;
+        color: #577084;
+      }
+      p.error {
+        color: #cb1b1b;
+        margin-bottom: 0.2em;
+      }
+    }
+
+  }
+
+}
+
+br.panels.clearfix {
+  clear: both;
+}
+
+table.import-settings {
+  background-color: transparent !important;
+  width: auto;
+
+  //select {
+  //  width: 100%;
+  //}
+  tr {
+
+  }
+  tbody tr:hover td {
+    background-color: #f3f3f3;
+  }
+  td {
+    border: 0;
+    border-bottom: 1px solid #eee;
+    text-align: left;
+
+    input {
+      width: 15em;
+    }
+    input[type="checkbox"] {
+      width: auto;
+    }
+
+  }
+  td.description {
+    font-weight: bold;
+    padding-right: 2.5em;
+  }
+  tr:first-child td {
+    //border-top: 1px solid #eee;
+    border-top: 0;
+  }
+  tr:last-child td {
+    //border-top: 1px solid #eee;
+    border-bottom: 0;
+  }
+
+}
+
+.panel-section.import-settings {
+
+  .header-description {
+    padding-left: 1em;
+  }
+
+  span.header-error {
+    font-size: 0.85em;
+    color: #da5354;
+  }
+
+  .select2-search {
+    display: none;
+  }
+
+  .select2-results {
+    margin: 0;
+  }
+}
+
+
+
+.post-save-results {
+  p {
+    font-size: 1.25em;
+    margin-bottom: 0.5em;
+
+    strong {
+      margin-right: 0.2em;
+      min-width: 1.8em;
+      display: inline-block;
+      text-align: right;
+    }
+
+    i {
+      font-size: 1.4em;
+      vertical-align: middle;
+      position: relative;
+    }
+
+    i.fa-check-circle {
+      color: #86d83a;
+    }
+    i.fa-info-circle {
+      color: #68b7c0;
+    }
+  }
+
+  p.save-error {
+    color: #ee4728;
+    font-size: 1.05em;
+    margin-top: 0.4em;
+  }
+}

app/assets/stylesheets/admin/relationships.css.sass

@@ -1,23 +0,0 @@
-// TODO: Provide -moz- and -o- directives
-@-webkit-keyframes alert-flash
-  0%
-    background-color: #f9f1ae
-
-  100%
-    background-color: #fff
-
-
-table#enterprise-relationships, table#enterprise-roles
-  ul
-    list-style-type: none
-
-  th.actions, td.actions
-    width: 16%
-    .errors
-      color: #f00
-
-  tr.ng-enter
-    -webkit-animation-name: alert-flash
-    -webkit-animation-duration: 1200ms
-    -webkit-animation-iteration-count: 1
-    -webkit-animation-timing-function: ease-in-out

app/assets/stylesheets/admin/relationships.css.scss

@@ -0,0 +1,31 @@
+// TODO: Provide -moz- and -o- directives
+@-webkit-keyframes alert-flash {
+  0% {
+    background-color: #f9f1ae;
+  }
+
+  100% {
+    background-color: #fff;
+  }
+}
+
+table#enterprise-relationships, table#enterprise-roles {
+  ul {
+    list-style-type: none;
+  }
+
+  th.actions, td.actions {
+    width: 16%;
+
+    .errors {
+      color: #f00;
+    }
+  }
+
+  tr.ng-enter {
+    -webkit-animation-name: alert-flash;
+    -webkit-animation-duration: 1200ms;
+    -webkit-animation-iteration-count: 1;
+    -webkit-animation-timing-function: ease-in-out;
+  }
+}

app/assets/stylesheets/admin/side_menu.css.sass

@@ -1,18 +0,0 @@
-.side_menu
-  border-right: 2px solid #f6f6f6
-  border-top: 2px solid #f6f6f6
-  .menu_item
-    display: block
-    padding: 8px 15px
-    font-size: 120%
-    cursor: pointer
-    text-transform: uppercase
-    &:nth-child(odd)
-      background-color: #ebf3fb
-    &:nth-child(even)
-      background-color: #ffffff
-    &:hover
-      background-color: #eaf0f5
-    &.selected
-      background-color: #5498da
-      color: #ffffff

app/assets/stylesheets/admin/side_menu.css.scss

@@ -0,0 +1,29 @@
+.side_menu {
+  border-right: 2px solid #f6f6f6;
+  border-top: 2px solid #f6f6f6;
+
+  .menu_item {
+    display: block;
+    padding: 8px 15px;
+    font-size: 120%;
+    cursor: pointer;
+    text-transform: uppercase;
+
+    &:nth-child(odd) {
+      background-color: #ebf3fb;
+    }
+
+    &:nth-child(even) {
+      background-color: #ffffff;
+    }
+
+    &:hover {
+      background-color: #eaf0f5;
+    }
+
+    &.selected {
+      background-color: #5498da;
+      color: #ffffff;
+    }
+  }
+}

app/assets/stylesheets/admin/sidebar-item.css.sass

@@ -1,77 +0,0 @@
-div.sidebar_item
-  margin-bottom: 30px
-
-  .centered
-    text-align: center
-
-  div.header
-    font-size: 105%
-    color: #fff
-    padding: 10px 0px
-    position: relative
-    &.blue
-      background-color: #5498da
-    &.red
-      background-color: #DA5354
-
-  .list
-    max-height: 400px
-    overflow-y: auto
-    overflow-x: hidden
-    &.red
-      color: #DA5354
-      .list-item
-        border: solid #DA5354
-        border-width: 0px 3px 0px 3px
-        a.alpha, span.alpha
-          margin-left: -3px
-        &.odd
-          background-color: #fcf6ef
-          &:hover
-            background-color: #9fc820
-      a
-        color: #DA5354
-
-  .list-item
-    .icon-arrow-right
-      padding-top: 6px
-      font-size: 20px
-    border: solid #5498da
-    border-width: 0px 1px 0px 1px
-    a.alpha, span.alpha
-      font-weight: bold
-      margin-left: -1px
-      padding: 10px 2px 10px 5%
-      overflow: hidden
-      text-overflow: ellipsis
-    span.omega
-      padding: 8px 18px 8px 0px
-      margin-right: -3px
-      text-align: right
-    .icon-remove-sign
-      color: #DA5354
-      font-size: 18px
-    &.even
-      background-color: #fff
-    &.odd
-      background-color: #eff5fc
-    &.even, &.odd
-      &:hover
-        color: #ffffff
-        background-color: #9fc820
-        a
-          color: #ffffff
-
-  a.button
-    color: #fff
-    padding: 15px 15px
-    font-weight: bold
-    text-align: center
-    border-radius: 0px
-    &.blue
-      background-color: #5498da
-    &.red
-      background-color: #DA5354
-    &:hover
-      background-color: #9fc820
-      

app/assets/stylesheets/admin/sidebar-item.css.scss

@@ -0,0 +1,121 @@
+div.sidebar_item {
+  margin-bottom: 30px;
+
+  .centered {
+    text-align: center;
+  }
+
+  div.header {
+    font-size: 105%;
+    color: #fff;
+    padding: 10px 0px;
+    position: relative;
+
+    &.blue {
+      background-color: #5498da;
+    }
+
+    &.red {
+      background-color: #DA5354;
+    }
+  }
+
+  .list {
+    max-height: 400px;
+    overflow-y: auto;
+    overflow-x: hidden;
+
+    &.red {
+      color: #DA5354;
+
+      .list-item {
+        border: solid #DA5354;
+        border-width: 0px 3px 0px 3px;
+
+        a.alpha, span.alpha {
+          margin-left: -3px;
+        }
+
+        &.odd {
+          background-color: #fcf6ef;
+
+          &:hover {
+            background-color: #9fc820;
+          }
+        }
+      }
+
+      a {
+        color: #DA5354;
+      }
+    }
+  }
+
+  .list-item {
+    .icon-arrow-right {
+      padding-top: 6px;
+      font-size: 20px;
+    }
+
+    border: solid #5498da;
+    border-width: 0px 1px 0px 1px;
+
+    a.alpha, span.alpha {
+      font-weight: bold;
+      margin-left: -1px;
+      padding: 10px 2px 10px 5%;
+      overflow: hidden;
+      text-overflow: ellipsis;
+    }
+
+    span.omega {
+      padding: 8px 18px 8px 0px;
+      margin-right: -3px;
+      text-align: right;
+    }
+
+    .icon-remove-sign {
+      color: #DA5354;
+      font-size: 18px;
+    }
+
+    &.even {
+      background-color: #fff;
+    }
+
+    &.odd {
+      background-color: #eff5fc;
+    }
+
+    &.even, &.odd {
+      &:hover {
+        color: #ffffff;
+        background-color: #9fc820;
+
+        a {
+          color: #ffffff;
+        }
+      }
+    }
+  }
+
+  a.button {
+    color: #fff;
+    padding: 15px 15px;
+    font-weight: bold;
+    text-align: center;
+    border-radius: 0px;
+
+    &.blue {
+      background-color: #5498da;
+    }
+
+    &.red {
+      background-color: #DA5354;
+    }
+
+    &:hover {
+      background-color: #9fc820;
+    }
+  }
+}

app/assets/stylesheets/admin/variant_overrides.css.sass

@@ -1,6 +0,0 @@
-.variant-override-unit
-  float: right
-  font-style: italic
-
-button.hide:hover
-  background-color: #DA5354

app/assets/stylesheets/admin/variant_overrides.css.scss

@@ -0,0 +1,8 @@
+.variant-override-unit {
+  float: right;
+  font-style: italic;
+}
+
+button.hide:hover {
+  background-color: #DA5354;
+}

app/assets/stylesheets/admin/welcome.css.sass

@@ -1,16 +0,0 @@
-@import ../darkswarm/mixins
-
-#welcome_page
-  header
-    text-align: center
-    padding: 4em 2em
-    @include fullbg
-    background-image: url('/assets/home/tagline-bg.jpg')
-    background-repeat: no-repeat
-    background-position: center center
-    margin-bottom: 2em
-    p
-      text-transform: uppercase
-      font-weight: 300
-    &, & *
-      color: white

app/assets/stylesheets/admin/welcome.css.scss

@@ -0,0 +1,24 @@
+@import "../darkswarm/mixins";
+
+#welcome_page {
+  header {
+    text-align: center;
+    padding: 4em 2em;
+
+    @include fullbg;
+
+    background-image: url("/assets/home/tagline-bg.jpg");
+    background-repeat: no-repeat;
+    background-position: center center;
+    margin-bottom: 2em;
+
+    p {
+      text-transform: uppercase;
+      font-weight: 300;
+    }
+
+    &, & * {
+      color: white;
+    }
+  }
+}

app/assets/stylesheets/darkswarm/_shop-filters.css.sass

@@ -1,125 +0,0 @@
-@import mixins
-@import branding
-@import big-input
-@import animations
-
-@mixin filter-selector($base-clr, $border-clr, $hover-clr)
-  &.inline-block, ul.inline-block
-    display: inline-block
-
-  li
-    display: inline-block
-    @include border-radius(0)
-    padding: 0
-    margin: 0 0 0.25rem 0.25rem
-    &:hover, &:focus
-      background: transparent
-    &.active
-      box-shadow: none
-
-    a, a.button
-      display: block
-      padding-top: 0.5rem
-      @include border-radius(0.5em)
-      border: 1px solid $border-clr
-      padding: 0.5em 0.625em
-      font-size: 0.875em
-      color: $base-clr
-      font-size: 0.75em
-      background: white
-      margin: 0
-      i
-        padding-left: 0.25rem
-
-      render-svg
-        &, & svg
-          width: 1rem
-          height: 1rem
-          float: left
-          padding-right: 0.25rem
-          path
-            @include csstrans
-            fill: $base-clr
-
-      &:hover, &:focus
-        border-color: $hover-clr
-        color: $hover-clr
-        render-svg
-          svg
-            path
-              fill: $hover-clr
-
-      &.disabled
-        opacity: 0.6
-
-        &:hover, &:focus
-          border-color: $border-clr
-          color:  $base-clr
-          render-svg
-            svg
-              path
-                fill: $base-clr
-
-
-      &.active, &.active:hover, &.active:focus
-        border: 1px solid $base-clr
-        background: $base-clr
-        color: white
-        render-svg
-          svg
-            path
-              fill: white
-
-
-// Alert when search, taxon, filter is triggered
-
-.alert-box.search-alert
-  background-color: $clr-yellow-light
-  border-color: $clr-yellow-light
-  color: #777
-  font-size: 0.75rem
-  padding: 0.5rem 0.75rem
-
-  span.applied-properties
-    color: #333
-
-  span.applied-taxons
-    color: $clr-blue
-
-  span.applied-search
-    color: $clr-brick
-
-  span.filter-label
-    opacity: 0.75
-
-// singleLineSelectors directive provides a drop-down that can overlap
-// content. Ensure that the dropdown appears above the content.
-.filter-row
-  position: relative
-  z-index: 90
-
-.filter-shopfront
-  &.taxon-selectors, &.property-selectors
-    background: transparent
-
-    single-line-selectors
-      overflow-x: hidden
-      white-space: nowrap
-
-      .f-dropdown
-        overflow-x: auto
-        white-space: normal
-
-    ul
-      margin: 0
-      display: inline-block
-    ul, ul li
-      list-style: none
-
-  // Shopfront taxons
-  &.taxon-selectors
-    @include filter-selector($clr-blue, $clr-blue-light, $clr-blue-bright)
-
-  // Shopfront properties
-  &.property-selectors
-    @include filter-selector(#666, #ccc, #777)

app/assets/stylesheets/darkswarm/_shop-filters.css.scss

@@ -0,0 +1,173 @@
+@import "mixins";
+@import "branding";
+@import "big-input";
+@import "animations";
+
+@mixin filter-selector($base-clr, $border-clr, $hover-clr) {
+  &.inline-block, ul.inline-block {
+    display: inline-block;
+  }
+
+  li {
+    display: inline-block;
+
+    @include border-radius(0);
+
+    padding: 0;
+    margin: 0 0 0.25rem 0.25rem;
+
+    &:hover, &:focus {
+      background: transparent;
+    }
+
+    &.active {
+      box-shadow: none;
+    }
+
+    a, a.button {
+      display: block;
+      padding-top: 0.5rem;
+
+      @include border-radius(0.5em);
+
+      border: 1px solid $border-clr;
+      padding: 0.5em 0.625em;
+      font-size: 0.875em;
+      color: $base-clr;
+      font-size: 0.75em;
+      background: white;
+      margin: 0;
+
+      i {
+        padding-left: 0.25rem;
+      }
+
+      render-svg {
+        &, & svg {
+          width: 1rem;
+          height: 1rem;
+          float: left;
+          padding-right: 0.25rem;
+
+          path {
+            @include csstrans;
+
+            fill: $base-clr;
+          }
+        }
+      }
+
+      &:hover, &:focus {
+        border-color: $hover-clr;
+        color: $hover-clr;
+
+        render-svg {
+          svg {
+            path {
+              fill: $hover-clr;
+            }
+          }
+        }
+      }
+
+      &.disabled {
+        opacity: 0.6;
+
+        &:hover, &:focus {
+          border-color: $border-clr;
+          color: $base-clr;
+
+          render-svg {
+            svg {
+              path {
+                fill: $base-clr;
+              }
+            }
+          }
+        }
+      }
+
+      &.active, &.active:hover, &.active:focus {
+        border: 1px solid $base-clr;
+        background: $base-clr;
+        color: white;
+
+        render-svg {
+          svg {
+            path {
+              fill: white;
+            }
+          }
+        }
+      }
+    }
+  }
+}
+
+// Alert when search, taxon, filter is triggered
+
+.alert-box.search-alert {
+  background-color: $clr-yellow-light;
+  border-color: $clr-yellow-light;
+  color: #777;
+  font-size: 0.75rem;
+  padding: 0.5rem 0.75rem;
+
+  span.applied-properties {
+    color: #333;
+  }
+
+  span.applied-taxons {
+    color: $clr-blue;
+  }
+
+  span.applied-search {
+    color: $clr-brick;
+  }
+
+  span.filter-label {
+    opacity: 0.75;
+  }
+}
+
+// singleLineSelectors directive provides a drop-down that can overlap
+// content. Ensure that the dropdown appears above the content.
+.filter-row {
+  position: relative;
+  z-index: 90;
+}
+
+.filter-shopfront {
+  &.taxon-selectors, &.property-selectors {
+    background: transparent;
+
+    single-line-selectors {
+      overflow-x: hidden;
+      white-space: nowrap;
+
+      .f-dropdown {
+        overflow-x: auto;
+        white-space: normal;
+      }
+    }
+
+    ul {
+      margin: 0;
+      display: inline-block;
+    }
+
+    ul, ul li {
+      list-style: none;
+    }
+  }
+
+  // Shopfront taxons
+  &.taxon-selectors {
+    @include filter-selector($clr-blue, $clr-blue-light, $clr-blue-bright);
+  }
+
+  // Shopfront properties
+  &.property-selectors {
+    @include filter-selector(#666, #ccc, #777);
+  }
+}

app/assets/stylesheets/darkswarm/_shop-inputs.css.sass

@@ -1,85 +0,0 @@
-@import mixins
-@import variables
-@import branding
-@import big-input
-
-
-.darkswarm
-  // #search
-  @include placeholder(rgba(0,0,0,0.4), #777)
-  
-  input#search
-    @include medium-input(rgba(0,0,0,0.3), #777, $clr-brick)
-
-  // ordering
-  product
-    
-    input
-      @include border-radius(0) 
-      @include csstrans
-      margin: 0
-      width: 10rem
-      display: inline
-      @include box-shadow(none)
-      border-color: #b3b3b3
-      text-align: right
-      
-      @media all and (max-width: 1024px)
-        width: 8rem
-
-      @media all and (max-width: 768px)
-        width: 7rem
-
-      @media all and (max-width: 640px) 
-        float: left !important
-        font-size: 0.75rem
-        padding-left: 0.25rem
-        padding-right: 0.25rem
-     
-      @media all and (max-width: 480px) 
-        width: 5.8rem
-
-      &:hover
-        @include box-shadow(none)
-        border-color: #888
-        background-color: #fafafa
-
-      &:active, &:focus, &.active
-        @include box-shadow(none)
-        background-color: #f9f4b9
-        border-color: #666
-
-
-    // BULK
-
-    input.bulk
-      width: 5rem
-
-      @media all and (max-width: 1024px)
-        width: 4rem
-
-      @media all and (max-width: 768px)
-        width: 3.5rem
-
-      @media all and (max-width: 480px) 
-        width: 2.8rem
-
-    input.bulk.first
-      border-right: 0
-
-    input.bulk.second
-      border-left: 0
-      
-    .bulk-input-container
-      float: right
-
-      @media all and (max-width: 640px) 
-        float: left !important
-
-      .bulk-input
-        float: left
-
-      
-
-
-

app/assets/stylesheets/darkswarm/_shop-inputs.css.scss

@@ -0,0 +1,102 @@
+@import "mixins";
+@import "variables";
+@import "branding";
+@import "big-input";
+
+.darkswarm {
+  // #search
+  @include placeholder(rgba(0, 0, 0, 0.4), #777);
+
+  input#search {
+    @include medium-input(rgba(0, 0, 0, 0.3), #777, $clr-brick);
+  }
+
+  // ordering
+  product {
+    input {
+      @include border-radius(0);
+
+      @include csstrans;
+
+      margin: 0;
+      width: 10rem;
+      display: inline;
+
+      @include box-shadow(none);
+
+      border-color: #b3b3b3;
+      text-align: right;
+
+      @media all and (max-width: 1024px) {
+        width: 8rem;
+      }
+
+      @media all and (max-width: 768px) {
+        width: 7rem;
+      }
+
+      @media all and (max-width: 640px) {
+        float: left !important;
+        font-size: 0.75rem;
+        padding-left: 0.25rem;
+        padding-right: 0.25rem;
+      }
+
+      @media all and (max-width: 480px) {
+        width: 5.8rem;
+      }
+
+      &:hover {
+        @include box-shadow(none);
+
+        border-color: #888;
+        background-color: #fafafa;
+      }
+
+      &:active, &:focus, &.active {
+        @include box-shadow(none);
+
+        background-color: #f9f4b9;
+        border-color: #666;
+      }
+    }
+
+    // BULK
+
+    input.bulk {
+      width: 5rem;
+
+      @media all and (max-width: 1024px) {
+        width: 4rem;
+      }
+
+      @media all and (max-width: 768px) {
+        width: 3.5rem;
+      }
+
+      @media all and (max-width: 480px) {
+        width: 2.8rem;
+      }
+    }
+
+    input.bulk.first {
+      border-right: 0;
+    }
+
+    input.bulk.second {
+      border-left: 0;
+    }
+
+    .bulk-input-container {
+      float: right;
+
+      @media all and (max-width: 640px) {
+        float: left !important;
+      }
+
+      .bulk-input {
+        float: left;
+      }
+    }
+  }
+}

app/assets/stylesheets/darkswarm/_shop-modals.css.sass

@@ -1,6 +0,0 @@
-
-.product-header
-	h1, h2, h3, h4, h5, h6
-		margin: 0
-	hr
-		margin: 0.5em 0

app/assets/stylesheets/darkswarm/_shop-modals.css.scss

@@ -0,0 +1,9 @@
+.product-header {
+  h1, h2, h3, h4, h5, h6 {
+    margin: 0;
+  }
+
+  hr {
+    margin: 0.5em 0;
+  }
+}

app/assets/stylesheets/darkswarm/_shop-navigation.css.sass

@@ -19,7 +19,7 @@
         height: 100px
         width: 100px
         margin-right: 12px
-        
+
       location
         @include headingFont
       @media all and (max-width: 768px)
@@ -30,39 +30,43 @@
         margin-top: 0
         @media all and (max-width: 768px)
           margin-bottom: 8px
-        
+
 
       ordercycle
-        p.text-right
+        text-align: right
+        p
           max-width: 400px
         @media all and (max-width: 640px)
           float: left
           clear: left
+          text-align: left
           padding: 12px 10px
           width: 100%
           margin-top: 10px
           background: #e5e5e5
-          p.text-right
+          p
             max-width: 100%
         float: right
-        form.custom 
+        form.custom
           text-align: right
           & > strong
             line-height: 2.5
             font-size: 1.29em
             padding-right: 14px
             @media all and (max-width: 768px)
-          select            
+          select
             width: inherit
             display: inline-block
             border-width: 1px
             border-color: #999
             color: #666
-            font-size: 1em 
+            font-size: 1em
             margin-bottom: 0
             padding: 8px 20px 8px 12px
             @media all and (max-width: 768px)
               font-size: 0.875em
+            @media screen and (-webkit-min-device-pixel-ratio:0)
+              font-size: 16px
         closing
           @include headingFont
           @media all and (max-width: 768px)

app/assets/stylesheets/darkswarm/_shop-popovers.css.sass

@@ -1,112 +0,0 @@
-@import mixins
-@import branding
-
-// .darkswarm
-//   product
-
-ordercycle
-  .joyride-tip-guide 
-    background-color: $clr-brick
-    .joyride-nub.right
-      border-color: $clr-brick !important
-      border-top-color: transparent !important
-      border-right-color: transparent !important
-      border-bottom-color: transparent !important
-    p
-      margin: 0
-      font-weight: 700
-
-// Pop over
-// Foundation overrides
-.joyride-tip-guide.price_breakdown
-  // JS needs to be tweaked to adjust for left alignment - this is dynamic can't rewrite in CSS
-  background-color: #999
-  color: #1f1f1f
-  margin-left: -8px
-  @include box-shadow(0 1px 2px 0 rgba(0,0,0,0.7))
-
-  .joyride-content-wrapper
-    padding: 1.125rem 1.25rem 1.5rem
-    padding: 1rem
-    margin: 1%
-    width: 98%
-    background-color: white
-
-  h1, h2, h3, h4, h5, h6
-    color: #1f1f1f
-
-  .joyride-nub.right
-    top: 38px
-    border-color: #999 !important
-    border-top-color: transparent !important
-    border-right-color: transparent !important
-    border-bottom-color: transparent !important
-
-  .progress
-    background-color: #13bf85
-    padding: 0
-    border: none
-    color: white
-    font-size: 0.75rem
-    font-style: oblique
-    line-height: 1
-    height: auto
-    .right
-      padding: 0.5rem 0.25rem 0 0 
-    .meter
-      background-color: #0b8c61
-      padding: 0.5rem 0.25rem
-      border-right: 1px solid #539f92
-  
-  .expanded 
-    ul, li
-      list-style: none
-      margin: 0
-      font-size: 0.875rem
-    li
-      background-color: #13bf85
-      padding: 0 0.25rem
-      margin-bottom: 2px
-      color: white
-    li.cost
-      background-color: #0b8c61
-    li:last-child
-      margin-bottom: 0.75rem
-
-
-button.graph-button
-  // z-index: 9999999
-  border: 1px solid transparent
-  padding: 0
-  margin: 0
-  display: inline
-  background-color: rgba(255,255,255,0.5)
-  padding: 4px 
-  @include box-shadow(none)
-  @include border-radius(999rem)
-  &:before
-    @include icon-font
-    content: '\e639'
-    color: #999
-  &:focus
-    border: 1px solid #e0e0e0
-    background-color: rgba(255,255,255,1)
-    &:before
-      color: #666
-  &:hover, &:active
-    background-color: rgba(255,255,255,1)
-    border: 1px solid transparent
-    &:before
-      color: $clr-brick-bright
-  @media all and (max-width: 768px) 
-    // Hide for small
-    display: none
-
-button.graph-button.open
-  border: 1px solid transparent
-  background-color:  $clr-brick-bright
-  &:before
-    content: '\e608'
-    color: white
-
-

app/assets/stylesheets/darkswarm/_shop-popovers.css.scss

@@ -0,0 +1,152 @@
+@import "mixins";
+@import "branding";
+
+// .darkswarm
+//   product
+
+ordercycle {
+  .joyride-tip-guide {
+    background-color: $clr-brick;
+
+    .joyride-nub.right {
+      border-color: $clr-brick !important;
+      border-top-color: transparent !important;
+      border-right-color: transparent !important;
+      border-bottom-color: transparent !important;
+    }
+
+    p {
+      margin: 0;
+      font-weight: 700;
+    }
+  }
+}
+
+// Pop over
+// Foundation overrides
+.joyride-tip-guide.price_breakdown {
+  // JS needs to be tweaked to adjust for left alignment - this is dynamic can't rewrite in CSS
+  background-color: #999;
+  color: #1f1f1f;
+  margin-left: -8px;
+
+  @include box-shadow(0 1px 2px 0 rgba(0, 0, 0, 0.7));
+
+  .joyride-content-wrapper {
+    padding: 1.125rem 1.25rem 1.5rem;
+    padding: 1rem;
+    margin: 1%;
+    width: 98%;
+    background-color: white;
+  }
+
+  h1, h2, h3, h4, h5, h6 {
+    color: #1f1f1f;
+  }
+
+  .joyride-nub.right {
+    top: 38px;
+    border-color: #999 !important;
+    border-top-color: transparent !important;
+    border-right-color: transparent !important;
+    border-bottom-color: transparent !important;
+  }
+
+  .progress {
+    background-color: #13bf85;
+    padding: 0;
+    border: none;
+    color: white;
+    font-size: 0.75rem;
+    font-style: oblique;
+    line-height: 1;
+    height: auto;
+
+    .right {
+      padding: 0.5rem 0.25rem 0 0;
+    }
+
+    .meter {
+      background-color: #0b8c61;
+      padding: 0.5rem 0.25rem;
+      border-right: 1px solid #539f92;
+    }
+  }
+
+  .expanded {
+    ul, li {
+      list-style: none;
+      margin: 0;
+      font-size: 0.875rem;
+    }
+
+    li {
+      background-color: #13bf85;
+      padding: 0 0.25rem;
+      margin-bottom: 2px;
+      color: white;
+    }
+
+    li.cost {
+      background-color: #0b8c61;
+    }
+
+    li:last-child {
+      margin-bottom: 0.75rem;
+    }
+  }
+}
+
+button.graph-button {
+  // z-index: 9999999
+  border: 1px solid transparent;
+  padding: 0;
+  margin: 0;
+  display: inline;
+  background-color: rgba(255, 255, 255, 0.5);
+  padding: 4px;
+
+  @include box-shadow(none);
+
+  @include border-radius(999rem);
+
+  &:before {
+    @include icon-font;
+
+    content: "";
+    color: #999;
+  }
+
+  &:focus {
+    border: 1px solid #e0e0e0;
+    background-color: rgba(255, 255, 255, 1);
+
+    &:before {
+      color: #666;
+    }
+  }
+
+  &:hover, &:active {
+    background-color: rgba(255, 255, 255, 1);
+    border: 1px solid transparent;
+
+    &:before {
+      color: $clr-brick-bright;
+    }
+  }
+
+  @media all and (max-width: 768px) {
+    // Hide for small
+    display: none;
+  }
+}
+
+button.graph-button.open {
+  border: 1px solid transparent;
+  background-color: $clr-brick-bright;
+
+  &:before {
+    content: "";
+    color: white;
+  }
+}

app/assets/stylesheets/darkswarm/_shop-product-rows.css.sass

@@ -1,123 +0,0 @@
-@import branding.css.sass
-@import animations.sass
-
-.darkswarm
-  products
-    product
-      // GENERAL LAYOUT
-      .row
-        .columns
-          padding-top: 0em
-          padding-bottom: 0em
-          display: table
-          line-height: 1.1
-          // outline: 1px solid red
-
-          @media all and (max-width: 768px)
-            font-size: 0.875rem
-
-          @media all and (max-width: 640px)
-            font-size: 0.75rem
-
-        .table-cell
-          display: table-cell
-          vertical-align: middle
-          height: 37px
-
-      // ROW VARIANTS
-      .row.variants
-        margin-left: 0
-        margin-right: 0
-        background-color: #ECECEC
-        &:hover, &:focus, &:active
-          background-color: $clr-brick-light
-        &:nth-of-type(even)
-          background-color: #f9f9f9
-          &:hover, &:focus, &:active
-            background-color: $clr-brick-ultra-light
-
-        &.out-of-stock
-          opacity: 0.2
-
-        // Variant name
-        .variant-name
-          padding-left: 7.9375rem
-          @media all and (max-width: 768px)
-            padding-left: 4.9375rem
-
-        .variant-name
-          @media all and (max-width: 640px)
-            background: #333
-            color: white
-            padding-left: 0.9375rem
-            font-weight: bold
-            .table-cell
-              height: 27px
-
-        // Variant unit
-        .variant-unit
-          padding-left: 0rem
-          padding-right: 0rem
-          color: #888
-          font-size: 0.875rem
-          overflow: hidden
-
-          @media all and (max-width: 768px)
-            font-size: 0.75rem
-
-        // Variant price
-        .variant-price
-          padding-left: 0.25rem
-          padding-right: 0.25rem
-          @media all and (max-width: 640px)
-            text-align: right
-
-        // Total price
-        .total-price
-          padding-left: 0rem
-          color: $disabled-med
-          .filled
-            color: $med-drk-grey
-          @media all and (max-width: 640px)
-            background: #777
-            color: $disabled-med
-            .filled
-              color: white
-            .table-cell
-              height: 27px
-
-      // ROW SUMMARY
-      .row.summary
-        margin-left: 0
-        margin-right: 0
-        background: #fff
-
-        .columns
-          padding-top: 1em
-          padding-bottom: 1em
-          line-height: 1
-
-          @media all and (max-width: 768px)
-            padding-top: 0.65rem
-            padding-bottom: 0.65rem
-
-        .summary-header
-          padding-left: 7.9375rem
-          @media all and (max-width: 768px)
-            padding-left: 4.9375rem
-          @media all and (max-width: 640px)
-            padding-left: 0.9375rem
-          small
-            font-size: 80%
-          h3
-            font-size: 1.5rem
-            margin: 0
-          h3 a
-            color: #222
-            i
-              @include csstrans
-              font-size: 0.6em
-            &:hover, &:focus, &:active
-              color: $clr-brick
-              i
-                font-size: 0.8em

app/assets/stylesheets/darkswarm/_shop-product-rows.css.scss

@@ -0,0 +1,182 @@
+@import "branding";
+@import "animations";
+
+.darkswarm {
+  products {
+    product {
+      // GENERAL LAYOUT
+      .row {
+        .columns {
+          padding-top: 0em;
+          padding-bottom: 0em;
+          display: table;
+          line-height: 1.1;
+
+          // outline: 1px solid red
+
+          @media all and (max-width: 768px) {
+            font-size: 0.875rem;
+          }
+
+          @media all and (max-width: 640px) {
+            font-size: 0.75rem;
+          }
+        }
+
+        .table-cell {
+          display: table-cell;
+          vertical-align: middle;
+          height: 37px;
+        }
+      }
+
+      // ROW VARIANTS
+      .row.variants {
+        margin-left: 0;
+        margin-right: 0;
+        background-color: #ECECEC;
+
+        &:hover, &:focus, &:active {
+          background-color: $clr-brick-light;
+        }
+
+        &:nth-of-type(even) {
+          background-color: #f9f9f9;
+
+          &:hover, &:focus, &:active {
+            background-color: $clr-brick-ultra-light;
+          }
+        }
+
+        &.out-of-stock {
+          opacity: 0.2;
+        }
+
+        // Variant name
+        .variant-name {
+          padding-left: 7.9375rem;
+
+          @media all and (max-width: 768px) {
+            padding-left: 4.9375rem;
+          }
+        }
+
+        .variant-name {
+          @media all and (max-width: 640px) {
+            background: #333;
+            color: white;
+            padding-left: 0.9375rem;
+            font-weight: bold;
+
+            .table-cell {
+              height: 27px;
+            }
+          }
+        }
+
+        // Variant unit
+        .variant-unit {
+          padding-left: 0rem;
+          padding-right: 0rem;
+          color: #888;
+          font-size: 0.875rem;
+          overflow: hidden;
+
+          @media all and (max-width: 768px) {
+            font-size: 0.75rem;
+          }
+        }
+
+        // Variant price
+        .variant-price {
+          padding-left: 0.25rem;
+          padding-right: 0.25rem;
+
+          @media all and (max-width: 640px) {
+            text-align: right;
+          }
+        }
+
+        // Total price
+        .total-price {
+          padding-left: 0rem;
+          color: $disabled-med;
+
+          .filled {
+            color: $med-drk-grey;
+          }
+
+          @media all and (max-width: 640px) {
+            background: #777;
+            color: $disabled-med;
+
+            .filled {
+              color: white;
+            }
+
+            .table-cell {
+              height: 27px;
+            }
+          }
+        }
+      }
+
+      // ROW SUMMARY
+      .row.summary {
+        margin-left: 0;
+        margin-right: 0;
+        background: #fff;
+
+        .columns {
+          padding-top: 1em;
+          padding-bottom: 1em;
+          line-height: 1;
+
+          @media all and (max-width: 768px) {
+            padding-top: 0.65rem;
+            padding-bottom: 0.65rem;
+          }
+        }
+
+        .summary-header {
+          padding-left: 7.9375rem;
+
+          @media all and (max-width: 768px) {
+            padding-left: 4.9375rem;
+          }
+
+          @media all and (max-width: 640px) {
+            padding-left: 0.9375rem;
+          }
+
+          small {
+            font-size: 80%;
+          }
+
+          h3 {
+            font-size: 1.5rem;
+            margin: 0;
+          }
+
+          h3 a {
+            color: #222;
+
+            i {
+              @include csstrans;
+
+              font-size: 0.6em;
+            }
+
+            &:hover, &:focus, &:active {
+              color: $clr-brick;
+
+              i {
+                font-size: 0.8em;
+              }
+            }
+          }
+        }
+      }
+    }
+  }
+}

app/assets/stylesheets/darkswarm/_shop-product-thumb.css.sass

@@ -1,59 +0,0 @@
-@import branding
-@import animations.sass
-
-.darkswarm
-  products
-    product
-      .product-thumb
-        @include csstrans
-        position: absolute
-        top: 2px
-        left: 0px
-        width: 7rem
-        height: 7rem
-        float: left
-        display: block
-        z-index: 1
-        background-color: white
-        overflow: hidden
-        i
-          @include csstrans
-          transition-delay: 150ms
-          position: absolute
-          left: 45%
-          top: 45%
-          z-index: 99999
-          color: white
-          font-size: 1rem
-          opacity: 0
-        img
-          @include csstrans
-          opacity: 1
-          @include transform-scale(scale(1))
-        
-        &:hover, &:focus, &:active
-          background-color: $clr-brick
-          i
-            left: 32%
-            top: 30%
-            font-size: 3rem
-            opacity: 1
-          img
-            opacity: 0.5
-            @include transform-scale(scale(1.1))
-
-        @media all and (max-width: 768px)
-          top: 2px
-          width: 4rem
-          height: 4rem
-          &:hover, &:focus, &:active
-            i
-              left: 30%
-              top: 30%
-              font-size: 2rem
-        @media all and (max-width: 640px)
-          display: none
-          width: 0rem
-          height: 0rem
-
-          

app/assets/stylesheets/darkswarm/_shop-product-thumb.css.scss

@@ -0,0 +1,81 @@
+@import "branding";
+@import "animations";
+
+.darkswarm {
+  products {
+    product {
+      .product-thumb {
+        @include csstrans;
+
+        position: absolute;
+        top: 2px;
+        left: 0px;
+        width: 7rem;
+        height: 7rem;
+        float: left;
+        display: block;
+        z-index: 1;
+        background-color: white;
+        overflow: hidden;
+
+        i {
+          @include csstrans;
+
+          transition-delay: 150ms;
+          position: absolute;
+          left: 45%;
+          top: 45%;
+          z-index: 99999;
+          color: white;
+          font-size: 1rem;
+          opacity: 0;
+        }
+
+        img {
+          @include csstrans;
+
+          opacity: 1;
+
+          @include transform-scale(scale(1));
+        }
+
+        &:hover, &:focus, &:active {
+          background-color: $clr-brick;
+
+          i {
+            left: 32%;
+            top: 30%;
+            font-size: 3rem;
+            opacity: 1;
+          }
+
+          img {
+            opacity: 0.5;
+
+            @include transform-scale(scale(1.1));
+          }
+        }
+
+        @media all and (max-width: 768px) {
+          top: 2px;
+          width: 4rem;
+          height: 4rem;
+
+          &:hover, &:focus, &:active {
+            i {
+              left: 30%;
+              top: 30%;
+              font-size: 2rem;
+            }
+          }
+        }
+
+        @media all and (max-width: 640px) {
+          display: none;
+          width: 0rem;
+          height: 0rem;
+        }
+      }
+    }
+  }
+}

app/assets/stylesheets/darkswarm/_shop-taxon-flag.css.sass

@@ -1,31 +0,0 @@
-.darkswarm
-  products
-    product
-      .taxon-flag
-        background: transparent url("/assets/flag.svg") top center no-repeat
-        background-size: 34px 39px
-        min-height: 40px
-        width: 34px
-        margin-top: -1.1rem
-        padding-top: 0.25rem
-        z-index: 999999
-        @media all and (max-width: 480px)
-          background-size: 28px 32px
-          min-height: 32px
-          width: 28px
-
-        render-svg
-          svg
-            width: 24px
-            height: 24px
-            path
-              fill: #999
-
-        @media all and (max-width: 768px)
-          margin-top: -0.85rem
-
-        @media all and (max-width: 480px)
-          render-svg
-            svg
-              width: 18px
-              height: 18px

app/assets/stylesheets/darkswarm/_shop-taxon-flag.css.scss

@@ -0,0 +1,45 @@
+.darkswarm {
+  products {
+    product {
+      .taxon-flag {
+        background: transparent url("/assets/flag.svg") top center no-repeat;
+        background-size: 34px 39px;
+        min-height: 40px;
+        width: 34px;
+        margin-top: -1.1rem;
+        padding-top: 0.25rem;
+        z-index: 999999;
+
+        @media all and (max-width: 480px) {
+          background-size: 28px 32px;
+          min-height: 32px;
+          width: 28px;
+        }
+
+        render-svg {
+          svg {
+            width: 24px;
+            height: 24px;
+
+            path {
+              fill: #999;
+            }
+          }
+        }
+
+        @media all and (max-width: 768px) {
+          margin-top: -0.85rem;
+        }
+
+        @media all and (max-width: 480px) {
+          render-svg {
+            svg {
+              width: 18px;
+              height: 18px;
+            }
+          }
+        }
+      }
+    }
+  }
+}

app/assets/stylesheets/darkswarm/account.css.sass

@@ -1,70 +0,0 @@
-@import branding
-@import mixins
-
-.orders
-  @include sidepaddingSm
-  @include panepadding
-  padding-top: 10px
-
-  h3
-    padding-top: 2em
-
-  a
-    color: $clr-brick
-    &:hover, &:active, &:focus
-      color: $clr-brick-med-bright
-
-  img
-    display: block
-    width: 80px
-    height: auto
-
-  i.ofn-i_059-producer, i.ofn-i_060-producer-reversed
-    font-size: 3rem
-    display: inline-block
-    margin-right: 0.25rem
-    float: left
-    color: $clr-turquoise
-
-  .credit
-    color: green
-
-  .debit
-    color: $clr-brick
-
-  .invalid
-    color: $ofn-grey
-    .credit
-      color: $ofn-grey
-    .debit
-      color: $ofn-grey
-
-  .distributor-balance.paid
-    visibility: hidden
-
-  .transaction-group
-
-
-  table
-    border-radius: 0.5em 0.5em 0 0
-    tr:nth-of-type(even)
-      background: transparent // clear previous
-    tbody.odd
-      tr
-        background-color: #f9f9f9
-        border: none
-  // Column widths for order table
-  .order1
-    width: 20%
-  .order2
-    width: 20%
-  .order3
-    width: 20%
-  .order4
-    width: 10%
-  .order5
-    width: 10%
-  .order6
-    width: 10%
-  .order7
-    width: 10%

app/assets/stylesheets/darkswarm/account.css.scss

@@ -0,0 +1,111 @@
+@import "branding";
+@import "mixins";
+
+.account-summary {
+  color: #4a4a4a;
+}
+
+
+.orders {
+  margin-top: 50px;
+  margin-bottom: 100px;
+
+  a {
+    color: $clr-brick;
+
+    &:hover, &:active, &:focus {
+      color: $clr-brick-med-bright;
+    }
+  }
+
+  img {
+    display: block;
+    width: 80px;
+    height: auto;
+  }
+
+  .active_table_row {
+    h3 {
+      margin-top: 0.5em;
+    }
+  }
+
+  i.ofn-i_059-producer, i.ofn-i_060-producer-reversed {
+    font-size: 3rem;
+    display: inline-block;
+    margin-right: 0.25rem;
+    float: left;
+    color: $clr-turquoise;
+  }
+
+  .credit {
+    color: green;
+  }
+
+  .debit {
+    color: $clr-brick;
+  }
+
+  .invalid {
+    color: $ofn-grey;
+
+    .credit {
+      color: $ofn-grey;
+    }
+
+    .debit {
+      color: $ofn-grey;
+    }
+  }
+
+  .distributor-balance.paid {
+    visibility: hidden;
+  }
+
+  .transaction-group {}
+
+  table {
+    width: 100%;
+    border-radius: 0.5em 0.5em 0 0;
+
+    tr:nth-of-type(even) {
+      background: transparent;
+    }
+
+    tbody.odd {
+      tr {
+        background-color: #f9f9f9;
+        border: none;
+      }
+    }
+  }
+
+  // Column widths for order table
+  .order1 {
+    width: 20%;
+  }
+
+  .order2 {
+    width: 20%;
+  }
+
+  .order3 {
+    width: 20%;
+  }
+
+  .order4 {
+    width: 10%;
+  }
+
+  .order5 {
+    width: 10%;
+  }
+
+  .order6 {
+    width: 10%;
+  }
+
+  .order7 {
+    width: 10%;
+  }
+}