diff --git a/public/css/grocy.css b/public/css/grocy.css
old mode 100644
new mode 100755
index bd9fae7e..6a2fb7e9
--- a/public/css/grocy.css
+++ b/public/css/grocy.css
@@ -396,6 +396,12 @@ input::-webkit-inner-spin-button {
 	}
 }
 
+@media (max-width: 767.98px) {
+	.width-xs-sm-100 {
+		width: 100%;
+	}
+}
+
 body.fixed-nav {
 	padding-top: 54px;
 }
diff --git a/public/viewjs/stockoverview.js b/public/viewjs/stockoverview.js
old mode 100644
new mode 100755
index a864ff63..d038c193
--- a/public/viewjs/stockoverview.js
+++ b/public/viewjs/stockoverview.js
@@ -229,9 +229,9 @@ function RefreshStatistics()
 	Grocy.Api.Get('stock/volatile?expiring_days=' + nextXDays,
 		function(result)
 		{
-			$("#info-expiring-products").text(__n(result.expiring_products.length, '%s product expires', '%s products expiring') + ' ' + __n(nextXDays, 'within the next day', 'within the next %s days'));
-			$("#info-expired-products").text(__n(result.expired_products.length, '%s product is already expired', '%s products are already expired'));
-			$("#info-missing-products").text(__n(result.missing_products.length, '%s product is below defined min. stock amount', '%s products are below defined min. stock amount'));
+			$("#info-expiring-products").html('<span class="d-block d-md-none">' + result.expiring_products.length + ' <i class="fas fa-clock"></i></span><span class="d-none d-md-block">' + __n(result.expiring_products.length, '%s product expires', '%s products expiring') + ' ' + __n(nextXDays, 'within the next day', 'within the next %s days') + '</span>');
+			$("#info-expired-products").html('<span class="d-block d-md-none">' + result.expired_products.length + ' <i class="fas fa-times-circle"></i></span><span class="d-none d-md-block">' + __n(result.expired_products.length, '%s product is already expired', '%s products are already expired') + '</span>');
+			$("#info-missing-products").html('<span class="d-block d-md-none">' + result.missing_products.length + ' <i class="fas fa-exclamation-circle"></i></span><span class="d-none d-md-block">' + __n(result.missing_products.length, '%s product is below defined min. stock amount', '%s products are below defined min. stock amount') + '</span>');
 		},
 		function(xhr)
 		{
diff --git a/views/stockoverview.blade.php b/views/stockoverview.blade.php
old mode 100644
new mode 100755
index 75428490..ddd27f6e
--- a/views/stockoverview.blade.php
+++ b/views/stockoverview.blade.php
@@ -17,22 +17,27 @@
 <div class="row">
 	<div class="col">
 		<div class="title-related-links">
-			<h2 class="title">
+			<h2 class="title mr-2 order-0">
 				@yield('title')
+			</h2>
+			<h2 class="mb-0 mr-auto order-3 order-md-1 width-xs-sm-100">
 				<span id="info-current-stock"
 					class="text-muted small"></span>
 			</h2>
-			<div class="related-links">
-				<a class="btn btn-outline-dark responsive-button"
+			<button class="btn btn-outline-dark d-md-none mt-2 float-right order-1 order-md-3" type="button" data-toggle="collapse" data-target="#related-links">
+				<i class="fas fa-ellipsis-v"></i>
+			</button>
+			<div class="related-links collapse d-md-flex order-2 width-xs-sm-100" id="related-links">
+				<a class="btn btn-outline-dark responsive-button m-1 mt-md-0 mb-md-0 float-right"
 					href="{{ $U('/stockjournal') }}">
 					{{ $__t('Journal') }}
 				</a>
-				<a class="btn btn-outline-dark responsive-button"
+				<a class="btn btn-outline-dark responsive-button m-1 mt-md-0 mb-md-0 float-right"
 					href="{{ $U('/stockentries') }}">
 					{{ $__t('Stock entries') }}
 				</a>
 				@if(GROCY_FEATURE_FLAG_STOCK_LOCATION_TRACKING)
-				<a class="btn btn-outline-dark responsive-button"
+				<a class="btn btn-outline-dark responsive-button m-1 mt-md-0 mb-md-0 float-right"
 					href="{{ $U('/locationcontentsheet') }}">
 					{{ $__t('Location Content Sheet') }}
 				</a>
@@ -53,6 +58,13 @@
 				data-status-filter="belowminstockamount"
 				class="normal-message status-filter-message responsive-button"></div>
 			<div class="float-right">
+				<a
+					class="btn btn-sm btn-outline-info d-md-none"
+					data-toggle="collapse"
+					href="#table-filter-row"
+					role="button">
+					<i class="fas fa-filter"></i>
+				</a>
 				<a id="clear-filter-button"
 					class="btn btn-sm btn-outline-info"
 					href="#">
@@ -62,7 +74,7 @@
 		</div>
 	</div>
 </div>
-<div class="row">
+<div class="row collapse d-md-flex" id="table-filter-row">
 	<div class="col-xs-12 col-md-6 col-xl-3">
 		<div class="input-group">
 			<div class="input-group-prepend">