From 192581bd55924b97ac14f270e408f1faeb856da8 Mon Sep 17 00:00:00 2001
From: horus
Date: Sat, 10 Feb 2018 04:02:37 +0100
Subject: Improves mobile layout.

---
 site/resources/views/offer.blade.php | 30 ++++++++++++++++++++++--------
 1 file changed, 22 insertions(+), 8 deletions(-)

(limited to 'site/resources/views/offer.blade.php')

diff --git a/site/resources/views/offer.blade.php b/site/resources/views/offer.blade.php
index f17c39e..54e4e75 100644
--- a/site/resources/views/offer.blade.php
+++ b/site/resources/views/offer.blade.php
@@ -10,6 +10,8 @@
         </div>
       </div>
 
+<div class="row mb-2">
+</div>
 <?php 
 
 $count = 0;
@@ -28,13 +30,13 @@ foreach( $data as $offer) {
 
 			<!-- >= md -->
 			<div class="card-body d-none d-md-flex flex-row align-items-start">
-				<div class="card-img-overlay">
-					<p class="card-text bg-danger float-right rounded" style="color: white; font-size: 150%; padding-right: 10px; padding-left:10px; opacity: 0.9;">{{ $offer->procent}}%</p>
+				<div class="card-img-overlay" title="{{$offer->name}} :: {{ $offer->shop }}">
+					<p class="card-text bg-danger float-right rounded off-badge">{{ $offer->procent}}%</p>
 				</div>
 				<div class="card-img-overlay w-55">
 					<div class="d-inline align-items-start text-left w-100 mb-2">
 						<strong class="text-primary">{{ $offer->spirit_type }}</strong>
-						<a class="text-muted float-right" href="{{ $offer->shop_url }}">{{ $offer->shop }}</a>
+						<a class="text-dark float-right" href="{{ $offer->shop_url }}">{{ $offer->shop }}</a>
 					</div>
 
 					<h4 class="mb-0 hide-overflow h-45">
@@ -56,17 +58,26 @@ foreach( $data as $offer) {
 			<img class="card-img-right flex-auto d-none d-md-block img-thumbnail" src="{{ $offer->image_url }}" alt="{{ $offer->name }}" title="{{$offer->name}} :: {{ $offer->shop }}">
 
 			<!-- <= sm -->
-			<img class="card-img-top flex-auto d-sm-block img-thumbnail d-md-none" src="{{ $offer->image_url }}" alt="{{ $offer->name }}" title="{{$offer->name}} :: {{ $offer->shop }}" style="opacity: 0.7; filter: grayscale(100%);">
+			<!-- Maybe make the image a link
+				<a href="{{ $offer->url}}">
+				</a>
+			-->
+			<img class="card-img-top flex-auto d-sm-block img-thumbnail d-md-none" src="{{ $offer->image_url }}" alt="{{ $offer->name }}" title="{{$offer->name}} :: {{ $offer->shop }}">
 			<div class="card-body .d-md-none d-lg-none d-xl-none d-xs-flex flex-column align-items-start">
+<!--
 				<div class="h-100 card-img-overlay">
 					<p class="card-text bg-danger float-right rounded" style="color: white; font-size: 150%; padding-right: 10px; padding-left:10px; opacity: 0.9;">{{ $offer->procent}}%</p>
 				</div>
-				<div class="flex-column card-img-overlay bg-dark-opacity" sstyle="top: 350px">
+-->
+				<div class="flex-column bg-dark-opacity" >
 					<div class="d-inline align-items-start text-left w-100 mb-2">
+						<p class="card-text bg-danger rounded off-badge text-center" title="{{$offer->name}} :: {{ $offer->shop }}"><strong>{{ $offer->procent}}%</strong> gesenkt</p>
+						<a class="text-dark float-right text-dotted" href="{{ $offer->shop_url }}">{{ $offer->shop }}</a>
+					</div>
+					<div class="d-block align-items-start text-left w-100 mb-2">
 						<strong class="text-primary">{{ $offer->spirit_type }}</strong>
-						<a class="text-dark" href="{{ $offer->shop_url }}">{{ $offer->shop }}</a>
 					</div>
-					<h3 class="mb-0 d-inline-block hide-overflow">
+					<h3 class="mb-0 d-inline-block hide-overflow h-100">
 					<a class="text-dark ttext-truncate" href="#{{ $offer->name }}" title="{{$offer->name}}" >{{ $offer->name }}</a>
 					</h3>
 
@@ -77,7 +88,10 @@ foreach( $data as $offer) {
 					<p class="card-text mb-auto text-success w-100"><del class="text-danger">{{ TF::fF($offer->original_price) . "€" }}</del> <strong class="ffloat-right">{{ TF::fF($offer->discounted_price) . "€" }}</strong>
 					<span class="float-right text-muted">{{ TF::fF($offer->base_price ) }}€/L</span>
 					</p>
-					<a href="{{ $offer->url }}">Jetzt bestellen</a>
+					<strong><a href="{{ $offer->url }}" class="text-large">Jetzt bestellen</a></strong>
+					<p class="text-muted text-small w-100 nmt-10">
+						Versand: {{ TF::fF($offer->shipping_costs) }}€ <span class=" float-right">Gratis ab {{ $offer->free_shipping }}</span>
+					</p>
 				</div>
 			</div>
 		</div>
-- 
cgit v1.2.3