From 510453f5949c783a63f2e63a97d0973641f06525 Mon Sep 17 00:00:00 2001
From: Michael Neuendorf <michael@neuendorf-online.de>
Date: Sat, 21 Mar 2020 13:47:20 +0100
Subject: [PATCH] Move "consum all" button to ellipsis menu on small devices

---
 public/css/grocy.css          | 2 ++
 views/stockoverview.blade.php | 9 ++++++++-
 2 files changed, 10 insertions(+), 1 deletion(-)

diff --git a/public/css/grocy.css b/public/css/grocy.css
index d75b5665..8c6de2fa 100644
--- a/public/css/grocy.css
+++ b/public/css/grocy.css
@@ -233,6 +233,7 @@ input::-webkit-inner-spin-button {
 	width: 96vw; /* Set width of popup menu to screen size */
 }
 
+
 /* Set width of popup menu to fixed value on larger devices */
 @media (min-width: 400px) {
 	.table-inline-menu.dropdown-menu {
@@ -257,6 +258,7 @@ input::-webkit-inner-spin-button {
 	padding: 0;
 	word-wrap: break-word;
 	white-space: pre-wrap;
+	color: inherit;
 }
 
 /* Third party component customizations - Bootstrap */
diff --git a/views/stockoverview.blade.php b/views/stockoverview.blade.php
index 37730e5e..fab96a69 100644
--- a/views/stockoverview.blade.php
+++ b/views/stockoverview.blade.php
@@ -105,7 +105,7 @@
 							data-consume-amount="1">
 							<i class="fas fa-utensils"></i> 1
 						</a>
-						<a id="product-{{ $currentStockEntry->product_id }}-consume-all-button" class="btn btn-danger btn-sm product-consume-button @if($currentStockEntry->amount == 0) disabled @endif" href="#" data-toggle="tooltip" data-placement="right" title="{{ $__t('Consume all %s which are currently in stock', FindObjectInArrayByPropertyValue($products, 'id', $currentStockEntry->product_id)->name) }}"
+						<a id="product-{{ $currentStockEntry->product_id }}-consume-all-button" class="d-none d-sm-inline-block btn btn-danger btn-sm product-consume-button @if($currentStockEntry->amount == 0) disabled @endif" href="#" data-toggle="tooltip" data-placement="right" title="{{ $__t('Consume all %s which are currently in stock', FindObjectInArrayByPropertyValue($products, 'id', $currentStockEntry->product_id)->name) }}"
 							data-product-id="{{ $currentStockEntry->product_id }}"
 							data-product-name="{{ FindObjectInArrayByPropertyValue($products, 'id', $currentStockEntry->product_id)->name }}"
 							data-product-qu-name="{{ FindObjectInArrayByPropertyValue($quantityunits, 'id', FindObjectInArrayByPropertyValue($products, 'id', $currentStockEntry->product_id)->qu_id_stock)->name }}"
@@ -125,6 +125,13 @@
 								<i class="fas fa-ellipsis-v"></i>
 							</button>
 							<div class="table-inline-menu dropdown-menu dropdown-menu-right">
+								<a id="product-{{ $currentStockEntry->product_id }}-consume-all-button" class="d-inline-block d-sm-none dropdown-item show-as-dialog-link text-danger product-consume-button @if($currentStockEntry->amount == 0) disabled @endif" href="#" data-toggle="tooltip" data-placement="right"
+									data-product-id="{{ $currentStockEntry->product_id }}"
+									data-product-name="{{ FindObjectInArrayByPropertyValue($products, 'id', $currentStockEntry->product_id)->name }}"
+									data-product-qu-name="{{ FindObjectInArrayByPropertyValue($quantityunits, 'id', FindObjectInArrayByPropertyValue($products, 'id', $currentStockEntry->product_id)->qu_id_stock)->name }}"
+									data-consume-amount="{{ $currentStockEntry->amount }}">
+									<span class="dropdown-item-icon"><i class="fas fa-utensils"></i></span> <span class="dropdown-item-text">{{ $__t('Consume all %s which are currently in stock', FindObjectInArrayByPropertyValue($products, 'id', $currentStockEntry->product_id)->name) }}</span>
+								</a>
 								<a class="dropdown-item show-as-dialog-link" type="button" href="{{ $U('/shoppinglistitem/new?embedded&updateexistingproduct&product=' . $currentStockEntry->product_id ) }}">
 									<span class="dropdown-item-icon"><i class="fas fa-shopping-cart"></i></span> <span class="dropdown-item-text">{{ $__t('Add to shopping list') }}</span>
 								</a>