fix: update styling of table of contents and side nav, also remove un…

…used readme (#860)

docs/.vuepress/styles/index.scss

@@ -1,4 +1,14 @@
-// place your custom styles here
+@use "sass:map";
+@import "palette.scss";
+
+$light-selector: 'html[data-theme="light"]';
+$dark-selector: 'html[data-theme="dark"]';
+$light-text: #fff;
+$dark-text: #2c3e50;
+$dark-background-color: #1d2536;
+$background-color: #fff;
+$border-color: #e5e7eb;
+
 :root {
     --pwa-popup-text-color: #2C3E50;
     --pwa-popup-bg-color: #ffffff;
@@ -77,14 +87,6 @@
         hyphens: none !important;
         text-align: inherit !important;
     }
-
-    [data-theme="dark"] #toc .toc-link {
-        color: #FFFFFFCC !important;
-    }
-
-    #toc .toc-link {
-        color: #2C3E50 !important;
-    }
 
     .sidebar {
         box-shadow: 0 0 0 0;
@@ -124,6 +126,7 @@
 
         .sidebar-link {
             font-size: 1rem !important;
+            padding-left: 2.5rem;
 
             &.active {
                 background: linear-gradient(90deg, rgba(23, 85, 244, 0), rgba(23, 85, 244, .3));
@@ -132,7 +135,17 @@
                 color:inherit
             }
         }
+
+        .sidebar-group .sidebar-group {
+            padding-left: 0.8em;
+        }
     }
+
+    // Direct links in the root of side nav should not be indented
+    .sidebar > .sidebar-links > li > .sidebar-link {
+        padding-left: 1.3rem;
+    }
+
     * {
         -webkit-font-smoothing: antialiased;
         -moz-osx-font-smoothing: grayscale;
@@ -187,13 +200,67 @@
         }
     }
 
+    // Table of Contents
     #toc {
-        padding: 0 9rem !important;
-    }
-
-    @media screen and (max-width: 1600px) {
-        #toc {
-            padding: 0 4rem !important;
+        padding: 0 0 0 2rem;
+        max-width: calc(50vw - 50% - 6rem); // Fill right-side of content
+
+        .toc-wrapper {
+            max-height: 68vh;
+        }
+
+        .toc-list::before {
+            background: map.get($text-color, "light");
+
+            [data-theme="dark"] & {
+                background: map.get($text-color, "dark");
+            }
+        }
+
+        .toc-link {
+            color: $dark-text;
+
+            [data-theme="dark"] & {
+                color: $light-text;
+            }
+
+            &.level2 {
+                font-weight: bold;
+            }
+
+            &.level3 {
+                padding-left: 12px;
+            }
+        }
+
+        .toc-item {
+            &::before {
+                transition: all 1s;
+            }
+
+            &.active {
+                .toc-link {
+                    font-weight: normal;
+                    color: map.get($theme-color, "light");
+
+                    [data-theme="dark"] & {
+                        color: map.get($theme-color, "dark");
+                    }
+
+                    &.level2 {
+                        font-weight: bold;
+                    }
+                }
+
+                &::before {
+                    content: "->";
+                    color: map.get($theme-color, "light");
+
+                    [data-theme="dark"] & {
+                        color: map.get($theme-color, "dark");
+                    }
+                }
+            }
         }
     }
 
@@ -257,16 +324,7 @@
         border-top: none !important;
     }
 
-    //Homepage Redesign
-    $light-selector: 'html[data-theme="light"]';
-    $dark-selector: 'html[data-theme="dark"]';
-
-    $light-text: #fff;
-    $dark-text: #2c3e50;
-    $dark-background-color: #1d2536;
-    $background-color: #fff;
-    $border-color: #e5e7eb;
-
+    //Homepage Redesign    
     [data-theme="dark"] a.title {
         color: $light-text !important;
     }

docs/build/quick-start/hello-world.md

@@ -717,5 +717,5 @@ After the transaction is processed, the page updates the balances and the new gr
 ### Learn More
 
 - For an overview of security and best practices for developing on zkSync Era, refer to the [Security and best practices page](./best-practices.md).
-- To learn more about `zksync-ethers` SDK, check out its [documentation](../../build/sdks/js/README.md).
+- To learn more about `zksync-ethers` SDK, check out its [documentation](../../build/sdks/js/zksync-ethers/getting-started.md).
 - To learn more about the zkSync hardhat plugins, check out their [documentation](../../build/tooling/hardhat/getting-started.md).

docs/build/tooling/hardhat/getting-started.md

@@ -313,4 +313,4 @@ The message now is Hello people!
 ## Learn more
 
 - To learn more about the zkSync Hardhat plugins check out the [plugins documentation](../hardhat/getting-started.md).
-- If you want to know more about how to interact with zkSync using Javascript, check out the [zksync-ethers Javascript SDK documentation](../../sdks/js/README.md) .
+- If you want to know more about how to interact with zkSync using Javascript, check out the [zksync-ethers Javascript SDK documentation](../../sdks/js/zksync-ethers/getting-started.md) .

docs/build/tutorials/smart-contract-development/account-abstraction/custom-aa-tutorial.md

@@ -1162,5 +1162,5 @@ If you get an error `Not enough balance to cover the fee.`, try increasing the a
 ## Learn More
 
 - To learn more about L1->L2 interaction on zkSync, check out the [documentation](../../../developer-reference/l1-l2-interop.md).
-- To learn more about the `zksync-ethers` SDK, check out its [documentation](../../../sdks/js/README.md).
+- To learn more about the `zksync-ethers` SDK, check out its [documentation](../../../sdks/js/zksync-ethers/getting-started.md).
 - To learn more about the zkSync Era Hardhat plugins, check out the [Hardhat documentation](../../../tooling/hardhat/getting-started.md).

docs/build/tutorials/smart-contract-development/account-abstraction/daily-spend-limit.md

@@ -1062,7 +1062,7 @@ Since `ONE_DAY` is set to 1 minute for this test in the `SpendLimit.sol` contrac
 ## Learn More
 
 - To find out more about L1->L2 interaction on zkSync Era, check out the [documentation](../../../developer-reference/l1-l2-interop.md).
-- To learn more about the zksync-ethers SDK, check out its [documentation](../../../sdks/js/README.md).
+- To learn more about the zksync-ethers SDK, check out its [documentation](../../../sdks/js/zksync-ethers/getting-started.md).
 - To learn more about the zkSync Era Hardhat plugins, check out their [documentation](../../../tooling/hardhat/getting-started.md).
 
 ## Credits

docs/build/tutorials/smart-contract-development/cross-chain-tutorial.md

@@ -646,5 +646,5 @@ The counter value is 1
 ## Learn More
 
 - To learn more about L1->L2 interaction on zkSync, check out the [documentation](../../developer-reference/l1-l2-interop.md).
-- To learn more about the `zksync-ethers` SDK, check out its [documentation](../../sdks/js/README.md).
+- To learn more about the `zksync-ethers` SDK, check out its [documentation](../../sdks/js/zksync-ethers/getting-started.md).
 - To learn more about the zkSync hardhat plugins, check out their [documentation](../../tooling/hardhat/getting-started.md).

docs/build/tutorials/smart-contract-development/paymasters/custom-paymaster-tutorial.md

@@ -542,5 +542,5 @@ The wallet had 3 tokens after running the deployment script and, after sending t
 ## Learn More
 
 - Learn more about [L1->L2 interaction on zkSync](../../../developer-reference/l1-l2-interop.md).
-- Learn more about [the `zksync-ethers` SDK](../../../sdks/js/README.md).
+- Learn more about [the `zksync-ethers` SDK](../../../sdks/js/zksync-ethers/getting-started.md).
 - Learn more about [the zkSync hardhat plugins](../../../tooling/hardhat/getting-started.md).