diff --git a/app/assets/images/icons/list.png b/app/assets/images/icons/list.png
index 97101a0f..d63c9724 100644
Binary files a/app/assets/images/icons/list.png and b/app/assets/images/icons/list.png differ
diff --git a/app/assets/images/icons/menu.png b/app/assets/images/icons/menu.png
index e4f891e6..df9b26c3 100644
Binary files a/app/assets/images/icons/menu.png and b/app/assets/images/icons/menu.png differ
diff --git a/app/assets/images/icons/needs-help.png b/app/assets/images/icons/needs-help.png
index d1de25c3..0fffdd04 100644
Binary files a/app/assets/images/icons/needs-help.png and b/app/assets/images/icons/needs-help.png differ
diff --git a/app/assets/images/icons/needs-payment.png b/app/assets/images/icons/needs-payment.png
index 8c595c3d..f0b8109a 100644
Binary files a/app/assets/images/icons/needs-payment.png and b/app/assets/images/icons/needs-payment.png differ
diff --git a/app/assets/images/theme1/button-bar-left.png b/app/assets/images/theme1/button-bar-left.png
new file mode 100644
index 00000000..9904d59f
Binary files /dev/null and b/app/assets/images/theme1/button-bar-left.png differ
diff --git a/app/assets/images/theme1/button-bar-middle.png b/app/assets/images/theme1/button-bar-middle.png
new file mode 100644
index 00000000..fdf328fd
Binary files /dev/null and b/app/assets/images/theme1/button-bar-middle.png differ
diff --git a/app/assets/images/theme1/button-bar-right.png b/app/assets/images/theme1/button-bar-right.png
new file mode 100644
index 00000000..357aec82
Binary files /dev/null and b/app/assets/images/theme1/button-bar-right.png differ
diff --git a/app/assets/images/theme1/button-wood-left.png b/app/assets/images/theme1/button-wood-left.png
new file mode 100644
index 00000000..aa949d8a
Binary files /dev/null and b/app/assets/images/theme1/button-wood-left.png differ
diff --git a/app/assets/images/theme1/button-wood-middle.png b/app/assets/images/theme1/button-wood-middle.png
new file mode 100644
index 00000000..63ab89ee
Binary files /dev/null and b/app/assets/images/theme1/button-wood-middle.png differ
diff --git a/app/assets/images/theme1/button-wood-right.png b/app/assets/images/theme1/button-wood-right.png
new file mode 100644
index 00000000..24b632ee
Binary files /dev/null and b/app/assets/images/theme1/button-wood-right.png differ
diff --git a/app/assets/javascripts/user/application.js.erb b/app/assets/javascripts/user/application.js.erb
index 2be7040a..7cdc271c 100644
--- a/app/assets/javascripts/user/application.js.erb
+++ b/app/assets/javascripts/user/application.js.erb
@@ -39,7 +39,8 @@ var path_mapping = {
list_products: '/user/list_products',
active_list: '/user/active_list',
history_list: '/user/history_list',
- obtain_user_token: '/user/obtain_token'
+ obtain_user_token: '/user/obtain_token',
+ lists_history: '/user/list_history'
}
var $translations = {
en: {
diff --git a/app/assets/stylesheets/_constants.css.sass b/app/assets/stylesheets/_constants.css.sass
index 4f3aade9..1a3502fa 100644
--- a/app/assets/stylesheets/_constants.css.sass
+++ b/app/assets/stylesheets/_constants.css.sass
@@ -1,6 +1,7 @@
//$qbrown: #634227
$qbrown: #853d15
$qbrown-active: lighten($qbrown, 20%)
+$green: #7BB459 //Heineken
//$wood: image-url('textures/wood001-vertical.jpg')
$wood: image-url('textures/theme1.jpg')
$background-brown: #57351f
diff --git a/app/assets/stylesheets/user/_constants.css.sass b/app/assets/stylesheets/user/_constants.css.sass
new file mode 100644
index 00000000..20088d19
--- /dev/null
+++ b/app/assets/stylesheets/user/_constants.css.sass
@@ -0,0 +1,78 @@
+$qbrown: #853d15
+$qbrown-active: lighten($qbrown, 20%)
+$green: #7BB459 //Heineken
+//$wood: image-url('textures/wood001-vertical.jpg')
+$wood: image-url('textures/theme1.jpg')
+$background-brown: #57351f
+$side-spacing: 5px
+=wood-button
+ background-color: transparent
+ background-repeat: no-repeat, no-repeat, repeat-x
+ background-position: left center, right center, center center
+ background-image: url(/assets/theme1/button-wood-left.png), url(/assets/theme1/button-wood-right.png), url(/assets/theme1/button-wood-middle.png)
+ color: $green
+ border-width: 0
+ border-radius: 0
+ height: 31px
+ //padding-bottom: 18px
+ +box-shadow(#000 4px 4px 8px)
+ &:hover
+ background-color: transparent
+ background-repeat: no-repeat, no-repeat, repeat-x
+ background-position: left center, right center, center center
+ background-image: url(/assets/theme1/button-wood-left.png), url(/assets/theme1/button-wood-right.png), url(/assets/theme1/button-wood-middle.png)
+ color: blue
+=button-bar
+ background-color: transparent
+ background-repeat: no-repeat, no-repeat
+ background-position: left bottom, right bottom
+ background-image: image-url('theme1/button-bar-left.png'), image-url('theme1/button-bar-right.png')
+ color: $green
+ border-width: 0
+ border-radius: 0
+ min-height: 61px
+ height: 61px
+ padding-left: 49px
+ padding-right: 53px
+ .button-bar-inner
+ //+single-box-shadow(#000, 0px, 4px, 8px, 0px, true)
+ background-color: white
+ background-repeat: repeat-x
+ background-position: center bottom
+ background-image: image-url('theme1/button-bar-middle.png')
+ //min-height: 61px
+ height: 100%
+ .button-bar-content
+ padding: 8px
+ .title
+ margin-top: -10px
+ margin-right: 5px
+ margin-left: 5px
+ margin-bottom: 3px
+ color: black
+ float: left
+ .action-buttons
+ float: left
+ width: 150px
+ //padding-bottom: 18px
+ //+box-shadow(#000 4px 4px 8px)
+=user-button
+ +wood-button
+ cursor: pointer
+ border: 0px solid black
+ //+border-radius(4px)
+ //+box-shadow(#000 4px 4px 8px)
+ width: 30px
+ //height: 34px
+ display: inline-block
+ float: left
+ margin-right: 15px
+ background-color: $qbrown
+ text-align: center
+ line-height: 34px
+ text-indent: -5000px
+ &.active
+ background-color: $qbrown-active
+ &.hide
+ display: none
+
diff --git a/app/assets/stylesheets/user/list_products.css.sass b/app/assets/stylesheets/user/list_products.css.sass
new file mode 100644
index 00000000..71aa35e7
--- /dev/null
+++ b/app/assets/stylesheets/user/list_products.css.sass
@@ -0,0 +1,5 @@
+@import compass
+@import user/constants
+#products-table
+ .order-product-button
+ +wood-button
diff --git a/app/assets/stylesheets/user/structure.css.sass b/app/assets/stylesheets/user/structure.css.sass
index 03f83469..e8dc2fe0 100644
--- a/app/assets/stylesheets/user/structure.css.sass
+++ b/app/assets/stylesheets/user/structure.css.sass
@@ -1,27 +1,5 @@
@import compass
-@import constants
-$side-spacing: 5px
-=user-button
- cursor: pointer
- border: 2px solid black
- +border-radius(4px)
- +box-shadow(#000 4px 4px 8px)
- width: 34px
- height: 34px
- display: block
- float: left
- margin-left: 15px
- background-color: $qbrown
- text-align: center
- line-height: 34px
- background-repeat: no-repeat
- background-position: center center
- text-indent: -5000px
- &.active
- background-color: $qbrown-active
- &.hide
- display: none
-
+@import user/constants
html
background-image: $wood
background-color: $background-brown
@@ -58,14 +36,21 @@ body
margin-top: 5px
margin-left: auto
margin-right: auto
- background-color: green
width: 262px
a
+user-button
+ span
+ display: block
+ width: 28px
+ height: 26px
+ background-repeat: no-repeat
+ background-position: center center
&.home-list-link
- background-image: image-url('icons/list.png')
+ span
+ background-image: image-url('icons/list.png')
&.home-menu-link
- background-image: image-url('icons/menu.png')
+ span
+ background-image: image-url('icons/menu.png')
//padding-top: 50px
.navbar-fixed-top
margin-left: -$side-spacing
@@ -82,11 +67,6 @@ body
.order-count-cell
white-space: nowrap
.page-header
- .supplier-name
- float: right
- margin-right: 8px
- .table-number
- float: right
#list-needs-help-button
button
margin-left: 5px
@@ -99,11 +79,32 @@ body
padding-left: 5px
.user-top-button
+user-button
- &#show-active-list
- background-image: image-url('icons/list.png')
- &#place-order-on-list
- background-image: image-url('icons/menu.png')
- &#list-needs-payment-button
- background-image: image-url('icons/needs-payment.png')
- &#list-needs-help-button
- background-image: image-url('icons/needs-help.png')
+ span
+ display: block
+ width: 28px
+ height: 28px
+ background-position: center center
+ background-repeat: no-repeat
+.top-button-bar
+ +button-bar
+ height: 90px
+ .button-bar-content
+ padding-top: 10px
+ .supplier-name
+ float: right
+ margin-right: 8px
+ .table-number
+ float: right
+ #show-active-list
+ span
+ background-image: image-url('icons/list.png')
+ #place-order-on-list
+ span
+ background-image: image-url('icons/menu.png')
+ #list-needs-payment-button
+ span
+ background-image: image-url('icons/needs-payment.png')
+ #list-needs-help-button
+ span
+ background-image: image-url('icons/needs-help.png')
+
diff --git a/app/helpers/application_helper.rb b/app/helpers/application_helper.rb
index 63895cdf..4c1cde3a 100644
--- a/app/helpers/application_helper.rb
+++ b/app/helpers/application_helper.rb
@@ -97,4 +97,16 @@ module ApplicationHelper
render(template, handlers: [:mustache])
end
+ def top_bar(options = {}, &block)
+ title = options[:title]
+ title = title.present? ? content_tag(:h3, t("user.#{title}"), class: 'title', data: {t: title}) : ''
+ content_tag :div, class: 'top-button-bar' do
+ content_tag :div, class: 'button-bar-inner' do
+ content_tag :div, class: 'button-bar-content' do
+ (title + capture(&block)).html_safe
+ end
+ end
+ end
+ end
+
end
diff --git a/app/templates/user/_products_category_for_order.mustache b/app/templates/user/_products_category_for_order.mustache
index eddbf7c6..fb7cf3ff 100644
--- a/app/templates/user/_products_category_for_order.mustache
+++ b/app/templates/user/_products_category_for_order.mustache
@@ -8,6 +8,6 @@
+
| {{#currency}}{{price}}{{/currency}} |
- |
+ |
{{/products}}
diff --git a/app/views/layouts/phone.html.slim b/app/views/layouts/phone.html.slim
index 21fd232e..7fcbe663 100644
--- a/app/views/layouts/phone.html.slim
+++ b/app/views/layouts/phone.html.slim
@@ -57,18 +57,18 @@ html lang="en"
QMobile.setAuthToken('#{current_user.authentication_token}');QMobile.setUserId('#{current_user.id}');
body class=action_name
- .navbar.navbar-fixed-top
- .navbar-inner
- .container
- a.btn.btn-navbar data-target=".nav-collapse" data-toggle="collapse"
- span.icon-bar
- span.icon-bar
- span.icon-bar
- = link_to image_tag('icons/logo-small.png', alt: application_title), user_root_path, class: :brand
- .container.nav-collapse
- ul.nav#top-navigation-list
- li= link_to 'View history', user_list_history_path
-
+ - unless ENV['QWAITER_MOBILE_EXPORT'] == 'yes'
+ .navbar.navbar-fixed-top
+ .navbar-inner
+ .container
+ a.btn.btn-navbar data-target=".nav-collapse" data-toggle="collapse"
+ span.icon-bar
+ span.icon-bar
+ span.icon-bar
+ = link_to image_tag('icons/logo-small.png', alt: application_title), user_root_path, class: :brand
+ .container.nav-collapse
+ ul.nav#top-navigation-list
+ li= link_to 'View history', user_list_history_path
.container
.content
diff --git a/app/views/user/active_list.html.slim b/app/views/user/active_list.html.slim
index 6dad3573..16966741 100644
--- a/app/views/user/active_list.html.slim
+++ b/app/views/user/active_list.html.slim
@@ -1,11 +1,13 @@
-.page-header
- .table-number
- .supplier-name
- h4 data-t="active_list.title" = t('user.active_list.title', list: List.model_name.human)
-.form-actions
- = link_to t('helpers.links.place_order'), user_list_products_path, class: ['user-top-button'], id: 'place-order-on-list'
- span#list-needs-payment-button.user-top-button
- span#list-needs-help-button.user-top-button
+= top_bar title: 'active_list.title' do
+ .pull-right
+ .table-number
+ .supplier-name
+ .action-buttons
+ = link_to content_tag(:span, t('helpers.links.place_order')), user_list_products_path, class: ['user-top-button'], id: 'place-order-on-list'
+ span#list-needs-payment-button.user-top-button
+ span
+ span#list-needs-help-button.user-top-button
+ span
.well
table#active-list-table.table
thead
diff --git a/app/views/user/home.html.slim b/app/views/user/home.html.slim
index 13ab7020..3ddfebd9 100644
--- a/app/views/user/home.html.slim
+++ b/app/views/user/home.html.slim
@@ -4,8 +4,8 @@
a href="#" onClick="QMobile.scanQr()" = image_tag 'scan-logo.png'
.home-footer
.home-footer-content
- = link_to 'P', user_list_products_path, class: [:hide, 'home-link', 'home-menu-link']
- = link_to 'L', user_active_list_path, class: [:hide, 'home-link', 'home-list-link']
+ = link_to content_tag(:span, 'P'), user_list_products_path, class: [:hide, 'home-link', 'home-menu-link']
+ = link_to content_tag(:span, 'L'), user_active_list_path, class: [:hide, 'home-link', 'home-list-link']
- content_for :footer do
javascript:
$(function(){
diff --git a/app/views/user/list_products.html.slim b/app/views/user/list_products.html.slim
index 0fe08708..336b73d7 100644
--- a/app/views/user/list_products.html.slim
+++ b/app/views/user/list_products.html.slim
@@ -1,11 +1,14 @@
-.page-header
- .table-number
- .supplier-name
- h4 data-t="show_products.title" = t('user.show_products.title', products: Product.model_name.human_plural)
-.form-actions
- = link_to t('helpers.links.show_active_list', list: List.model_name.human), user_active_list_path, class: ['user-top-button'], id: 'show-active-list'
- span#list-needs-payment-button.user-top-button
- span#list-needs-help-button.user-top-button
+= top_bar title: 'show_products.title' do
+ .pull-right
+ .table-number
+ .supplier-name
+ .action-buttons
+ = link_to content_tag(:span, t('helpers.links.show_active_list'), list: List.model_name.human), user_active_list_path, class: ['user-top-button'], id: 'show-active-list'
+ span#list-needs-payment-button.user-top-button
+ span
+ span#list-needs-help-button.user-top-button
+ span
+
.well
table#products-table.table
tbody
diff --git a/config/locales/en.yml b/config/locales/en.yml
index 293f8b7f..bdcbfae4 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -92,9 +92,9 @@ en:
closed_at: Closed at
supplier:
menu:
- active_lists: Active %{lists}
+ active_lists: Active lists
active_lists:
- title: Active %{lists}
+ title: Active list
price: Price
active_orders:
title: Active %{orders}