Update en.toml

.github/workflows/build-and-preview-docs.yml

@@ -98,7 +98,7 @@ jobs:
           HUGO_ENV: production
           HUGO_PREVIEW: "true"
         run: |
-          make docs-build-production BASE_URL="/"
+          make docs-build-production BASE_URL="/${{ github.event.repository.name }}/pr-preview/pr-${{ github.event.pull_request.number }}/"
           find docs/public -maxdepth 1 -type d -name 'v0.*' -exec rm -rf {} +
           cat > docs/public/robots.txt <<'EOF'
           User-agent: *

.github/workflows/hugo.yml

@@ -59,7 +59,7 @@ jobs:
           HUGO_ENVIRONMENT: production
           HUGO_ENV: production
         run: |
-          make docs-build-production BASE_URL="/"
+          make docs-build-production BASE_URL="/${{ github.event.repository.name }}/"
           cp docs/CNAME docs/public/CNAME
           touch docs/public/.nojekyll
           if [ -d gh-pages-existing/pr-preview ]; then

docs/assets/scss/_fonts.scss

@@ -1,6 +1,6 @@
 @font-face {
     font-family: "Qanelas Soft";
-    src: url('/fonts/qanelas-soft/QanelasSoftRegular.otf') format('opentype');
+    src: url('../fonts/qanelas-soft/QanelasSoftRegular.otf') format('opentype');
     font-weight: 400;
     font-display: swap;
 }

docs/content/en/_index.md

@@ -16,16 +16,16 @@ linkTitle: Documentation
 <div class="flex container">
   <!-- OVERVIEW -->
   <div class="section">
-    <a href="/project/overview/">
+    <a href="{{< ref "project/overview.md" >}}">
         <div class="btn-primary">Overview & Installation</div>
     </a>
     <ul>
-        <li>🚀 <a href="/installation/quick-start">Quick Start</a> , <a href="/project/overview/">Overview</a>, and <a href="/project/faq">FAQs</a></li>
+        <li>🚀 <a href="{{< ref "installation/quick-start/index.md" >}}">Quick Start</a> , <a href="{{< ref "project/overview.md" >}}">Overview</a>, and <a href="{{< ref "project/FAQ.md" >}}">FAQs</a></li>
     </ul>
     <details>
       <summary>
         <p style="display:inline">
-          <a href="/installation/" class="text-black">Installation</a>
+          <a href="{{< ref "installation/_index.md" >}}" class="text-black">Installation</a>
         </p>
       </summary>
       <ul class="section-title">
@@ -36,13 +36,13 @@ linkTitle: Documentation
 
   <!-- CONCEPTS -->
   <div class="section">
-    <a href="/concepts">
+    <a href="{{< ref "concepts/_index.md" >}}">
         <div class="btn-primary">Concepts</div>
     </a>
     <details>
       <summary>
         <p style="display:inline">
-          <a href="/concepts/logical" class="text-black">Logical</a>
+          <a href="{{< ref "concepts/logical/_index.md" >}}" class="text-black">Logical</a>
         </p>
       </summary>
       <ul>
@@ -52,7 +52,7 @@ linkTitle: Documentation
     <details>
       <summary>
         <p style="display:inline">
-          <a href="/concepts/architecture" class="text-black section-title">Architectural</a>
+          <a href="{{< ref "concepts/architecture/_index.md" >}}" class="text-black section-title">Architectural</a>
         </p>
       </summary>
       <ul>
@@ -66,13 +66,13 @@ linkTitle: Documentation
 
 <!-- GUIDES -->
   <div class="section">
-    <a href="/guides">
+    <a href="{{< ref "guides/_index.md" >}}">
         <div class="btn-primary">Guides & Tutorials</div>
     </a>
     <details>
       <summary>
         <p style="display:inline">
-          <a href="/guides/mesheryctl/" class="text-black">Using Meshery CLI Guides</a>
+          <a href="{{< ref "guides/mesheryctl/_index.md" >}}" class="text-black">Using Meshery CLI Guides</a>
         </p>
       </summary>
       <ul class="section-title">
@@ -82,7 +82,7 @@ linkTitle: Documentation
     <details>
       <summary>
         <p style="display:inline">
-          <a href="/guides/tutorials/" class="text-black">🧑‍🔬 Tutorials</a>
+          <a href="{{< ref "guides/tutorials/_index.md" >}}" class="text-black">🧑‍🔬 Tutorials</a>
         </p>
       </summary>
       <ul class="section-title">
@@ -92,7 +92,7 @@ linkTitle: Documentation
     <details>
       <summary>
         <p style="display:inline">
-          <a href="/guides/infrastructure-management" class="text-black">Infrastructure Management</a>
+          <a href="{{< ref "guides/infrastructure-management/_index.md" >}}" class="text-black">Infrastructure Management</a>
         </p>
       </summary>
       <ul class="section-title">
@@ -102,7 +102,7 @@ linkTitle: Documentation
     <details>
       <summary>
         <p style="display:inline">
-          <a href="/guides/performance-management" class="text-black">Performance Management</a>
+          <a href="{{< ref "guides/performance-management/_index.md" >}}" class="text-black">Performance Management</a>
         </p>
       </summary>
       <ul class="section-title">
@@ -112,7 +112,7 @@ linkTitle: Documentation
     <details>
       <summary>
         <p style="display:inline">
-          <a href="/guides/configuration-management" class="text-black">Configuration Management</a>
+          <a href="{{< ref "guides/configuration-management/_index.md" >}}" class="text-black">Configuration Management</a>
         </p>
       </summary>
       <ul class="section-title">
@@ -122,7 +122,7 @@ linkTitle: Documentation
     <details>
       <summary>
         <p style="display:inline">
-          <a href="/guides/troubleshooting" class="text-black">Troubleshooting Guides</a>
+          <a href="{{< ref "guides/troubleshooting/_index.md" >}}" class="text-black">Troubleshooting Guides</a>
         </p>
       </summary>
       <ul class="section-title">
@@ -133,13 +133,13 @@ linkTitle: Documentation
 
   <!-- Extensions -->
   <div class="section">
-    <a href="/extensions">
+    <a href="{{< ref "extensions/_index.md" >}}">
         <div class="btn-primary">Integrations & Extensions</div>
     </a>
     <details>
       <summary>
         <p style="display:inline">
-          <a href="/extensions" class="text-black">Extensions</a>
+          <a href="{{< ref "extensions/_index.md" >}}" class="text-black">Extensions</a>
         </p>
       </summary>
       <ul class="section-title">
@@ -149,11 +149,11 @@ linkTitle: Documentation
     <details>
       <summary>
         <p style="display:inline">
-<a href="/extensions/models" class="text-black">Models</a>
+<a href="{{< ref "extensions/models/_index.md" >}}" class="text-black">Models</a>
         </p>
       </summary>
       <ul class="section-title">
-        <li>See all <a href="/extensions/models">{{< model-count >}} models</a></li>
+        <li>See all <a href="{{< ref "extensions/models/_index.md" >}}">{{< model-count >}} models</a></li>
       </ul>
     </details>
   </div>
@@ -164,13 +164,13 @@ linkTitle: Documentation
 
 <!-- Contributing & Community -->
   <div class="section">
-    <a href="/project">
+    <a href="{{< ref "project/_index.md" >}}">
         <div class="btn-primary">Contributing & Community</div>
     </a>
     <details>
       <summary>
         <p style="display:inline">
-          <a href="/project" class="text-black">Community</a>
+          <a href="{{< ref "project/_index.md" >}}" class="text-black">Community</a>
         </p>
       </summary>
       <ul class="section-title">
@@ -181,7 +181,7 @@ linkTitle: Documentation
     <details>
       <summary>
         <p style="display:inline">
-          <a href="/project/contributing" class="text-black">Contributing</a>
+          <a href="{{< ref "project/contributing/_index.md" >}}" class="text-black">Contributing</a>
         </p>
       </summary>
       <ul class="section-title">
@@ -192,14 +192,14 @@ linkTitle: Documentation
 
   <!-- REFERENCE -->
   <div class="section">
-    <a href="/reference">
+    <a href="{{< ref "reference/_index.md" >}}">
         <div class="btn-primary">Extensibility & Reference</div>
     </a>
     <!-- Reference -->
     <details>
       <summary>
         <p style="display:inline">
-          <a href="/reference" class="text-black">Reference</a>
+          <a href="{{< ref "reference/_index.md" >}}" class="text-black">Reference</a>
         </p>
       </summary>
       <ul class="section-title">
@@ -210,7 +210,7 @@ linkTitle: Documentation
     <details>
       <summary>
         <p style="display:inline">
-          <a href="/extensibility" class="text-black">Extensibility</a>
+          <a href="{{< ref "reference/extensibility/_index.md" >}}" class="text-black">Extensibility</a>
         </p>
       </summary>
       <ul class="section-title">