styling progress

app/assets/stylesheets/supplier/foundation1/form_actions.css.sass

@@ -0,0 +1,23 @@
+@import font-awesome
+@import ./foundation_and_overrides
+.form-actions
+  a
+    &.form-action-index
+      +button($bg: $button-index-color, $padding: $button-sml)
+      margin-right: $button-margin
+    &.form-action-new
+      +button($bg: $button-new-color, $padding: $button-sml)
+      margin-right: $button-margin
+    &.form-action-edit
+      +button($bg: $button-edit-color, $padding: $button-sml)
+      margin-right: $button-margin
+    &.form-action-destroy
+      +button($bg: $button-destroy-color, $padding: $button-sml)
+    &.form-action-qr-codes
+      +button($bg: $button-qr-code-color, $padding: $button-sml)
+      span
+        @extend .fa
+        @extend .fa-qrcode
+        @extend .fa-lg
+        &:before
+          padding-right: rem-calc(10)

app/assets/stylesheets/supplier/foundation1/foundation_and_overrides.css.sass

@@ -1,6 +1,10 @@
 @mixin button-icon-only
   padding: 2px 5px
   margin: 0
+
+@mixin table-fit
+  width: 1px
+  white-space: nowrap
 // Foundation by ZURB
 // foundation.zurb.com
 // Licensed under MIT Open Source
@@ -320,7 +324,6 @@ $secondary-color: #d7d7d7
 //
 
 // $include-html-button-classes: $include-html-classes;
-
 // We use these to build padding for buttons.
 // $button-tny: rem-calc(10);
 // $button-sml: rem-calc(14);
@@ -1243,4 +1246,13 @@ $secondary-color: #d7d7d7
 // $range-slider-handle-round: $global-rounded;
 // $range-slider-handle-bg-hover-color: scale-color($primary-color, $lightness: -12%);
 // $range-slider-handle-cursor: pointer;
+
+// CUSTOM VARIABLES
 @import 'foundation'
+$button-margin: rem-calc(10)
+$button-qr-code-color: #555
+$button-index-color: $secondary-color
+$button-new-color: #afa
+$button-edit-color: #ffa
+$button-destroy-color: #faa
+

app/assets/stylesheets/supplier/foundation1/products_preview.css.sass

@@ -1,3 +1,4 @@
+@import ./foundation_and_overrides
 .products_preview-date
   .products_preview-time-container
   float: left
@@ -15,3 +16,5 @@
   margin-left: 10px
   select
     width: 50px
+#products-table
+  width: 100%

app/assets/stylesheets/supplier/foundation1/structure.css.sass

@@ -1,9 +1,6 @@
 $side-spacing: 0px
 @import constants
 @import ./foundation_and_overrides
-@mixin table-fit
-  width: 1px
-  white-space: nowrap
 html
 body
   label
@@ -54,7 +51,7 @@ form
 .clear
   clear: both
 body
-  background-image: $wood
+  background-image: $wood !important
   background-repeat: repeat
 main.main-section
   +panel($bg:rgba(200,200,200,0.8))
@@ -64,12 +61,3 @@ main.main-section
 
 .hide, .hidden
   display: none
-table
-  &.table
-    // Bootstrap behaviour
-    width: 100%
-  td.actions, th.actions
-    text-align: right
-    +table-fit
-  th.status-icons, td.status-icons
-    +table-fit

app/assets/stylesheets/supplier/foundation1/tables.css.sass

@@ -0,0 +1,27 @@
+@import constants
+@import ./foundation_and_overrides
+@import font-awesome
+table
+  &.table
+    // Bootstrap behaviour
+    width: 100%
+  td.actions, th.actions
+    text-align: right
+    +table-fit
+  th.status-icons, td.status-icons
+    +table-fit
+  .table-edit
+    +button($bg: $secondary-color)
+    +button-icon-only
+    span
+      @extend .fa
+      @extend .fa-pencil
+  .table-destroy
+    +button($bg: $secondary-color)
+    +button-icon-only
+    color: $warning-color
+
+    margin-left: 8px
+    span
+      @extend .fa
+      @extend .fa-times

app/views/suppliers/products/index.html.slim

@@ -1,7 +1,6 @@
 - model_class = Product
 .page-header= title :index, model_class
-.span7
+.medium-12.large-8.columns
-  .well
   - if @products.any?
     table.table
       thead
@@ -21,22 +20,27 @@
             td.link= product.category_links namespace: :suppliers 
             td.timestamp data-time=product.created_at.utc.iso8601
             td.actions
-                = link_to t('helpers.links.edit'), [:edit, :suppliers, product], class: 'btn btn-mini edit-resource-button'
+              = link_to [:edit, :suppliers, product], class: 'table-edit' do
-                '
+                span data-title="helpers.links.edit"
-                = link_to t("helpers.links.destroy"), [:suppliers, product], method: :delete, data: {confirm: are_you_sure? }, class: 'btn btn-mini btn-danger'
+              = link_to [:suppliers, product], method: :delete, data: {confirm: are_you_sure? }, class: 'table-destroy' do
+                span data-title="helpers.links.destroy"
   - else
     = no_content_given model_class
-  = link_to t("helpers.links.new"), new_suppliers_product_path(product_category_id: @product_category.try(:id)), class: 'btn btn-primary', data: {t: 'product.new'}
+  .form-actions
+    = link_to  new_suppliers_product_path(product_category_id: @product_category.try(:id)), class: 'form-action-new'
+      span data-t="helpers.links.new"
   /a.btn.btn-primary data-t="helpers.links.new" href=new_suppliers_product_path
-.span4
+.medium-12.large-4.columns
+  .medium-6.large-12.columns
     h4 data-t='product.preview.header'= t('supplier.product.preview.header')
     .products_preview-time-container
       .products_preview-date= text_field_tag :date, Date.today.iso8601, class: 'datepicker'
+      br
       .products_preview-hour= select_tag :preview_hour, options_for_select(0..23)
       .products_preview-minute= select_tag :preview_minute, options_for_select(1..60)
       .clear
+  .medium-6.large-12.columns
     p data-t='product.preview.description'= t('supplier.product.preview.description')
-  .well
     table#products-table
       tbody
 script#products-category-template[type="text/html"]= mustache_template 'user/products_category'

app/views/suppliers/sections/index.html.slim

@@ -26,4 +26,5 @@
   - else
     = no_content_given model_class
 .form-actions
-  = link_to t("helpers.links.new"), new_suppliers_section_path, class: 'btn btn-primary', data: {t: 'helpers.links.new'}
+  = link_to new_suppliers_section_path, class: 'form-action-new'
+    span data-t="helpers.links.new"

app/views/suppliers/tables/index.html.slim

@@ -7,7 +7,6 @@ div.page-header= title :index, model_class
   input#filter-to_number.number type="number" size=4 value=params[:to_number] name="to_number"
   '
   = submit_tag 'Filter'
-.well
 - if @tables.any?
   = paginate @tables
   table.table
@@ -24,13 +23,15 @@ div.page-header= title :index, model_class
           td.link= link_to_if table.section.present?, table.section.try(:title), [:suppliers, table.section]
           td.timestamp data-time=table.created_at.try(:utc).try(:iso8601)
           td.actions
-              = link_to t('helpers.links.edit'), [:edit, :suppliers, table], class: 'btn btn-mini', data: {t: 'helpers.links.edit'}
+            = link_to [:edit, :suppliers, table], class: 'table-edit' do
-              '
+              span data-title="helpers.links.edit"
-              = link_to t("helpers.links.destroy"), [:suppliers, table], method: :delete, data: {confirm: are_you_sure? }, class: 'btn btn-mini btn-danger', data: {t: 'helpers.links.destroy'}
+            = link_to [:suppliers, table], method: :delete, data: {confirm: are_you_sure? }, class: 'table-destroy' do
+              span data-title="helpers.links.destroy"
 - else
   = no_content_given model_class
 
 .form-actions
-  = link_to t("helpers.links.new"), new_suppliers_table_path, class: 'btn btn-primary', data: {t: 'helpers.links.new'}
+  = link_to new_suppliers_table_path, class: 'form-action-new'
-  '
+    span data-t="helpers.links.new"
-  = link_to t('supplier.tables.qr_codes.link'), qr_codes_suppliers_tables_path(params.slice(:from_number, :to_number)), class: 'btn btn-info', data: {t: 'tables.qr_codes.link'}, target: :_blank
+  = link_to qr_codes_suppliers_tables_path(params.slice(:from_number, :to_number)), class: 'form-action-qr-codes', target: :_blank
+    span data-t="tables.qr_codes.link"

app/views/suppliers/tables/show.html.slim

@@ -7,10 +7,11 @@ dl.dl-horizontal.show-list
   - if @table.section.present?
     dt= Section.model_name.human
     dd= link_to @table.section.title, [:suppliers, @table.section]
-
+//= supplier_form_actions :index, :edit, :destroy, object: @table, for: :tables
 .form-actions
-  = link_to t("helpers.links.back"), suppliers_tables_path, class: 'btn'
+  = link_to [:suppliers, :tables], class: 'form-action-index'
-  '
+    span data-t="helpers.links.index"
-  = link_to t('helpers.links.edit'), [:edit, :suppliers, @table], class: 'btn'
+  = link_to [:edit, :suppliers, @table], class: 'form-action-edit'
-  '
+    span data-t="helpers.links.edit"
-  = link_to t("helpers.links.destroy"), [:suppliers, @table], method: :delete, data: {confirm: are_you_sure? }, class: 'btn btn-danger'
+  = link_to [:suppliers, @table], method: :delete, data: {confirm: are_you_sure? }, class: 'form-action-destroy'
+    span data-t="helpers.links.destroy"