Design and style upgrades

This commit is contained in:
2014-03-31 17:43:51 +02:00
parent bbf1a11a2e
commit 14217efad3
15 changed files with 126 additions and 119 deletions
@@ -1,14 +1,21 @@
td.list-status
if view.content.needs_help
span.list-needs-help-indicator ?
span.icon.needs-help
if view.content.needs_payment
span.list-needs-payment-indicator €
|
span.icon.needs-payment
td.numeric.table_number {{view.content.table_number}}
td.section_title {{view.content.section.title}}
td.currency.total_list_amount {{currency view.content.price}}
td.actions
if view.content.needs_help
button.btn.btn-info.mark_list_as_helped{ action markListAsHelped view.content.id} {{t 'list.is_helped_button'}}
button.btn.btn-warning.close_list{ action closeList view.content.id} {{t 'list.close_list' }}
a.btn href="/supplier/lists/{{unbound view.content.id}}"
button.mark_list_as_helped{ action markListAsHelped view.content.id}
span.fa-stack
i.fa.fa-bell.fa-stack-1x
i.fa.fa-ban.fa-stack-2x.revoke
span.button-text=t 'list.is_helped_button'
button.close_list{ action closeList view.content.id}
span.fa.fa-times.fa-2x
span.button-text=t 'list.close_list'
a.btn.hide href="/supplier/lists/{{unbound view.content.id}}"
span.icon-list  
@@ -1,3 +1,5 @@
td.status-icons
span.active-order.fa.fa-check.fa-lg
td {{view.content.display}}
td.numeric.table_number
view Qsupplier.App.ActiveOrderTableNumberView contextBinding=view.content
@@ -5,5 +7,17 @@ td.section_title {{view.content.section.title}}
td.currency {{currency view.content.total }}
td.actions
if view.content.placed
button.btn.btn-success{ action markOrderActive view.content.id} {{t 'order.being_processed'}}
button.btn.btn-inverse{ action markOrderDelivered view.content.id} {{t 'order.being_served' }}
button{ action markOrderActive view.content.id}
span.fa.fa-check.fa-2x
span.button-text=t 'order.being_processed'
button.hide.mark-order-active{ action markOrderActive view.content.id}
span.button-icon
span.button-text=t 'order.being_processed'
button{ action markOrderDelivered view.content.id}
span.fa-shifted-stack
i.fa.fa-check.fa-2x
i.fa.fa-check.fa-2x
span.button-text= t 'order.being_served'
button.hide.mark-order-delivered{ action markOrderDelivered view.content.id}
span.button-icon
span.button-text= t 'order.being_served'
@@ -21,6 +21,7 @@
table.active-orders-table.table
thead
tr
th.status-icons
th {{t 'models.order'}}
th.numeric {{t 'table_number'}}
th {{t 'models.section'}}
@@ -17,7 +17,10 @@ App.ApplicationController = Ember.Controller.extend
list_needs_help: -> @set 'list.needs_help', true # incoming from other users
list_is_paid: -> @set 'list.needs_payment', false
list_needs_payment: -> @set 'list.needs_payment', true # incoming from other users
list_closed: -> @set 'list', null
list_closed: (data)->
@transitionToRoute('list', data.id).then =>
@set 'list.state', 'closed'
@set 'list', null
join_request_approved: (data)->
@setCurrentList -> @transitionToRoute('active_list')
order_being_processed: (data)->
@@ -12,7 +12,7 @@
.right
if list.id
App.MenuItemView route="active_list"
App.MenuItemView route='list_products'
App.MenuItemView route='table' route_param=list.table.id
App.MenuItemListNeedsHelpView
App.MenuItemListNeedsPaymentView
aside.left-off-canvas-menu
@@ -25,12 +25,13 @@
li
a{action scanQr bubbles=false}
span Scan QR
li
=link-to 'list_products'
span= t 'list_products.title'
li
=link-to 'active_list'
span= t 'active_list.title'
if list.id
li
=link-to 'table' list.table.id
span= t 'list_products.title'
li
=link-to 'active_list'
span= t 'active_list.title'
li
=link-to 'lists'
span= t 'models.plural.list'
@@ -1 +1 @@
span.needs-help.fa.fa-hand-o-up.fa-lg
span.icon.needs-help
@@ -1 +1 @@
span.needs-payment.fa.fa-money.fa-lg
span.icon.needs-payment
@@ -2,7 +2,10 @@ App.MenuItemView = Ember.View.extend
classNames: 'menu-list-item'
classNameBindings: ['active']
click: ->
@get('controller').transitionToRoute(@route)
if @route_param
@get('controller').transitionToRoute(@route, @route_param)
else
@get('controller').transitionToRoute(@route)
active: (->
if @get('controller.currentPath') == @route then 'active' else ''
).property('controller.currentPath')
@@ -0,0 +1,31 @@
.button-text
// Only icons for now
display: none
.active-orders-table
.status-icons
span
display: none
.active
.status-icons
.active-order
display: inline-block
.active-orders-table
tbody
tr
td
.active_order_table_number
position: relative
.extra-list-info
// Facebook profiles
display: none
$extra-info-width: 220px
position: absolute
width: $extra-info-width
// 7px is padding + border, 5px is extra spacing
right: -$extra-info-width - 7px*2 - 5px
top: -7px*2
padding: 4px
border: 3px solid #aaa
border-radius: 3px
background-color: white
text-align: left
@@ -0,0 +1,38 @@
@import font-awesome
span.icon
@extend .fa
@extend .fa-lg
&.needs-help
@extend .fa-bell
&.needs-payment
@extend .fa-money
.fa-stack
.revoke
color: #b94a48
.button-icon
display: inline-block
width: 2em
height: 2em
line-height: 2em
vertical-align: middle
background-repeat: no-repeat
background-position: center center
.mark-order-active .button-icon
background-image: image-url('icons/order-check.png')
.mark-order-delivered .button-icon
background-image: image-url('icons/order-doublecheck.png')
.fa-shifted-stack
position: relative
display: inline-block
width: 2.5em
height: 2em
line-height: 2em
vertical-align: middle
.fa
position: absolute
width: 100%
left: 20%
&:first-child
left: -10%
@@ -1,50 +0,0 @@
.list-status
.list-needs-help-indicator
display: inline-block
width: 30px
color: #400
background-color: #aaf
text-align: center
margin-right: 7px
&.hide
display: none
.list-needs-payment-indicator
display: inline-block
width: 30px
color: #440
background-color: #faa
text-align: center
margin-right: 7px
&.hide
display: none
.active-orders-table
tbody
tr
td
&:first-child
padding-left: 35px
background-position: 5px center
background-repeat: no-repeat
.active_order_table_number
position: relative
.extra-list-info
display: none
$extra-info-width: 220px
position: absolute
width: $extra-info-width
// 7px is padding + border, 5px is extra spacing
right: -$extra-info-width - 7px*2 - 5px
top: -7px*2
padding: 4px
border: 3px solid #aaa
border-radius: 3px
background-color: white
text-align: left
&.active
td
&:first-child
background-image: image-url('icons/order-check.png')
&.delivered
td
&:first-child
background-image: image-url('icons/order-doublecheck.png')
@@ -1,50 +0,0 @@
.list-status
.list-needs-help-indicator
display: inline-block
width: 30px
color: #400
background-color: #aaf
text-align: center
margin-right: 7px
&.hide
display: none
.list-needs-payment-indicator
display: inline-block
width: 30px
color: #440
background-color: #faa
text-align: center
margin-right: 7px
&.hide
display: none
.active-orders-table
tbody
tr
td
&:first-child
padding-left: 35px
background-position: 5px center
background-repeat: no-repeat
.active_order_table_number
position: relative
.extra-list-info
display: none
$extra-info-width: 220px
position: absolute
width: $extra-info-width
// 7px is padding + border, 5px is extra spacing
right: -$extra-info-width - 7px*2 - 5px
top: -7px*2
padding: 4px
border: 3px solid #aaa
border-radius: 3px
background-color: white
text-align: left
&.active
td
&:first-child
background-image: image-url('icons/order-check.png')
&.delivered
td
&:first-child
background-image: image-url('icons/order-doublecheck.png')
@@ -1,3 +1,4 @@
@import font-awesome
section.main-section
height: 100%
.top-menu
@@ -13,6 +14,13 @@ section.main-section
&.active
color: yellow
border-color: yellow
span.icon
@extend .fa
@extend .fa-lg
&.needs-help
@extend .fa-bell
&.needs-payment
@extend .fa-money
#notice
a
color: white
@@ -11,7 +11,7 @@ class UserExtendedListSerializer < Qwaiter::Serializer
embed :ids, include: true
attributes :extended_version, :state, :needs_help, :needs_payment, :is_paid, :price,
:table_id, :table_number, :section_id, :user_ids,
:supplier_orders_in_process_count, :supplier_orders_placed_count
:supplier_orders_in_process_count, :supplier_orders_placed_count, :supplier_id
def has_active_orders
object.has_active_orders?
@@ -21,6 +21,7 @@ class UserExtendedListSerializer < Qwaiter::Serializer
has_one :table, serializer: UserExtendedTableSerializer
has_many :join_requests
has_many :users, serializer: UserUserSerializer
#has_one :supplier
def extended_version
true