chore: test ads

Author: meroxdotdev

_includes/ads-panel.html

@@ -0,0 +1,13 @@
+<section class="ads-panel">
+  <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-2989869646477878" crossorigin="anonymous"></script>
+  <!-- merox.dev ads section -->
+  <ins class="adsbygoogle"
+       style="display:block"
+       data-ad-client="ca-pub-2989869646477878"
+       data-ad-slot="3183113175"
+       data-ad-format="auto"
+       data-full-width-responsive="true"></ins>
+  <script>
+       (adsbygoogle = window.adsbygoogle || []).push({});
+  </script>
+</section>

_layouts/post.html

@@ -3,6 +3,7 @@
 refactor: true
 panel_includes:
   - toc
+  - ads-panel
 tail_includes:
   - related-posts
   - post-nav
@@ -176,19 +177,4 @@ <h1 data-toc-skip>{{ page.title }}</h1>
     <!-- .post-tail-bottom -->
   </div>
   <!-- div.post-tail-wrapper -->
-
-  <!-- Google Ads -->
-  <div class="ads-section mt-4">
-    <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-2989869646477878" crossorigin="anonymous"></script>
-    <!-- merox.dev ads section -->
-    <ins class="adsbygoogle"
-         style="display:block"
-         data-ad-client="ca-pub-2989869646477878"
-         data-ad-slot="3183113175"
-         data-ad-format="auto"
-         data-full-width-responsive="true"></ins>
-    <script>
-         (adsbygoogle = window.adsbygoogle || []).push({});
-    </script>
-  </div>
 </article>

_sass/layout/_panel.scss

@@ -20,6 +20,19 @@
     &:not(:first-child) {
       margin-top: 4rem;
     }
+
+    &.ads-panel {
+      padding: 1rem;
+      text-align: center;
+      background-color: var(--panel-bg, #ffffff);
+      border-radius: 0.25rem;
+
+      .adsbygoogle {
+        max-width: 100%;
+        width: 100%;
+        overflow: hidden;
+      }
+    }
   }
 
   .content {
@@ -67,22 +80,4 @@
 
     @extend %no-bottom-border;
   }
-}
-
-/* 🔥 Stil personalizat pentru reclamele AdSense */
-.ads-section {
-  margin-top: 2rem;
-  padding: 1rem;
-  background-color: var(--main-bg);
-  border: 1px solid var(--border-color);
-  border-radius: 0.75rem;
-  box-shadow: 0 0.25rem 0.75rem rgb(0 0 0 / 5%);
-  text-align: center;
-
-  ins.adsbygoogle {
-    display: block !important;
-    margin: auto;
-    min-height: 100px;
-    width: 100%;
-  }
 }