modifiche grafiche ads footer

public/css/style.css

@@ -6715,10 +6715,48 @@ ul.demo-list li a i {
 
 }
 
-#footer_adv
-{
-  position: fixed; 
+#footer_adv {
+  position: fixed;
   bottom:0%;
-  
   opacity: 1;
+  z-index: 9999;
+  max-width: 1030px;
+  width: 100%;
+  background: white;
+  padding: 10px;
+  border-radius: 10px 0 0 0;
+  box-shadow: rgba(0, 0, 0, 0.15) 0 -1.95px 2.6px;
+}
+
+#footer_adv:not(.hidden) ~ footer {
+  --footer_adv-height: 100px;
+  margin-bottom: var(--footer_adv-height);
+}
+
+#footer_adv.hidden {
+  visibility: hidden;
+  opacity: 0;
+  position: none;
+}
+
+#footer_adv .advertisement {
+  margin: 0;
+  padding: 0;
+}
+
+#footer_adv > a {
+  position: absolute;
+  top: -20px;
+  right: 0;
+  background: white;
+  width: 20px;
+  height: 20px;
+  box-shadow: rgba(0, 0, 0, 0.15) 0 -1.95px 2.6px;
+  display: flex;
+  flex-direction: row;
+  flex-wrap: nowrap;
+  align-content: center;
+  justify-content: center;
+  align-items: center;
+  border-radius: 5px 5px 0 0;
 }

resources/views/layouts/footer.blade.php

@@ -7,7 +7,7 @@
                 @endphp
                 @if (isset($home->footer_image) && $home->footer_image != '')
                     <div class="item {{ $count == 0 ? 'active' : '' }}">
-                        <a href="{{ $home->footer_url }}"><img src="/files/{{ $home->footer_image }}" width="300" alt="" style="border:1px solid gray;"></a>
+                        <a href="{{ $home->footer_url }}"><img src="/files/{{ $home->footer_image }}" alt="" style="border:1px solid gray;"></a>
                     </div>
                     @php
                         $count += 1;
@@ -15,7 +15,7 @@
                 @endif
                 @if (isset($home->footer_image_2) && $home->footer_image_2 != '')
                     <div class="item {{ $count == 0 ? 'active' : '' }}">
-                        <a href="{{ $home->footer_url_2 }}"><img src="/files/{{ $home->footer_image_2 }}" width="300" alt="" style="border:1px solid gray;"></a>
+                        <a href="{{ $home->footer_url_2 }}"><img src="/files/{{ $home->footer_image_2 }}" alt="" style="border:1px solid gray;"></a>
                     </div>
                     @php
                         $count += 1;
@@ -23,7 +23,7 @@
                 @endif
                 @if (isset($home->footer_image_3) && $home->footer_image_3 != '')
                     <div class="item {{ $count == 0 ? 'active' : '' }}">
-                        <a href="{{ $home->footer_url_3 }}"><img src="/files/{{ $home->footer_image_3 }}" width="300" alt="" style="border:1px solid gray;"></a>
+                        <a href="{{ $home->footer_url_3 }}"><img src="/files/{{ $home->footer_image_3 }}" alt="" style="border:1px solid gray;"></a>
                     </div>
                     @php
                         $count += 1;
@@ -35,9 +35,26 @@
     @endif
 </div>
 <script>
+    document.addEventListener("DOMContentLoaded", updateFooterAdvHeight);
+    window.addEventListener("load", updateFooterAdvHeight);
+    window.addEventListener("resize", updateFooterAdvHeight);
+
+    let footer_adv;
+    let footer;
+
+    function updateFooterAdvHeight() {
+        footer_adv = document.getElementById("footer_adv");
+        footer = document.querySelector("footer");
+        
+        if (typeof footer_adv !== "undefined" && typeof footer !== "undefined") {
+            let height = footer_adv.getBoundingClientRect().height;
+            footer.style.setProperty("--footer_adv-height", `${height}px`);
+        }
+    }
+
     function hideFooterAdv()
     {
-        document.getElementById('footer_adv').style.visibility = 'hidden';
+        document.getElementById('footer_adv').classList.add("hidden");
     }
 </script>
 <!-- footer

resources/views/page.blade.php

@@ -164,7 +164,7 @@
                 @endphp
                 @if (isset($home->footer_image) && $home->footer_image != '')
                     <div class="item {{ $count == 0 ? 'active' : '' }}">
-                        <a href="{{ $home->footer_url }}"><img src="/files/{{ $home->footer_image }}" width="300" alt="" style="border:1px solid gray;"></a>
+                        <a href="{{ $home->footer_url }}"><img src="/files/{{ $home->footer_image }}" alt="" style="border:1px solid gray;"></a>
                     </div>
                     @php
                         $count += 1;
@@ -172,7 +172,7 @@
                 @endif
                 @if (isset($home->footer_image_2) && $home->footer_image_2 != '')
                     <div class="item {{ $count == 0 ? 'active' : '' }}">
-                        <a href="{{ $home->footer_url_2 }}"><img src="/files/{{ $home->footer_image_2 }}" width="300" alt="" style="border:1px solid gray;"></a>
+                        <a href="{{ $home->footer_url_2 }}"><img src="/files/{{ $home->footer_image_2 }}" alt="" style="border:1px solid gray;"></a>
                     </div>
                     @php
                         $count += 1;
@@ -180,7 +180,7 @@
                 @endif
                 @if (isset($home->footer_image_3) && $home->footer_image_3 != '')
                     <div class="item {{ $count == 0 ? 'active' : '' }}">
-                        <a href="{{ $home->footer_url_3 }}"><img src="/files/{{ $home->footer_image_3 }}" width="300" alt="" style="border:1px solid gray;"></a>
+                        <a href="{{ $home->footer_url_3 }}"><img src="/files/{{ $home->footer_image_3 }}" alt="" style="border:1px solid gray;"></a>
                     </div>
                     @php
                         $count += 1;
@@ -192,9 +192,26 @@
     @endif
 </div>
 <script>
+    document.addEventListener("DOMContentLoaded", updateFooterAdvHeight);
+    window.addEventListener("load", updateFooterAdvHeight);
+    window.addEventListener("resize", updateFooterAdvHeight);
+
+    let footer_adv;
+    let footer;
+
+    function updateFooterAdvHeight() {
+        footer_adv = document.getElementById("footer_adv");
+        footer = document.querySelector("footer");
+        
+        if (typeof footer_adv !== "undefined" && typeof footer !== "undefined") {
+            let height = footer_adv.getBoundingClientRect().height;
+            footer.style.setProperty("--footer_adv-height", `${height}px`);
+        }
+    }
+
     function hideFooterAdv()
     {
-        document.getElementById('footer_adv').style.visibility = 'hidden';
+        document.getElementById('footer_adv').classList.add("hidden");
     }
 </script>