Merge branch 'main' into feature/button-generator

assets/sass/pages/blog.scss

@@ -566,6 +566,10 @@
     border: 1px solid rgba(0, 255, 0, 0.3);
     border-radius: 4px;
 
+    &:before {
+      content: none;
+    }
+
     @include media-down(lg) {
       margin-top: 30px;
       padding: 15px;
@@ -586,6 +590,7 @@
       display: flex;
       flex-direction: column;
       gap: 15px;
+      color: greenyellow;
     }
 
     .contact-email,
@@ -593,6 +598,10 @@
       font-size: 0.95rem;
       line-height: 1.6;
 
+      a:hover {
+        color: cyan;
+      }
+
       @include media-down(lg) {
         font-size: 0.9rem;
       }
@@ -642,6 +651,10 @@
       text-shadow: 0 0 5px rgba(0, 255, 0, 0.5);
       border-radius: 3px;
 
+      &:hover {
+        color: cyan;
+      }
+
       @include media-down(lg) {
         font-size: 0.8rem;
         padding: 6px 12px;

assets/sass/pages/button-generator.scss

@@ -67,6 +67,16 @@
       0 0 20px rgba(0, 150, 255, 0.1),
       inset 0 0 40px rgba(0, 100, 200, 0.05);
 
+    @include media-down(md) {
+      background: linear-gradient(
+        135deg,
+        rgba(0, 100, 180, 1) 0%,
+        rgb(0, 29, 55) 100%
+      );
+      z-index: 90;
+    }
+    
+
     &::before {
       content: "";
       position: absolute;

assets/sass/pages/resources.scss

@@ -393,6 +393,10 @@
   display: grid;
   grid-template-columns: 1fr 1fr 1fr;
   gap: 1em;
+
+  @include media-down(md) {
+    grid-template-columns: 1fr;
+  }
 }
 
 .resource-pin a {
@@ -627,6 +631,11 @@
   overflow: visible;
   z-index: 10;
 
+  @include media-down(md) {
+    padding: 0;
+    padding-bottom: 2rem;
+  }
+
   // Subtle tech panel grid pattern
   &::before {
     content: "";
@@ -767,6 +776,12 @@
       //box-shadow: 0 0 10px rgba(255, 120, 0, 0.8);
     }
 
+    @include media-down(md) {
+      &::before, &::after {
+        content: none;
+      }
+    }
+
     @include media-up(md) {
       font-size: 3rem;
 

layouts/shortcodes/button-generator.html

@@ -1,7 +1,7 @@
 <div id="button-generator-app">
   <div class="generator-container">
     <div class="preview-section">
-      <h3>Preview</h3>
+      <h3 class="hidden-md-down">Preview</h3>
       <div class="preview-container">
         <div class="preview-wrapper">
           <canvas id="button-canvas" width="88" height="31"></canvas>
@@ -9,7 +9,7 @@
       </div>
       <button id="download-button" class="btn-primary">Download Button</button>
 
-      <div class="presets-container">
+      <div class="presets-container hidden-md-down">
         <h3>Presets</h3>
         <button id="preset-random" class="btn-secondary">Random Button</button>
         <button id="preset-classic" class="btn-secondary">Classic Style</button>