Add subnet guide, layout, nav and embed

1 files changed, 0 insertions, 117 deletions

diff --git a/src/pages/cidr-calculator-subnet-guide.astro b/src/pages/cidr-calculator-subnet-guide.astro
deleted file mode 100644
index 3f2c4d1..0000000
--- a/src/pages/cidr-calculator-subnet-guide.astro
+++ /dev/null
@@ -1,117 +0,0 @@
----
-import Layout from "../layouts/Layout.astro";
-import Cidr from "../components/Cidr";
-import { faqs } from "../content/faqs.ts";
-import Prose from "../components/Prose.astro";
-
-// ────────────────────────────────────────────────────────────
-// Metadata
-// ────────────────────────────────────────────────────────────
-const title = "CIDR Calculator & Subnet Guide — IP Ranges, Masks & IPv6";
-const description =
-    "Free interactive CIDR calculator and comprehensive plain‑language guide covering subnetting, IP ranges, subnet masks and IPv6 addressing.";
-
-// FAQ structured‑data (kept in sync with UI)
-const faqJsonLd = {
-    "@context": "https://schema.org",
-    "@type": "FAQPage",
-    mainEntity: faqs.map(({ q, a }) => ({
-        "@type": "Question",
-        name: q,
-        acceptedAnswer: { "@type": "Answer", text: a },
-    })),
-};
-
-import { Content as GuideContent } from "../content/cidr-guide.md";
----
-
-<Layout title={title} description={description}>
-    <header>
-        <a href="/" class="group flex items-center text-blue-600 transition-all duration-300 hover:text-blue-800">
-            <svg xmlns="http://www.w3.org/2000/svg" class="h-4 w-4 mr-1 transform transition-transform duration-300 group-hover:-translate-x-1" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-                <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M10 19l-7-7m0 0l7-7m-7 7h18" />
-            </svg>
-            <span class="hover:underline">Back Home</span>
-        </a>
-        <div class="mx-auto max-w-7xl px-4 py-2 sm:py-4 lg:px-6 text-center">
-            <h1
-                class="text-4xl font-extrabold tracking-tight text-gray-900 sm:text-6xl"
-            >
-                CIDR Calculator &amp; Subnet Guide
-            </h1>
-            <p class="mt-4 text-lg sm:text-xl max-w-2xl mx-auto text-gray-700">
-                Convert CIDR blocks to IP ranges and master subnetting for IPv4
-                &amp; IPv6 — in one streamlined resource.
-            </p>
-        </div>
-    </header>
-
-    <section>
-        <Cidr client:load />
-    </section>
-
-    <nav
-        aria-label="Page sections"
-        class="hidden sm:block sticky top-0 z-10 pt-1 my-6 border-0 sm:border border-gray-300 rounded-lg bg-white/70 shadow-md"
-    >
-        <div class="mx-auto max-w-4xl px-4">
-            <ul
-                class="flex flex-wrap justify-center gap-8 py-3 text-base font-medium text-gray-700"
-            >
-                <li>
-                    <a
-                        href="#what-is-cidr"
-                        class="px-3 py-2 rounded-md hover:bg-blue-50 hover:text-blue-700 transition-colors duration-200"
-                        >What is CIDR?</a
-                    >
-                </li>
-                <li>
-                    <a
-                        href="#cidr-to-ip"
-                        class="px-3 py-2 rounded-md hover:bg-blue-50 hover:text-blue-700 transition-colors duration-200"
-                        >CIDR → IP range</a
-                    >
-                </li>
-                <li>
-                    <a
-                        href="#subnetting-tutorial"
-                        class="px-3 py-2 rounded-md hover:bg-blue-50 hover:text-blue-700 transition-colors duration-200"
-                        >Subnetting tutorial</a
-                    >
-                </li>
-                <li>
-                    <a
-                        href="#ipv6"
-                        class="px-3 py-2 rounded-md hover:bg-blue-50 hover:text-blue-700 transition-colors duration-200"
-                        >IPv6 basics</a
-                    >
-                </li>
-                <li>
-                    <a
-                        href="#faq"
-                        class="px-3 py-2 rounded-md hover:bg-blue-50 hover:text-blue-700 transition-colors duration-200"
-                        >FAQ</a
-                    >
-                </li>
-                <li>
-                    <a
-                        href="#resources"
-                        class="px-3 py-2 rounded-md hover:bg-blue-50 hover:text-blue-700 transition-colors duration-200"
-                        >Resources</a
-                    >
-                </li>
-            </ul>
-        </div>
-    </nav>
-
-    <Prose>
-        <GuideContent />
-    </Prose>
-
-    {/** Structured‑data block */}
-    <script
-        type="application/ld+json"
-        is:inline
-        set:html={JSON.stringify(faqJsonLd, null, 2)}
-    />
-</Layout>