feat(technical): introduce overview page

docs/index.mdx

@@ -29,7 +29,7 @@ Welcome! OKP4 is a public PoS layer 1 blockchain built for trust-minimized data
     </div>
     <div class="col">
       <div class="card card-body h-100 d-flex flex-column">
-        <a href="/technical-documentation/introduction" class="card-title card-link stretched-link">
+        <a href="/technical-documentation/overview" class="card-title card-link stretched-link">
           <h2>Technical Documentation</h2>
         </a>
         <p class="card-text">Deep dive into the OKP4 Protocol.</p>

docs/technical-documentation/overview.mdx

@@ -0,0 +1,93 @@
+---
+sidebar_position: 1
+---
+
+# Overview
+
+## Fundamentals of OKP4
+
+Delve into the core technical concepts behind the OKP4 Protocol.
+
+<div class="docs-card-container">
+  <div class="row row-cols-1 row-cols-md-2a g-3">
+    <div class="col">
+      <div class="card card-body h-100 d-flex flex-column">
+        <a
+          href="/technical-documentation/ontology/the-power-of-ontologies"
+          class="card-title card-link stretched-link"
+        >
+          <h2>Ontology</h2>
+        </a>
+        <p class="card-text">Explore the semantic data model driving the protocol.</p>
+      </div>
+    </div>
+  </div>
+</div>
+
+## Delving into the Protocol
+
+### The Smart Contracts
+
+Deepen your understanding of the OKP4 Protocol's Smart Contracts.
+
+<div class="docs-card-container">
+  <div class="row row-cols-1 row-cols-md-2a g-3">
+    <div class="col">
+      <div class="card card-body h-100 d-flex flex-column">
+        <a href="/contracts/okp4-objectarium" class="card-title card-link stretched-link">
+          <h2>Objectarium</h2>
+        </a>
+        <p class="card-text">Introducing the immutable on-chain Object Storage.</p>
+      </div>
+    </div>
+    <div class="col">
+      <div class="card card-body h-100 d-flex flex-column">
+        <a href="/contracts/okp4-cognitarium" class="card-title card-link stretched-link">
+          <h2>Cognitarium</h2>
+        </a>
+        <p class="card-text">Introducing the on-chain Semantic Storage layer.</p>
+      </div>
+    </div>
+    <div class="col">
+      <div class="card card-body h-100 d-flex flex-column">
+        <a href="/contracts/okp4-law-stone" class="card-title card-link stretched-link">
+          <h2>Law Stone</h2>
+        </a>
+        <p class="card-text">Introducing the Governance Interpreter.</p>
+      </div>
+    </div>
+  </div>
+</div>
+
+### OKP4's Cosmos Modules
+
+Unearth the features and functions of OKP4 Protocol's Cosmos Modules.
+
+<div class="docs-card-container">
+  <div class="row row-cols-1 row-cols-md-2a g-3">
+    <div class="col">
+      <div class="card card-body h-100 d-flex flex-column">
+        <a href="/modules/mint" class="card-title card-link stretched-link">
+          <h2>Mint</h2>
+        </a>
+        <p class="card-text">Unveil the mechanism of minting.</p>
+      </div>
+    </div>
+    <div class="col">
+      <div class="card card-body h-100 d-flex flex-column">
+        <a href="/modules/vesting" class="card-title card-link stretched-link">
+          <h2>Vesting</h2>
+        </a>
+        <p class="card-text">Understand the specifics of vesting in the protocol.</p>
+      </div>
+    </div>
+    <div class="col">
+      <div class="card card-body h-100 d-flex flex-column">
+        <a href="/modules/logic" class="card-title card-link stretched-link">
+          <h2>Logic</h2>
+        </a>
+        <p class="card-text">Discover the heart of Logical interpretation in the protocol.</p>
+      </div>
+    </div>
+  </div>
+</div>

docusaurus.config.js

@@ -87,7 +87,7 @@ async function createconfig() {
               activeBasePath: '/nodes'
             },
             {
-              to: '/technical-documentation/introduction',
+              to: '/technical-documentation/overview',
               position: 'left',
               label: 'Technical documentation',
               activeBasePath: '/technical-documentation'

sidebars.js

@@ -35,7 +35,7 @@ const sidebars = {
       items: [
         {
           type: 'doc',
-          id: 'technical-documentation/introduction',
+          id: 'technical-documentation/overview',
         },
         {
           type: 'category',