You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@pulsar.apache.org by li...@apache.org on 2022/09/27 03:23:32 UTC

[pulsar-site] branch main updated: style: improve TOC style (#228)

This is an automated email from the ASF dual-hosted git repository.

liuyu pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/pulsar-site.git


The following commit(s) were added to refs/heads/main by this push:
     new 8f99f29d310 style: improve TOC style (#228)
8f99f29d310 is described below

commit 8f99f29d310745e66455d9588330332e91213d0f
Author: Mercurio <32...@users.noreply.github.com>
AuthorDate: Tue Sep 27 11:23:27 2022 +0800

    style: improve TOC style (#228)
    
    Signed-off-by: Mercurio <si...@gmail.com>
    
    Signed-off-by: Mercurio <si...@gmail.com>
---
 .../docsify/2.10.0/pulsar-admin/_sidebar.md        |   2 +-
 .../docsify/2.10.0/pulsar-client/_sidebar.md       |   2 +-
 .../docsify/2.10.0/pulsar-perf/_sidebar.md         |   2 +-
 .../website-next/docsify/2.10.0/pulsar/_sidebar.md |   2 +-
 .../docsify/2.6.0/pulsar-admin/_sidebar.md         |   2 +-
 .../docsify/2.6.0/pulsar-client/_sidebar.md        |   2 +-
 .../docsify/2.6.0/pulsar-perf/_sidebar.md          |   2 +-
 .../website-next/docsify/2.6.0/pulsar/_sidebar.md  |   2 +-
 .../docsify/2.7.0/pulsar-admin/_sidebar.md         |   2 +-
 .../docsify/2.7.0/pulsar-client/_sidebar.md        |   2 +-
 .../docsify/2.7.0/pulsar-perf/_sidebar.md          |   2 +-
 .../website-next/docsify/2.7.0/pulsar/_sidebar.md  |   2 +-
 .../docsify/2.8.0/pulsar-admin/_sidebar.md         |   2 +-
 .../docsify/2.8.0/pulsar-client/_sidebar.md        |   2 +-
 .../docsify/2.8.0/pulsar-perf/_sidebar.md          |   2 +-
 .../website-next/docsify/2.8.0/pulsar/_sidebar.md  |   2 +-
 .../docsify/2.9.0/pulsar-admin/_sidebar.md         |   2 +-
 .../docsify/2.9.0/pulsar-client/_sidebar.md        |   2 +-
 .../docsify/2.9.0/pulsar-perf/_sidebar.md          |   2 +-
 .../website-next/docsify/2.9.0/pulsar/_sidebar.md  |   2 +-
 site2/website-next/docsify/_sidebar.md             |   8 +-
 site2/website-next/docsify/index.html              | 372 +++++++--------------
 .../docsify/latest/pulsar-admin/_sidebar.md        |   2 +-
 .../docsify/latest/pulsar-client/_sidebar.md       |   2 +-
 .../docsify/latest/pulsar-perf/_sidebar.md         |   2 +-
 .../website-next/docsify/latest/pulsar/_sidebar.md |   2 +-
 26 files changed, 156 insertions(+), 272 deletions(-)

diff --git a/site2/website-next/docsify/2.10.0/pulsar-admin/_sidebar.md b/site2/website-next/docsify/2.10.0/pulsar-admin/_sidebar.md
index c09a9db6b36..c37222ad4e3 100644
--- a/site2/website-next/docsify/2.10.0/pulsar-admin/_sidebar.md
+++ b/site2/website-next/docsify/2.10.0/pulsar-admin/_sidebar.md
@@ -1,4 +1,4 @@
-- CLI Configuration > `pulsar-admin`
+- CLI Configuration > pulsar-admin
     - [broker-stats](pulsar-admin/broker-stats.md)
     - [brokers](pulsar-admin/brokers.md)
     - [bookies](pulsar-admin/bookies.md)
diff --git a/site2/website-next/docsify/2.10.0/pulsar-client/_sidebar.md b/site2/website-next/docsify/2.10.0/pulsar-client/_sidebar.md
index 8647c296c12..6a94239b1d2 100644
--- a/site2/website-next/docsify/2.10.0/pulsar-client/_sidebar.md
+++ b/site2/website-next/docsify/2.10.0/pulsar-client/_sidebar.md
@@ -1,2 +1,2 @@
-- CLI Configuration > `pulsar-client`
+- CLI Configuration > pulsar-client
     - [pulsar-client](pulsar-client/pulsar-client.md)
diff --git a/site2/website-next/docsify/2.10.0/pulsar-perf/_sidebar.md b/site2/website-next/docsify/2.10.0/pulsar-perf/_sidebar.md
index bf6635fdb67..499161c404c 100644
--- a/site2/website-next/docsify/2.10.0/pulsar-perf/_sidebar.md
+++ b/site2/website-next/docsify/2.10.0/pulsar-perf/_sidebar.md
@@ -1,2 +1,2 @@
-- CLI Configuration > `pulsar-perf`
+- CLI Configuration > pulsar-perf
     - [pulsar-perf](pulsar-perf/pulsar-perf.md)
diff --git a/site2/website-next/docsify/2.10.0/pulsar/_sidebar.md b/site2/website-next/docsify/2.10.0/pulsar/_sidebar.md
index fbee2170d57..fc05fd6f1f0 100644
--- a/site2/website-next/docsify/2.10.0/pulsar/_sidebar.md
+++ b/site2/website-next/docsify/2.10.0/pulsar/_sidebar.md
@@ -1,4 +1,4 @@
-- CLI Configuration > `pulsar`
+- CLI Configuration > pulsar
     - [broker](pulsar/broker.md)
     - [broker-tool](pulsar/broker-tool.md)
     - [compact-topic](pulsar/compact-topic.md)
diff --git a/site2/website-next/docsify/2.6.0/pulsar-admin/_sidebar.md b/site2/website-next/docsify/2.6.0/pulsar-admin/_sidebar.md
index c09a9db6b36..c37222ad4e3 100644
--- a/site2/website-next/docsify/2.6.0/pulsar-admin/_sidebar.md
+++ b/site2/website-next/docsify/2.6.0/pulsar-admin/_sidebar.md
@@ -1,4 +1,4 @@
-- CLI Configuration > `pulsar-admin`
+- CLI Configuration > pulsar-admin
     - [broker-stats](pulsar-admin/broker-stats.md)
     - [brokers](pulsar-admin/brokers.md)
     - [bookies](pulsar-admin/bookies.md)
diff --git a/site2/website-next/docsify/2.6.0/pulsar-client/_sidebar.md b/site2/website-next/docsify/2.6.0/pulsar-client/_sidebar.md
index 8647c296c12..6a94239b1d2 100644
--- a/site2/website-next/docsify/2.6.0/pulsar-client/_sidebar.md
+++ b/site2/website-next/docsify/2.6.0/pulsar-client/_sidebar.md
@@ -1,2 +1,2 @@
-- CLI Configuration > `pulsar-client`
+- CLI Configuration > pulsar-client
     - [pulsar-client](pulsar-client/pulsar-client.md)
diff --git a/site2/website-next/docsify/2.6.0/pulsar-perf/_sidebar.md b/site2/website-next/docsify/2.6.0/pulsar-perf/_sidebar.md
index bf6635fdb67..499161c404c 100644
--- a/site2/website-next/docsify/2.6.0/pulsar-perf/_sidebar.md
+++ b/site2/website-next/docsify/2.6.0/pulsar-perf/_sidebar.md
@@ -1,2 +1,2 @@
-- CLI Configuration > `pulsar-perf`
+- CLI Configuration > pulsar-perf
     - [pulsar-perf](pulsar-perf/pulsar-perf.md)
diff --git a/site2/website-next/docsify/2.6.0/pulsar/_sidebar.md b/site2/website-next/docsify/2.6.0/pulsar/_sidebar.md
index afdff6d5013..d76dde33390 100644
--- a/site2/website-next/docsify/2.6.0/pulsar/_sidebar.md
+++ b/site2/website-next/docsify/2.6.0/pulsar/_sidebar.md
@@ -1,4 +1,4 @@
-- CLI Configuration > `pulsar`
+- CLI Configuration > pulsar
     - [broker-tool](pulsar/broker-tool.md)
     - [compact-topic](pulsar/compact-topic.md)
     - [tokens](pulsar/tokens.md)
diff --git a/site2/website-next/docsify/2.7.0/pulsar-admin/_sidebar.md b/site2/website-next/docsify/2.7.0/pulsar-admin/_sidebar.md
index c09a9db6b36..c37222ad4e3 100644
--- a/site2/website-next/docsify/2.7.0/pulsar-admin/_sidebar.md
+++ b/site2/website-next/docsify/2.7.0/pulsar-admin/_sidebar.md
@@ -1,4 +1,4 @@
-- CLI Configuration > `pulsar-admin`
+- CLI Configuration > pulsar-admin
     - [broker-stats](pulsar-admin/broker-stats.md)
     - [brokers](pulsar-admin/brokers.md)
     - [bookies](pulsar-admin/bookies.md)
diff --git a/site2/website-next/docsify/2.7.0/pulsar-client/_sidebar.md b/site2/website-next/docsify/2.7.0/pulsar-client/_sidebar.md
index 8647c296c12..6a94239b1d2 100644
--- a/site2/website-next/docsify/2.7.0/pulsar-client/_sidebar.md
+++ b/site2/website-next/docsify/2.7.0/pulsar-client/_sidebar.md
@@ -1,2 +1,2 @@
-- CLI Configuration > `pulsar-client`
+- CLI Configuration > pulsar-client
     - [pulsar-client](pulsar-client/pulsar-client.md)
diff --git a/site2/website-next/docsify/2.7.0/pulsar-perf/_sidebar.md b/site2/website-next/docsify/2.7.0/pulsar-perf/_sidebar.md
index bf6635fdb67..499161c404c 100644
--- a/site2/website-next/docsify/2.7.0/pulsar-perf/_sidebar.md
+++ b/site2/website-next/docsify/2.7.0/pulsar-perf/_sidebar.md
@@ -1,2 +1,2 @@
-- CLI Configuration > `pulsar-perf`
+- CLI Configuration > pulsar-perf
     - [pulsar-perf](pulsar-perf/pulsar-perf.md)
diff --git a/site2/website-next/docsify/2.7.0/pulsar/_sidebar.md b/site2/website-next/docsify/2.7.0/pulsar/_sidebar.md
index 6164299d4b5..fe2261d9fe8 100644
--- a/site2/website-next/docsify/2.7.0/pulsar/_sidebar.md
+++ b/site2/website-next/docsify/2.7.0/pulsar/_sidebar.md
@@ -1,4 +1,4 @@
-- CLI Configuration > `pulsar`
+- CLI Configuration > pulsar
     - [broker-tool](pulsar/broker-tool.md)
     - [compact-topic](pulsar/compact-topic.md)
     - [tokens](pulsar/tokens.md)
diff --git a/site2/website-next/docsify/2.8.0/pulsar-admin/_sidebar.md b/site2/website-next/docsify/2.8.0/pulsar-admin/_sidebar.md
index c09a9db6b36..c37222ad4e3 100644
--- a/site2/website-next/docsify/2.8.0/pulsar-admin/_sidebar.md
+++ b/site2/website-next/docsify/2.8.0/pulsar-admin/_sidebar.md
@@ -1,4 +1,4 @@
-- CLI Configuration > `pulsar-admin`
+- CLI Configuration > pulsar-admin
     - [broker-stats](pulsar-admin/broker-stats.md)
     - [brokers](pulsar-admin/brokers.md)
     - [bookies](pulsar-admin/bookies.md)
diff --git a/site2/website-next/docsify/2.8.0/pulsar-client/_sidebar.md b/site2/website-next/docsify/2.8.0/pulsar-client/_sidebar.md
index 8647c296c12..6a94239b1d2 100644
--- a/site2/website-next/docsify/2.8.0/pulsar-client/_sidebar.md
+++ b/site2/website-next/docsify/2.8.0/pulsar-client/_sidebar.md
@@ -1,2 +1,2 @@
-- CLI Configuration > `pulsar-client`
+- CLI Configuration > pulsar-client
     - [pulsar-client](pulsar-client/pulsar-client.md)
diff --git a/site2/website-next/docsify/2.8.0/pulsar-perf/_sidebar.md b/site2/website-next/docsify/2.8.0/pulsar-perf/_sidebar.md
index bf6635fdb67..499161c404c 100644
--- a/site2/website-next/docsify/2.8.0/pulsar-perf/_sidebar.md
+++ b/site2/website-next/docsify/2.8.0/pulsar-perf/_sidebar.md
@@ -1,2 +1,2 @@
-- CLI Configuration > `pulsar-perf`
+- CLI Configuration > pulsar-perf
     - [pulsar-perf](pulsar-perf/pulsar-perf.md)
diff --git a/site2/website-next/docsify/2.8.0/pulsar/_sidebar.md b/site2/website-next/docsify/2.8.0/pulsar/_sidebar.md
index fbee2170d57..fc05fd6f1f0 100644
--- a/site2/website-next/docsify/2.8.0/pulsar/_sidebar.md
+++ b/site2/website-next/docsify/2.8.0/pulsar/_sidebar.md
@@ -1,4 +1,4 @@
-- CLI Configuration > `pulsar`
+- CLI Configuration > pulsar
     - [broker](pulsar/broker.md)
     - [broker-tool](pulsar/broker-tool.md)
     - [compact-topic](pulsar/compact-topic.md)
diff --git a/site2/website-next/docsify/2.9.0/pulsar-admin/_sidebar.md b/site2/website-next/docsify/2.9.0/pulsar-admin/_sidebar.md
index c09a9db6b36..c37222ad4e3 100644
--- a/site2/website-next/docsify/2.9.0/pulsar-admin/_sidebar.md
+++ b/site2/website-next/docsify/2.9.0/pulsar-admin/_sidebar.md
@@ -1,4 +1,4 @@
-- CLI Configuration > `pulsar-admin`
+- CLI Configuration > pulsar-admin
     - [broker-stats](pulsar-admin/broker-stats.md)
     - [brokers](pulsar-admin/brokers.md)
     - [bookies](pulsar-admin/bookies.md)
diff --git a/site2/website-next/docsify/2.9.0/pulsar-client/_sidebar.md b/site2/website-next/docsify/2.9.0/pulsar-client/_sidebar.md
index 8647c296c12..6a94239b1d2 100644
--- a/site2/website-next/docsify/2.9.0/pulsar-client/_sidebar.md
+++ b/site2/website-next/docsify/2.9.0/pulsar-client/_sidebar.md
@@ -1,2 +1,2 @@
-- CLI Configuration > `pulsar-client`
+- CLI Configuration > pulsar-client
     - [pulsar-client](pulsar-client/pulsar-client.md)
diff --git a/site2/website-next/docsify/2.9.0/pulsar-perf/_sidebar.md b/site2/website-next/docsify/2.9.0/pulsar-perf/_sidebar.md
index bf6635fdb67..499161c404c 100644
--- a/site2/website-next/docsify/2.9.0/pulsar-perf/_sidebar.md
+++ b/site2/website-next/docsify/2.9.0/pulsar-perf/_sidebar.md
@@ -1,2 +1,2 @@
-- CLI Configuration > `pulsar-perf`
+- CLI Configuration > pulsar-perf
     - [pulsar-perf](pulsar-perf/pulsar-perf.md)
diff --git a/site2/website-next/docsify/2.9.0/pulsar/_sidebar.md b/site2/website-next/docsify/2.9.0/pulsar/_sidebar.md
index fbee2170d57..fc05fd6f1f0 100644
--- a/site2/website-next/docsify/2.9.0/pulsar/_sidebar.md
+++ b/site2/website-next/docsify/2.9.0/pulsar/_sidebar.md
@@ -1,4 +1,4 @@
-- CLI Configuration > `pulsar`
+- CLI Configuration > pulsar
     - [broker](pulsar/broker.md)
     - [broker-tool](pulsar/broker-tool.md)
     - [compact-topic](pulsar/compact-topic.md)
diff --git a/site2/website-next/docsify/_sidebar.md b/site2/website-next/docsify/_sidebar.md
index 36be27f9d1e..5809d6d06dc 100644
--- a/site2/website-next/docsify/_sidebar.md
+++ b/site2/website-next/docsify/_sidebar.md
@@ -2,7 +2,7 @@
   - [Pulsar](config/)
   - [Client Library](client/)
 - CLI Configuration
-  - [`pulsar-admin`](pulsar-admin/)
-  - [`pulsar-client`](pulsar-client/)
-  - [`pulsar`](pulsar/)
-  - [`pulsar-perf`](pulsar-perf/)
+  - [pulsar-admin](pulsar-admin/)
+  - [pulsar-client](pulsar-client/)
+  - [pulsar](pulsar/)
+  - [pulsar-perf](pulsar-perf/)
diff --git a/site2/website-next/docsify/index.html b/site2/website-next/docsify/index.html
index 2fe860e621a..3247f7074fe 100644
--- a/site2/website-next/docsify/index.html
+++ b/site2/website-next/docsify/index.html
@@ -23,96 +23,146 @@
     />
 
     <!-- Plugins -->
-    <link
-      rel="stylesheet"
-      href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free/css/fontawesome.css"
-    />
-    <link
-      rel="stylesheet"
-      href="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free/css/solid.css"
-    />
     <style>
-      #jx-toc {
-        background-color: var(--sidebar-background, #fafafa);
-        border: 1px solid var(--sidebar-border-color, rgba(0, 0, 0, 0.07));
-        border-radius: 1px;
-        -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
-        box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
-        background-clip: padding-box;
-        padding: 5px 10px;
+      @media only screen and (max-width: 1299px) and (prefers-color-scheme: light) {
+        aside.toc-nav {
+          max-width: 45px;
+          opacity: 0.6;
+          right: 0 !important;
+          margin-right: 0 !important;
+          background: #fff;
+        }
+
+        aside.toc-nav:hover {
+          max-width: inherit;
+          opacity: 1;
+        }
+      }
+
+      @media only screen and (max-width: 1299px) and (prefers-color-scheme: dark) {
+        aside.toc-nav {
+          max-width: 45px;
+          opacity: 0.6;
+          right: 0 !important;
+          margin-right: 0 !important;
+          background: #222;
+        }
+
+        aside.toc-nav:hover {
+          max-width: inherit;
+          opacity: 1;
+        }
+      }
+
+      @media only screen and (min-width: 1300px) {
+        section.content {
+          padding-right: 250px;
+        }
+      }
+
+      aside.toc-nav {
         position: fixed;
-        right: 50px;
-        top: 68px;
-        font-size: 14px;
-        white-space: nowrap;
-        z-index: 999;
-        cursor: pointer;
-        text-align: right;
+        top: 70px;
+        right: 3%;
+        margin-right: 20px;
+        width: 250px;
+        z-index: 999999;
+        align-self: flex-start;
+        flex: 0 0 auto;
+        overflow-y: hidden;
         max-height: 70%;
-        overflow-y: auto;
-        overflow-x: hidden;
-        color: var(
-          --sidebar-nav-link-color--hover,
-          var(--sidebar-nav-link-color),
-          #364149
-        );
-      }
-      #jx-toc::-webkit-scrollbar {
-        width: 4px;
+        /* For iOS */
+        cursor: pointer;
+        /* For Firefox */
+        scrollbar-width: thin;
       }
-      #jx-toc::-webkit-scrollbar-thumb {
-        background: transparent;
-        border-radius: 4px;
+
+      aside.toc-nav:hover {
+        overflow-y: auto;
       }
-      #jx-toc:hover::-webkit-scrollbar-thumb {
-        background: hsla(0, 0%, 53.3%, 0.4);
+
+      aside.toc-nav::-webkit-scrollbar {
+        width: 5px;
+        background-color: #e0e0e0;
       }
-      #jx-toc:hover::-webkit-scrollbar-track {
-        background: hsla(0, 0%, 53.3%, 0.1);
+
+      aside.toc-nav::-webkit-scrollbar-thumb {
+        background: #9e9e9e;
+        border-radius: 5px;
       }
-      #jx-toc ul {
-        text-align: left;
-        padding-right: 10px;
-        padding-left: 10px;
-        list-style-type: none;
+
+      aside.toc-nav.nothing {
+        width: 0;
       }
-      #jx-toc ul li a {
-        text-decoration: none;
-        border-bottom: none;
-        font-size: 14px;
-        color: var(--sidebar-nav-link-color, #364149);
-        background: 0 0;
-        text-overflow: ellipsis;
-        overflow: hidden;
-        white-space: nowrap;
+
+      .page_toc {
         position: relative;
+        left: 0;
+        margin: 10px 0;
+        border: none;
+        font-size: 1em;
       }
-      #jx-toc ul li a:hover {
-        text-decoration: underline;
+
+      .page_toc p.title {
+        margin: 0;
+        padding-bottom: 5px;
+        font-weight: 600;
+        font-size: 1.2em;
       }
-      #jx-toc .active {
-        border-left: 5px solid;
-        color: var(--theme-color, #42b983);
-        padding-left: 10px;
+
+      .page_toc .anchor:hover:after {
+        content: "";
       }
-      #jx-toc-gotop {
-        position: fixed;
-        right: 50px;
-        bottom: 68px;
-        background-color: var(--sidebar-background, #fafafa);
-        border: 1px solid var(--sidebar-border-color, rgba(0, 0, 0, 0.07));
-        border-radius: 1px;
-        -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
-        box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
-        background-clip: padding-box;
-        z-index: 999;
+      .page_toc div[class^="lv"] a:hover span {
+        color: var(--sidebar-nav-link-color--active, #42b983);
+      }
+
+      .page_toc div {
+        border-left: 2px solid #e8e8e8;
+        text-indent: 10px;
+        padding: 2px 0;
         cursor: pointer;
-        font-size: 14px;
-        padding: 5px 10px;
+      }
+
+      .page_toc div.active {
+        border-left-color: var(--sidebar-nav-link-color--active, #42b983);
+        transition: border-left-color 0.23s;
+      }
+
+      .page_toc div.active a span {
+        color: var(--sidebar-nav-link-color--active, #42b983);
+        transition: color 0.23s;
+      }
+
+      .page_toc div[class^="lv"] a {
+        color: var(--text-color-base, black);
+        text-decoration: none;
+        font-weight: 300;
+        line-height: 2em;
+        display: block;
+      }
+
+      .page_toc div[class^="lv"] a span {
         color: var(
           --sidebar-nav-link-color--hover,
           var(--sidebar-nav-link-color)
         );
+        display: block;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+      }
+
+      .page_toc div.lv2 {
+        text-indent: 20px;
+      }
+
+      .page_toc div.lv3 {
+        text-indent: 30px;
+      }
+
+      .page_toc div.lv4 {
+        text-indent: 40px;
       }
     </style>
     <style>
@@ -155,8 +205,10 @@
         repo: "apache/pulsar",
         loadSidebar: true,
         auto2top: true,
-        jxtoc: {
-          headings: "h2, h3, h4",
+        routerMode: "history",
+        toc: {
+          tocMaxLevel: 3,
+          target: "h2, h3, h4",
         },
         namespaces: [
           {
@@ -180,174 +232,6 @@
 
     <!-- Plugins -->
     <script src="https://unpkg.com/docsify-namespaced"></script>
-    <script>
-      var defaultOptions = {
-        headings: "h1, h2, h3",
-      };
-
-      var aTag = function (src) {
-        var a = document.createElement("a");
-        var content = src.firstChild.innerHTML;
-
-        a.innerHTML = content;
-        a.href = src.firstChild.href;
-        a.onclick = activeClass;
-
-        return a;
-      };
-
-      var activeClass = function (e) {
-        var divs = document.querySelectorAll("#jx-toc .active");
-
-        // 删除之前的样式
-        [].forEach.call(divs, function (div) {
-          div.setAttribute("class", "");
-        });
-
-        // 给当前点击的项加入新的样式
-        e.target.parentNode.setAttribute("class", "active");
-      };
-
-      var createList = function (wrapper, count) {
-        while (count--) {
-          wrapper = wrapper.appendChild(document.createElement("ul"));
-
-          if (count) {
-            wrapper = wrapper.appendChild(document.createElement("li"));
-          }
-        }
-
-        return wrapper;
-      };
-
-      var getHeaders = function (selector) {
-        var allHeadings = document.querySelectorAll(selector);
-        var ret = [];
-
-        [].forEach.call(allHeadings, function (heading) {
-          ret = ret.concat(heading);
-        });
-
-        return ret;
-      };
-
-      var getLevel = function (header) {
-        var decs = header.match(/\d/g);
-
-        return decs ? Math.min.apply(null, decs) : 1;
-      };
-
-      var jumpBack = function (currentWrapper, offset) {
-        while (offset--) {
-          currentWrapper = currentWrapper.parentElement;
-        }
-
-        return currentWrapper;
-      };
-
-      var buildTOC = function (options) {
-        var ret = document.createElement("ul");
-        var wrapper = ret;
-        var lastLi = null;
-        var selector = ".markdown-section " + options.headings;
-        var headers = getHeaders(selector).filter(h => h.id);
-
-        headers.reduce(function (prev, curr, index) {
-          var currentLevel = getLevel(curr.tagName);
-          var offset = currentLevel - prev;
-
-          wrapper =
-            offset > 0
-              ? createList(lastLi || ret, offset)
-              : jumpBack(wrapper, -offset * 2);
-
-          wrapper = wrapper || ret;
-
-          var li = document.createElement("li");
-
-          wrapper.appendChild(li).appendChild(aTag(curr));
-
-          lastLi = li;
-
-          return currentLevel;
-        }, getLevel(options.headings));
-
-        return ret;
-      };
-
-      var goTopFunction = function (e) {
-        e.stopPropagation();
-        var step = window.scrollY / 50;
-        var scroll = function () {
-          window.scrollTo(0, window.scrollY - step);
-          if (window.scrollY > 0) {
-            setTimeout(scroll, 10);
-          }
-        };
-        scroll();
-      };
-
-      var pinFunction = function (e) {
-        e.stopPropagation();
-        var ul = document.querySelector("#jx-toc ul");
-        if (ul.style.display == "none") {
-          ul.style.display = "block";
-        } else {
-          ul.style.display = "none";
-        }
-      };
-
-      // Docsify plugin functions
-      function plugin(hook, vm) {
-        var userOptions = vm.config.jxtoc;
-
-        hook.mounted(function () {
-          var mainElm = document.querySelector("main");
-          var content = window.Docsify.dom.find(".content");
-          if (content) {
-            var jxtoc = window.Docsify.dom.create("div", "");
-            jxtoc.id = "jx-toc";
-            window.Docsify.dom.before(mainElm, jxtoc);
-
-            var jxGoTop = window.Docsify.dom.create(
-              "span",
-              "<i class='fas fa-arrow-up'></i>"
-            );
-            jxGoTop.id = "jx-toc-gotop";
-            jxGoTop.onclick = goTopFunction;
-            window.Docsify.dom.before(mainElm, jxGoTop);
-          }
-        });
-
-        hook.doneEach(function () {
-          var jxtoc = document.getElementById("jx-toc");
-
-          if (!jxtoc) {
-            return;
-          }
-          jxtoc.innerHTML = null;
-
-          var TocAnchor = document.createElement("i");
-          TocAnchor.setAttribute("class", "fas fa-list");
-          TocAnchor.onclick = pinFunction;
-          jxtoc.appendChild(TocAnchor);
-
-          const toc = buildTOC(userOptions);
-
-          if (!toc.innerHTML) {
-            return;
-          }
-
-          jxtoc.appendChild(toc);
-        });
-      }
-
-      // Docsify plugin options
-      window.$docsify["jx-toc"] = Object.assign(
-        defaultOptions,
-        window.$docsify["jx-toc"]
-      );
-      window.$docsify.plugins = [].concat(plugin, window.$docsify.plugins);
-    </script>
+    <script src="https://unpkg.com/docsify-plugin-toc@1.3.1/dist/docsify-plugin-toc.min.js"></script>
   </body>
 </html>
diff --git a/site2/website-next/docsify/latest/pulsar-admin/_sidebar.md b/site2/website-next/docsify/latest/pulsar-admin/_sidebar.md
index f5505dee112..2e66f553ac9 100644
--- a/site2/website-next/docsify/latest/pulsar-admin/_sidebar.md
+++ b/site2/website-next/docsify/latest/pulsar-admin/_sidebar.md
@@ -1,4 +1,4 @@
-- CLI Configuration > `pulsar-admin`
+- CLI Configuration > pulsar-admin
     - [broker-stats](pulsar-admin/broker-stats.md)
     - [brokers](pulsar-admin/brokers.md)
     - [bookies](pulsar-admin/bookies.md)
diff --git a/site2/website-next/docsify/latest/pulsar-client/_sidebar.md b/site2/website-next/docsify/latest/pulsar-client/_sidebar.md
index 8647c296c12..6a94239b1d2 100644
--- a/site2/website-next/docsify/latest/pulsar-client/_sidebar.md
+++ b/site2/website-next/docsify/latest/pulsar-client/_sidebar.md
@@ -1,2 +1,2 @@
-- CLI Configuration > `pulsar-client`
+- CLI Configuration > pulsar-client
     - [pulsar-client](pulsar-client/pulsar-client.md)
diff --git a/site2/website-next/docsify/latest/pulsar-perf/_sidebar.md b/site2/website-next/docsify/latest/pulsar-perf/_sidebar.md
index bf6635fdb67..499161c404c 100644
--- a/site2/website-next/docsify/latest/pulsar-perf/_sidebar.md
+++ b/site2/website-next/docsify/latest/pulsar-perf/_sidebar.md
@@ -1,2 +1,2 @@
-- CLI Configuration > `pulsar-perf`
+- CLI Configuration > pulsar-perf
     - [pulsar-perf](pulsar-perf/pulsar-perf.md)
diff --git a/site2/website-next/docsify/latest/pulsar/_sidebar.md b/site2/website-next/docsify/latest/pulsar/_sidebar.md
index fbee2170d57..fc05fd6f1f0 100644
--- a/site2/website-next/docsify/latest/pulsar/_sidebar.md
+++ b/site2/website-next/docsify/latest/pulsar/_sidebar.md
@@ -1,4 +1,4 @@
-- CLI Configuration > `pulsar`
+- CLI Configuration > pulsar
     - [broker](pulsar/broker.md)
     - [broker-tool](pulsar/broker-tool.md)
     - [compact-topic](pulsar/compact-topic.md)