ads

www/content/_index.md

@@ -29,6 +29,22 @@ body.kawaii .dark-hero .uwu {
     display:block;
     padding-top: 24px;
 }
+
+body.ads .ad {
+  display: block;
+  text-align: center;
+  margin-left: calc(50% - 50vw);
+  margin-right: calc(50% - 50vw);
+}
+
+body.ads .ad a:hover {
+  opacity: 100%;
+}
+
+body .ad {
+  display: none;
+}
+
 </style>
 <script type="application/javascript">
 if(window.location.search=="?wuw=true" || window.location.search=="?suw=true") {
@@ -37,8 +53,17 @@ if(window.location.search=="?wuw=true" || window.location.search=="?suw=true") {
 if(window.location.search=="?uwu=true") {
   document.body.classList.add('kawaii');
 }
+if(window.location.search=="?ads=true") {
+  document.body.classList.add('ads');
+}
 </script>
 
+<div class="ad" style="margin-bottom: 30px">
+<a href="https://swag.htmx.org">
+  <img src="/img/ads_top.png"/>
+</a>
+</div>
+
 <div class="dark-hero full-width" classes="add appear">
   <div class="main">
       <span class="logo dark">&lt;<span class="blue">/</span>&gt; <span class="no-mobile">htm<span class="blue">x</span></span></span>
@@ -55,6 +80,11 @@ if(window.location.search=="?uwu=true") {
      </a>
   </div>
 </div>
+<div class="ad">
+<a href="https://swag.htmx.org">
+  <img src="/img/ads_bottom.png"/>
+</a>
+</div>
 
 <div style="border: 1px solid lightgrey; margin:24px;padding:12px;border-radius: 8px; background-color: whitesmoke; filter: drop-shadow(3px 3px darkgray)">
 <b>NEWS:</b> htmx finished 2nd in the <a href="https://risingstars.js.org/2023/en#section-framework">2023