fix: move SEO text blocks below ad banner on generator pages

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/pages/generators/cards.astro

@@ -55,6 +55,10 @@ const generator = generators.find((g) => g.slug === 'cards')!;
       <CardGenerator />
     </main>
 
+    <div class="mt-12 flex justify-center">
+      <AdBanner size="tile" />
+    </div>
+
     <SeoBlock
       howTo={[
         'Set how many cards to draw (1–52).',
@@ -69,9 +73,5 @@ const generator = generators.find((g) => g.slug === 'cards')!;
         'Running fair draws without a physical deck.',
       ]}
     />
-
-    <div class="mt-12 flex justify-center">
-      <AdBanner size="tile" />
-    </div>
   </div>
 </BaseLayout>

src/pages/generators/coin.astro

@@ -34,6 +34,10 @@ const generator = generators.find((g) => g.slug === 'coin')!;
       <p class="mt-2 text-base text-zinc-400">{generator.description}</p>
     </header>
     <main><CoinGenerator /></main>
+    <div class="mt-12 flex justify-center">
+      <AdBanner size="tile" />
+    </div>
+
     <SeoBlock
       howTo={[
         'Drag the slider to choose how many coins to flip (1–20).',
@@ -48,9 +52,5 @@ const generator = generators.find((g) => g.slug === 'coin')!;
         'Settling a fair 50/50 choice between two options.',
       ]}
     />
-
-    <div class="mt-12 flex justify-center">
-      <AdBanner size="tile" />
-    </div>
   </div>
 </BaseLayout>

src/pages/generators/colors.astro

@@ -55,6 +55,10 @@ const generator = generators.find((g) => g.slug === 'colors')!;
       <ColorGenerator />
     </main>
 
+    <div class="mt-12 flex justify-center">
+      <AdBanner size="tile" />
+    </div>
+
     <SeoBlock
       howTo={[
         'Click Generate to produce a random color.',
@@ -68,9 +72,5 @@ const generator = generators.find((g) => g.slug === 'colors')!;
         'Teaching or exploring color theory and formats.',
       ]}
     />
-
-    <div class="mt-12 flex justify-center">
-      <AdBanner size="tile" />
-    </div>
   </div>
 </BaseLayout>

src/pages/generators/dice.astro

@@ -55,6 +55,10 @@ const generator = generators.find((g) => g.slug === 'dice')!;
       <DiceGenerator />
     </main>
 
+    <div class="mt-12 flex justify-center">
+      <AdBanner size="tile" />
+    </div>
+
     <SeoBlock
       howTo={[
         'Select the die type: d4, d6, d8, d10, d12, d20, or d100.',
@@ -69,9 +73,5 @@ const generator = generators.find((g) => g.slug === 'dice')!;
         'Settling disputes with a fair digital dice roll.',
       ]}
     />
-
-    <div class="mt-12 flex justify-center">
-      <AdBanner size="tile" />
-    </div>
   </div>
 </BaseLayout>

src/pages/generators/list.astro

@@ -34,6 +34,10 @@ const generator = generators.find((g) => g.slug === 'list')!;
       <p class="mt-2 text-base text-zinc-400">{generator.description}</p>
     </header>
     <main><ListGenerator /></main>
+    <div class="mt-12 flex justify-center">
+      <AdBanner size="tile" />
+    </div>
+
     <SeoBlock
       howTo={[
         'Type or paste your items into the text area — one item per line.',
@@ -48,9 +52,5 @@ const generator = generators.find((g) => g.slug === 'list')!;
         'Selecting a random movie, restaurant, or activity from a list.',
       ]}
     />
-
-    <div class="mt-12 flex justify-center">
-      <AdBanner size="tile" />
-    </div>
   </div>
 </BaseLayout>

src/pages/generators/lottery.astro

@@ -55,6 +55,10 @@ const generator = generators.find((g) => g.slug === 'lottery')!;
       <LotteryGenerator />
     </main>
 
+    <div class="mt-12 flex justify-center">
+      <AdBanner size="tile" />
+    </div>
+
     <SeoBlock
       howTo={[
         'Set the From and To fields to define your number range (e.g. 1 to 49).',
@@ -69,9 +73,5 @@ const generator = generators.find((g) => g.slug === 'lottery')!;
         'Choosing lottery numbers for Powerball, EuroMillions, or local draws.',
       ]}
     />
-
-    <div class="mt-12 flex justify-center">
-      <AdBanner size="tile" />
-    </div>
   </div>
 </BaseLayout>

src/pages/generators/numbers.astro

@@ -55,6 +55,10 @@ const generator = generators.find((g) => g.slug === 'numbers')!;
       <NumberGenerator />
     </main>
 
+    <div class="mt-12 flex justify-center">
+      <AdBanner size="tile" />
+    </div>
+
     <SeoBlock
       howTo={[
         'Enter the minimum value in the From field.',
@@ -69,9 +73,5 @@ const generator = generators.find((g) => g.slug === 'numbers')!;
         'Generating test data with values in a specific range.',
       ]}
     />
-
-    <div class="mt-12 flex justify-center">
-      <AdBanner size="tile" />
-    </div>
   </div>
 </BaseLayout>

src/pages/generators/password.astro

@@ -55,6 +55,10 @@ const generator = generators.find((g) => g.slug === 'password')!;
       <PasswordGenerator />
     </main>
 
+    <div class="mt-12 flex justify-center">
+      <AdBanner size="tile" />
+    </div>
+
     <SeoBlock
       howTo={[
         'Drag the length slider to set how many characters you need (4–64).',
@@ -69,9 +73,5 @@ const generator = generators.find((g) => g.slug === 'password')!;
         'Replacing a weak or reused password.',
       ]}
     />
-
-    <div class="mt-12 flex justify-center">
-      <AdBanner size="tile" />
-    </div>
   </div>
 </BaseLayout>

src/pages/generators/uuid.astro

@@ -34,6 +34,10 @@ const generator = generators.find((g) => g.slug === 'uuid')!;
       <p class="mt-2 text-base text-zinc-400">{generator.description}</p>
     </header>
     <main><UuidGenerator /></main>
+    <div class="mt-12 flex justify-center">
+      <AdBanner size="tile" />
+    </div>
+
     <SeoBlock
       howTo={[
         'Choose a token type: UUID v4, Hex, or Base64.',
@@ -48,9 +52,5 @@ const generator = generators.find((g) => g.slug === 'uuid')!;
         'Generating a one-time secret for environment variables or config files.',
       ]}
     />
-
-    <div class="mt-12 flex justify-center">
-      <AdBanner size="tile" />
-    </div>
   </div>
 </BaseLayout>