feat(website): alpha-2 testnet docs

packages/website/components/AddEthereumChainButton.tsx

@@ -17,15 +17,15 @@ async function addEthereumChain() {
   }
 
   const taikoParams: AddEthereumChainParameter = {
-    chainId: "0x28C5A",
-    chainName: "Taiko Hackathon Testnet",
+    chainId: "0x28C5C",
+    chainName: "Taiko (Alpha-2 Testnet)",
     nativeCurrency: {
       name: "ETH",
       symbol: "eth",
       decimals: 18,
     },
-    rpcUrls: ["https://l2rpc.hackathon.taiko.xyz"],
-    blockExplorerUrls: ["https://l2explorer.hackathon.taiko.xyz/"],
+    rpcUrls: ["https://rpc.a2.taiko.xyz"],
+    blockExplorerUrls: ["https://explorer.a2.taiko.xyz/"],
     iconUrls: [],
   };
 
@@ -39,7 +39,7 @@ export default function AddEthereumChainButton(props: Props) {
   return (
     <div
       onClick={() => addEthereumChain()}
-      className="hover:cursor-pointer text-neutral-900 bg-white hover:bg-neutral-100 border-solid border-neutral-200 focus:ring-4 focus:outline-none focus:ring-neutral-100 font-medium rounded-lg text-sm px-3 py-2 text-center inline-flex items-center dark:focus:ring-neutral-600 dark:bg-neutral-800 dark:border-neutral-700 dark:text-white dark:hover:bg-neutral-700"
+      className="hover:cursor-pointer text-neutral-900 bg-neutral-100 hover:bg-neutral-200 border-solid border-neutral-200 focus:ring-4 focus:outline-none focus:ring-neutral-100 font-medium rounded-lg text-sm px-3 py-2 text-center inline-flex items-center dark:focus:ring-neutral-600 dark:bg-neutral-800 dark:border-neutral-700 dark:text-white dark:hover:bg-neutral-700"
     >
       {props.buttonText}
     </div>

packages/website/components/CareerSection.tsx

@@ -3,19 +3,38 @@ export default function CareerSection() {
     <div className="bg-white dark:bg-neutral-900">
       <div className="mx-auto max-w-7xl py-12 px-4 text-center sm:px-6 lg:py-16 lg:px-8">
         <h2 className="font-oxanium text-3xl font-bold tracking-tight text-gray-900 sm:text-4xl dark:text-neutral-100">
-          <span className="block">Sounds fun?</span>
+          <span className="block">Join the community</span>
         </h2>
-        <div className="mt-8 flex justify-center">
-          <div className="inline-flex rounded-md shadow">
-            <a
-              href="https://www.notion.so/Taiko-Jobs-828fd7232d2c4150a11e10c8baa910a2"
-              target="_blank"
-              className="inline-flex items-center justify-center rounded-md border border-transparent bg-[#e30ead] px-5 py-3 text-base font-semibold text-white dark:text-neutral-100 hover:bg-[#bd0b90] hover:no-underline hover:text-white"
-            >
-              Explore open positions ↗
-            </a>
+        <section className="bg-white dark:bg-neutral-900 py-12">
+          <div className="container mx-auto px-4">
+            <div className="flex flex-wrap justify-center">
+              <a
+                href="https://github.com/taikoxyz/taiko-mono/blob/main/CONTRIBUTING.md"
+                target={"_blank"}
+                rel={"noreferrer"}
+                className="inline-flex items-center justify-center w-64 md:w-72 px-4 md:px-6 py-2 md:py-3 mb-4 mx-2 text-base md:text-lg font-semibold text-white bg-black hover:bg-gray-800 dark:bg-gray-800 dark:hover:bg-black rounded-md shadow-md"
+              >
+                Contribute to Taiko &#8599;
+              </a>
+              <a
+                href="https://discord.gg/taikoxyz"
+                target={"_blank"}
+                rel={"noreferrer"}
+                className="inline-flex items-center justify-center w-64 md:w-72 px-4 md:px-6 py-2 md:py-3 mb-4 mx-2 text-base md:text-lg font-semibold text-white bg-indigo-500 hover:bg-indigo-700 dark:hover:bg-indigo-400 rounded-md shadow-md"
+              >
+                Join the Discord &#8599;
+              </a>
+              <a
+                href="https://taikoxyz.notion.site/Taiko-Jobs-828fd7232d2c4150a11e10c8baa910a2"
+                target={"_blank"}
+                rel={"noreferrer"}
+                className="inline-flex items-center justify-center w-64 md:w-72 px-4 md:px-6 py-2 md:py-3 mb-4 mx-2 text-base md:text-lg font-semibold text-white bg-[#fc0fc0] hover:bg-[#e30ead] dark:hover:bg-[#e30ead] rounded-md shadow-md"
+              >
+                Explore open positions &#8599;
+              </a>
+            </div>
           </div>
-        </div>
+        </section>
       </div>
     </div>
   );

packages/website/components/FeaturesSection.tsx

@@ -6,19 +6,19 @@ import {
 
 const features = [
   {
-    name: "Type 1",
+    name: "Type 1 (Ethereum-equivalent)",
     description:
       "A Type 1 (Ethereum-equivalent) ZK-EVM aims for maximum compatibility. This results in a seamless developer experience.",
     icon: ArrowPathIcon,
   },
   {
-    name: "Open Source",
+    name: "Fully open source",
     description:
-      "Taiko's code is open source and available on GitHub. “Open source” means free to view and modify the source code.",
+      "Taiko's code is open source and available on GitHub. Free to use and modify the source code with the permissive license.",
     icon: ScaleIcon,
   },
   {
-    name: "Decentralized",
+    name: "Fully decentralized",
     description:
       "Fully decentralized and permissionless nodes, proposers, and provers. Anyone can participate in Taiko.",
     icon: GlobeAltIcon,

packages/website/components/Footer.tsx

@@ -1,7 +1,7 @@
 export default function Footer() {
   return (
     <footer className="bg-neutral-100 dark:bg-neutral-900">
-      <div className="mx-auto max-w-[90rem]">
+      <div className="mx-auto max-w-[90rem] pl-3">
         <div className="grid grid-cols-2 pl-[max(env(safe-area-inset-left),1.5rem)] pr-[max(env(safe-area-inset-right),1.5rem)] py-8 md:grid-cols-3">
           <div>
             <h2 className="mb-6 text-sm font-semibold text-neutral-500 uppercase dark:text-neutral-300 pt-3">
@@ -81,15 +81,6 @@ export default function Footer() {
                   Discord
                 </a>
               </li>
-              <li className="mb-4">
-                <a
-                  href="https://www.reddit.com/r/taiko_xyz/"
-                  className="hover:underline"
-                  target={"_blank"}
-                >
-                  Reddit
-                </a>
-              </li>
               <li className="mb-4">
                 <a
                   href="https://twitter.com/taikoxyz"

packages/website/components/Hero.tsx

@@ -37,13 +37,13 @@ export default function Hero() {
   }
 
   return (
-    <div className="mx-auto max-w-[90rem]">
+    <div className="mx-auto max-w-[90rem] px-3">
       <div className="relative bg-neutral-50 dark:bg-neutral-900 mt-3">
         <main className="lg:relative">
           <div className="relative z-10 w-3/4 pt-16 pb-20 text-left lg:py-48">
             <div className="pl-[max(env(safe-area-inset-left),1.5rem)]">
               <h1 className="font-oxanium text-4xl md:text-5xl font-bold tracking-tight text-neutral-900 dark:text-neutral-100">
-                A <span className="text-[#e30ead]">Type 1</span> ZK-EVM
+                A <span className="text-[#fc0fc0]">Type 1</span> ZK-EVM
               </h1>
               <p className="font-oxanium mt-3 text-lg text-neutral-600 sm:text-xl md:mt-5 dark:text-neutral-100">
                 Fully decentralized, Ethereum-equivalent ZK-Rollup.
@@ -52,9 +52,9 @@ export default function Hero() {
                 <div className="inline-flex rounded-md shadow">
                   <a
                     href="/docs/"
-                    className="inline-flex items-center rounded-md border border-transparent bg-[#e30ead] px-5 py-3 text-base font-semibold text-white dark:text-neutral-100 hover:bg-[#bd0b90] hover:no-underline hover:text-white"
+                    className="inline-flex items-center rounded-md border border-transparent bg-[#fc0fc0] px-5 py-3 text-base font-semibold text-white dark:text-neutral-100 hover:bg-[#e30ead] hover:no-underline hover:text-white"
                   >
-                    Get started
+                    Get started ✨
                   </a>
                 </div>
               </div>

packages/website/pages/_meta.json

@@ -24,5 +24,45 @@
     "type": "page",
     "href": "https://mirror.xyz/labs.taiko.eth",
     "newWindow": true
+  },
+  "feedback": {
+    "title": "Feedback ↗",
+    "type": "page",
+    "href": "https://forms.gle/RZsweAPy5RhQSP6j7",
+    "newWindow": true
+  },
+  "bridge": {
+    "title": "Bridge ↗",
+    "type": "page",
+    "href": "https://bridge.a2.taiko.xyz",
+    "newWindow": true
+  },
+  "swap": {
+    "title": "Swap ↗",
+    "type": "page",
+    "href": "https://swap.a2.taiko.xyz",
+    "newWindow": true
+  },
+  "status": {
+    "title": "Status ↗",
+    "type": "page",
+    "href": "https://status.a2.taiko.xyz",
+    "newWindow": true
+  },
+  "explorers": {
+    "title": "Explorers",
+    "type": "menu",
+    "items": {
+      "l1-block-explorer": {
+        "title": "Sepolia Block Explorer ↗",
+        "href": "https://sepolia.etherscan.io",
+        "newWindow": true
+      },
+      "l2-block-explorer": {
+        "title": "Taiko Block Explorer ↗",
+        "href": "https://explorer.a2.taiko.xyz",
+        "newWindow": true
+      }
+    }
   }
 }

packages/website/pages/docs/_meta.json

@@ -1,6 +1,6 @@
 {
   "index": {
-    "title": "Introduction 👋"
+    "title": "Hello 👋"
   },
   "concepts": {
     "title": "Concepts"

packages/website/pages/docs/concepts.mdx

@@ -0,0 +1 @@
+Learn all about Taiko's core concepts here.

packages/website/pages/docs/concepts/_meta.json

@@ -2,8 +2,11 @@
   "overview": {
     "title": "Overview"
   },
-  "creating-l2-blocks": {
-    "title": "Creating L2 blocks"
+  "creating-taiko-blocks": {
+    "title": "Creating Taiko blocks"
+  },
+  "proving-taiko-blocks": {
+    "title": "Proving Taiko blocks"
   },
   "bridging": {
     "title": "Bridging"

packages/website/pages/docs/concepts/bridging/_meta.json

@@ -0,0 +1,14 @@
+{
+  "cross-chain-messaging": {
+    "title": "Cross-chain messaging"
+  },
+  "the-signal-service": {
+    "title": "The signal service"
+  },
+  "the-taiko-bridge-dapp": {
+    "title": "The bridge dapp"
+  },
+  "how-the-bridge-works": {
+    "title": "How the bridge dapp works"
+  }
+}