Improvements and style and wording.

5 files changed, 32 insertions, 20 deletions

diff --git a/public/img/cocktails_background.jpg b/public/img/cocktails_background.jpg
new file mode 100644
index 0000000..72172ca
--- /dev/null
+++ b/public/img/cocktails_background.jpg
diff --git a/public/img/whisky_and_book_dark.jpg b/public/img/whisky_and_book_dark.jpg
new file mode 100644
index 0000000..ccb8d7d
--- /dev/null
+++ b/public/img/whisky_and_book_dark.jpg
diff --git a/resources/views/fragments/angebote.blade.php b/resources/views/fragments/angebote.blade.php
index 20627d3..5db45e3 100644
--- a/resources/views/fragments/angebote.blade.php
+++ b/resources/views/fragments/angebote.blade.php
@@ -5,13 +5,13 @@
 		<div class="col-md-12 px-10" style="padding-left: 0; margin-bottom: 2rem;">
 			<div class="card-header">
 
-				<a style="color: inherit;" href="{{ route('angebote_index') }}" title="Suchmaschine für Spirituosenangebote">
 @if( Request::route()->getName() == "index")
+				<a style="color: inherit;" href="{{ route('angebote_index') }}" title="Suchmaschine für Spirituosenangebote">
 				<h2 id="angebote" class="card-title" style="margin-bottom: 1rem;">Topaktuelle Sonderangebote von Spirituosen</h2>
+				</a>
 @else
 				<h1 id="angebote" class="card-title" style="margin-bottom: 1rem;">Topaktuelle Sonderangebote von Spirituosen</h1>
 @endif
-				</a>
 				<p class="lead my-3">
 					Auf der Suche nach einem Gin, Whisky oder vielleicht einem guten Champagner?
 					<br>
diff --git a/resources/views/fragments/cocktails.blade.php b/resources/views/fragments/cocktails.blade.php
index 6cde5b7..b277f1c 100644
--- a/resources/views/fragments/cocktails.blade.php
+++ b/resources/views/fragments/cocktails.blade.php
@@ -4,23 +4,26 @@
 		<div class="col-md-12 px-10" style="padding-left: 0; margin-bottom: 2rem">
 			<div class="card-header" style="border-bottom: 0">
 
-				<a style="color: inherit;" href="{{ route('cocktail_index') }}" title="Suchmaschine für Cocktails">
 @if( Request::route()->getName() == "index")
-				<h2 id="cocktails" class="card-title">Cocktaildatenbank</h2>
+				<a style="color: inherit;" href="{{ route('cocktail_index') }}" title="Suchmaschine für Cocktails">
+					<h2 id="cocktails" class="card-title">Cocktaildatenbank</h2>
+				</a>
 @else
-				<h1 id="cocktails" class="card-title">Cocktailsuche</h1>
+				<!--h1 id="cocktails" class="card-title">Cocktailsuche</h1-->
+				<h1 class="dp-none">Cocktailsuche nach Zutaten in über {{ $cocktail_count }} Cocktails</h1>
+				<h1 class="dp-none-invert">Cocktailsuche</h1>
 @endif
-				</a>
 			</div>
 			<div class="card-block card-body px-3" style="padding-left: 0; padding-right: 0">
 				<div class="row">
-				<div class="col-md-6 offer-index">
-					<img wwidth=280 hheight=400 src="https://www.fuselkoenig.de/wp-content/uploads/sites/6/2022/01/MaiTai2.jpg" class="card-img img-fluid mx-auto d-block" loading="lazy">
-				</div>
-				<div class="col-md-6 offer-index">
-					<p>
-					 Suche nach deinen gewünschten Zutaten in über {{ $cocktail_count }} Cocktails.
-					</p>
+				<!--div class="col-md-12 offer-index">
+					<!--img wwidth=280 hheight=400 src="https://www.fuselkoenig.de/wp-content/uploads/sites/6/2022/01/MaiTai2.jpg" class="card-img img-fluid mx-auto d-block" loading="lazy"-->
+					<!--img wwidth=280 hheight=400 src="{{ asset('img/cocktails_background.jpg') }}" class="card-img img-fluid mx-auto d-block" loading="lazy">
+				</div-->
+				<div class="col-md-12 offer-index">
+					<!--p>
+					 Cocktailsuche nach Zutaten in über {{ $cocktail_count }} Cocktails.
+					</p-->
 
 
 					<form class="form-search" id="form-search" action="{{ route('cocktail_search') }}">
@@ -28,7 +31,7 @@
 					    <label for=""></label>
 					    <p><strong>Zutat:</strong></p>
 					    <div id="cocktail_search_form_field" class="cocktail_search_field">
-					    <input type="text" class="form-control" id=ingredient_search name="i[]" iid="front_search_form" aria-describedby="suchform-help" placeholder="Hier nach der gewünschten Zutat suchen..." required>
+					    <input type="text" class="form-control" id=ingredient_search name="i[]" iid="front_search_form" aria-describedby="suchform-help" placeholder="Suche z.B. nach Scotch, Cognac, Williams…" required>
 					    </div>
 					    <br>
 					    <p><strong>Ignoriere (optional):</strong></p>
@@ -38,9 +41,9 @@
 					    <br>
 					    <p id="front_search_help" class="form-text"><strong>Tipp:</strong> Du kannst Zutaten verodern. "Jamaika oder Jamaica" findet beide Schreibweisen. Oder auch: "Peat oder Torf oder Islay" um rauchigen Whisky zu finden.</p>
 					  </div>
-					  <button class="btn btn-primary" type="button" onclick="addField()">Zutat hinzufügen</button>
-					  <button class="btn btn-primary" type="button" onclick="addFieldExclude()">Ausnahme hinzufügen</button>
-					  <button type="submit" class="btn btn-secondary">Suchen</button>
+					  <button class="btn btn-primary btn-small-p" type="button" onclick="addField()">Zutat hinzufügen</button>
+					  <button class="btn btn-primary btn-small-p" type="button" onclick="addFieldExclude()">Ausnahme hinzufügen</button>
+					  <button type="submit" class="btn btn-secondary btn-small-p">Suchen</button>
 					</form>
 				</div>
 				</div>
@@ -52,16 +55,16 @@
 						<strong>Ja, noch eine.</strong> Ich weiß, es gibt unzählige Webseiten da draußen, die Rezepte sammeln. Aber sind wir mal ehrlich, die meisten Rezepte sind nicht gut.
 					</p>
 					<p class="lead my-3">
-						In meinem Leben bin ich an einem Stadium angelangt, an dem Blauer Curaçao mit Orangensaft für mich kein Cocktail mehr ist. Zumindest keiner, der es wert ist verewigt zu werden.
+						In meinem Leben bin ich an einem Stadium angelangt, an dem Blauer Curaçao mit Orangensaft für mich kein Cocktail (mehr…) ist. Zumindest keiner, der es wert ist verewigt zu werden.
 					</p>
 					<p class="lead my-3">
 						Ich besitze sehr viele Cocktailbücher, die schöne Rezepte auflisten. Das Problem an Büchern und den meisten Webseiten ist, man kann schlecht darin suchen. Eine Sortierung nach Namen von Cocktails ist nicht sinnvoll. Wenn ich wissen will, wie ein Manhattan geht, dann benutze ich eine Suchmaschine meiner Wahl, kein Buch.
 					</p>
 					<p class="lead my-3">
-						Diese Datenbank fokussiert auf Zutaten. Ich frage mich oft so Sachen wie: <em>"Kann man eigentlich Kirschwasser und Gin mixen? Wermut und Eiweiß? Was kommt da raus?"</em>
+						Diese Datenbank fokussiert auf Zutaten. Ich frage mich oft so Sachen wie: <em>"Kann man eigentlich Kirschwasser und Gin mixen? Wermut und Eiweiß?"</em>
 					</p>
 					<p class="lead my-3">
-						Ein sehr geschätzter Bloggerkollege Helmut Barro von <a href="https://schlimmerdurst.net/2016/06/27/cocktailrezepte-auf-einen-blick/" rel="nofollow">schlimmerdurst.net</a> hat eine unfassbar gute Sammlung von Cocktailrezepten angelegt. Diese Seite ist erstmal "nur" eine Suchmaschine für seine Sammlung. Alle Credits gehen an ihn.
+						Ein sehr geschätzter Bloggerkollege Helmut Barro von <a href="https://schlimmerdurst.net/2016/06/27/cocktailrezepte-auf-einen-blick/" rel="nofollow">schlimmerdurst.net</a> hat eine unfassbar gute Sammlung von Cocktailrezepten angelegt. Diese Seite ist erstmal "nur" eine Suchmaschine für seine Sammlung.
 					</p>
 				</div>
 			</div>
diff --git a/resources/views/layouts/base.blade.php b/resources/views/layouts/base.blade.php
index 50b6a2f..7130621 100644
--- a/resources/views/layouts/base.blade.php
+++ b/resources/views/layouts/base.blade.php
@@ -30,8 +30,14 @@
 	<style>
 	p { font-size: 18px; }
 	.main-header {
+/*
 		background-image: url("/img/angebote_background.jpg");
+		background-image: url("/img/cocktails_background.jpg");
 		background-image: url("https://www.fuselkoenig.de/wp-content/themes/fuselkoenig_de_v2/img/background_mini_farbig.jpg");
+*/
+		background-color: #111;
+		background-position: center;
+		background-image: url("/img/whisky_and_book_dark.jpg");
 	}
 	.ttaxonomy-card {
 		box-shadow: inherit !important;
@@ -40,6 +46,9 @@
 		.dp-none {
 			display:none !important
 		}
+		.btn-small-p {
+			margin-bottom: 5px;
+		}
 	}
 	@media (min-width:769px) {
 		.dp-none-invert {