From e1d6da89ad97c1e08406bbf799b5c85ac811e2da Mon Sep 17 00:00:00 2001
From: "Christopher C. Wells" <git@chris-wells.net>
Date: Sat, 13 Mar 2021 04:44:48 -0800
Subject: [PATCH] Adjust recipe background behavior for small screens

---
 resources/views/layouts/app.blade.php | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/resources/views/layouts/app.blade.php b/resources/views/layouts/app.blade.php
index 1ca101f..6dade9c 100644
--- a/resources/views/layouts/app.blade.php
+++ b/resources/views/layouts/app.blade.php
@@ -35,7 +35,7 @@
 
         <!-- Page Content -->
         @isset($bg_image)
-            <main class="bg-cover bg-no-repeat bg-top bg-fixed bg-clip-border" style="background-image: url('{{ $bg_image }}')">
+            <main class="bg-contain bg-no-repeat bg-top bg-clip-border sm:bg-cover sm:bg-fixed" style="background-image: url('{{ $bg_image }}')">
         @else
             <main>
         @endisset
@@ -55,8 +55,8 @@
                 </div>
             @endif
 
-            <div class="{{ isset($bg_image) ? 'pt-64 md:pt-32' : 'pt-6' }} max-w-7xl mx-auto sm:px-6 lg:px-8">
-                <div class="bg-white {{ isset($bg_image) ? 'bg-opacity-95' : '' }} overflow-hidden shadow-sm sm:rounded-lg">
+            <div class="{{ isset($bg_image) ? 'pt-32' : 'pt-6' }} max-w-7xl mx-auto sm:px-6 lg:px-8">
+                <div class="bg-white {{ isset($bg_image) ? 'sm:bg-opacity-95' : '' }} overflow-hidden shadow-sm sm:rounded-lg">
                     <article class="p-6 border-b border-gray-200">
                         {{ $slot }}
                     </article>