Merge pull request #50 from starknet-io/various-improvements

Various improvements
starknet-io · Dec 18, 2024 · 4506173 · 4506173
2 parents 2c2406f + def4d19
commit 4506173
Show file tree

Hide file tree

Showing 17 changed files with 79 additions and 50 deletions.
diff --git a/build/ui-bundle.zip b/build/ui-bundle.zip
diff --git a/preview-src/ui-model.yml b/preview-src/ui-model.yml
@@ -136,3 +136,15 @@ page:
       - content: Some Code
         url: '/xyz/5.2/index.html#some-code'
         urlType: internal
+    - content: Test
+      items:
+      - content: Test1
+      - content: Test2
+      - content: Test3
+      - content: Test4
+      - content: Test5
+      - content: Test6
+      - content: Test7
+      - content: Test8
+      - content: Test9
+      - content: Test10
diff --git a/src/css/extensions/algolia/overrides.css b/src/css/extensions/algolia/overrides.css
@@ -331,4 +331,10 @@
       width: min(484px, 50%);
   }
 }
+
+@media screen and (max-width: 680px) {
+  .autocomplete-root {
+      display: none;
+  }
+}
 
diff --git a/src/css/extensions/custom-dark.css b/src/css/extensions/custom-dark.css
@@ -73,7 +73,7 @@
 .theme-toggle:hover {
   /* background-image: url(../img/moon-filled.svg);
   fill: var(--color-athens-white); */
-  background-color: rgb(37, 45, 59);
+  /* background-color: rgb(37, 45, 59); */
 }
 
 .nav-toggle {
@@ -143,10 +143,6 @@
   background-color: var(--color-second-blue);
 } */
 
-footer.footer {
-  border-top: 1px solid var(--divider-line-color);
-}
-
 .doc details {
   border: 1px solid var(--color-second-blue);
 }

diff --git a/src/css/extensions/custom-light.css b/src/css/extensions/custom-light.css
@@ -66,7 +66,7 @@
 
 .theme-toggle:hover {
   /* background-image: url(../img/moon-filled.svg); */
-  background-color: #f3f8fb;
+  /* background-color: #f3f8fb; */
 }
 
 .nav-toggle {
@@ -119,10 +119,6 @@ pre {
   padding: 0px;
 }
 
-footer.footer {
-  border-top: 1px solid var(--divider-line-color);
-}
-
 .doc details {
   border: 1px solid var(--color-platinum-gray);
 }

diff --git a/src/css/extensions/custom.css b/src/css/extensions/custom.css
@@ -246,8 +246,9 @@
   background-repeat: no-repeat;
   height: 1rem;
   width: 1rem;
-  padding: 0 0.75rem;
+  padding: 0 0.9rem;
   vertical-align: text-bottom;
+  fill: var(--toc-heading-font-color);
 }
 
 .heart {
@@ -257,6 +258,7 @@
   width: 1rem;
   padding: 0 1em;
   vertical-align: text-bottom;
+  fill: var(--toc-heading-font-color);
 }
 
 .navbar-end .navbar-item .navbar-dropdown {
@@ -347,15 +349,15 @@
 }
 
 footer .footerdiv {
-  padding: 1rem 2rem;
+  padding: 0 2rem;
   display: flex;
-  flex: auto;
   justify-content: space-between;
 }
 
 footer.footer {
   display: flex;
   padding: unset;
+  justify-content: center;
 }
 
 .community_icons {
@@ -367,7 +369,6 @@ footer.footer {
 
 .footer_icon {
   display: flex;
-  padding: 0 0 0 1.5rem;
   height: 1.25rem;
   background-size: 1.25rem;
   background-repeat: no-repeat;

diff --git a/src/css/extensions/dark-vars.css b/src/css/extensions/dark-vars.css
@@ -48,7 +48,7 @@
   --footer-background: #0b0b0b;
   --footer-font-color: var(--color-gray-60);
   --footer-link-font-color: var(--color-gray-60);
-  --footer-icon-color: var(--color-silver-gray);
+  --footer-icon-color: var(--color-athens-white);
   /* doc body */
   --doc-font-color: var(--color-silver-gray);
   --doc-link-color: #AFCAFF;

diff --git a/src/css/footer.css b/src/css/footer.css
@@ -1,13 +1,17 @@
 footer.footer {
-  background-color: var(--footer-background);
+  background-color: var(--body-background);
   color: var(--footer-font-color);
-  font-size: calc(15 / var(--rem-base) * 1rem);
+  font-size: calc(12.5 / var(--rem-base) * 1rem);
   line-height: var(--footer-line-height);
   padding: 1.5rem;
 }
 
 .footer p {
   margin: 0px;
+  text-align: center;
+  border-top: 1px solid var(--divider-line-color);
+  padding-top: 1rem;
+  width: calc(var(--nav-width) * 0.75)
 }
 
 .footer a {

diff --git a/src/css/header.css b/src/css/header.css
@@ -15,6 +15,7 @@ body {
   top: 0;
   width: 100%;
   z-index: var(--z-index-navbar);
+  border-bottom: 1px solid var(--divider-line-color);
 }
 
 .navbar a {

diff --git a/src/css/nav.css b/src/css/nav.css
@@ -66,10 +66,10 @@
 
 @media screen and (min-width: 1024px) {
   .nav {
-    top: calc(var(--navbar-height) + var(--toolbar-height));
+    top: calc(var(--navbar-height));
     box-shadow: none;
     position: sticky;
-    height: calc(var(--nav-height--desktop));
+    height: calc(100vh - 5rem);
   }
   .nav-panel-menu {
     overflow-y: auto;
@@ -80,7 +80,7 @@
 .nav .panels {
   display: flex;
   flex-direction: column;
-  height: inherit;
+  height: calc(100vh - 10rem);
 }
 
 html.is-clipped--nav {

diff --git a/src/css/toc.css b/src/css/toc.css
@@ -25,15 +25,13 @@ aside.toc.embedded {
   font-weight: 700;
   line-height: 1.3;
   margin: 0;
-  padding-left: 1rem;
   padding-bottom: 0.5rem;
-  text-transform: uppercase;
 }
 
 .toc.sidebar .toc-menu h3 {
   display: flex;
   flex-direction: column;
-  height: 4rem;
+  height: 3.5rem;
   justify-content: flex-end;
 }
 
@@ -127,3 +125,12 @@ aside.toc.embedded {
 .toc .toc-menu .is-hidden-toc {
   display: none !important;
 }
+
+.toc .edit-this-page a {
+  color: var(--toc-heading-font-color);
+  font-size: 0.875rem;
+  font-weight: 700;
+  line-height: 1.3;
+  margin: 0;
+  padding-bottom: 0.5rem;
+}
diff --git a/src/css/vars.css b/src/css/vars.css
@@ -124,7 +124,7 @@ Leaving this here for now for historical purposes. */
   --nav-panel-menu-height: calc(100% - var(--drawer-height));
   --nav-panel-explore-height: calc(50% + var(--drawer-height));
   --nav-width: calc(270 / var(--rem-base) * 1rem);
-  --toc-top: calc(var(--body-top) + var(--toolbar-height));
+  --toc-top: calc(var(--body-top) + 4.5rem);
   --toc-height: calc(100vh - var(--toc-top) - 2.5rem);
   --toc-width: 12rem;
   --toc-width--widescreen: 15rem;

diff --git a/src/partials/footer-content.hbs b/src/partials/footer-content.hbs
@@ -1,28 +1,7 @@
 <footer class="footer">
   <div class="footerdiv">
     <div class="footer-left">
-      {{!-- <a href="{{{or siteRootPath site.url}}}" class="starknet-logo desktop-only"></a>
-      <div class="vertical-divider desktop-only"></div> --}}
-      <p>Built with ✨ by the Starknet community</p>
-    </div>
-    {{!-- <div class="footer-network-info">{{> starknet_version}}</div> --}}
-    <!-- <div class="community-section">
-      <p class="community-section__text">Follow Lisk on: </p>
-      <div class="community-section__icons"> -->
-    <div class="community_icons">
-        <a href="https://twitter.com/@Starknet" title="Twitter" target="_blank" class="footer_icon">
-          <svg stroke="currentColor" fill="currentColor" stroke-width="0" role="img" viewBox="0 0 24 24" font-size="1.25rem" aria-hidden="true" focusable="false" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><title></title><path d="M23.953 4.57a10 10 0 01-2.825.775 4.958 4.958 0 002.163-2.723c-.951.555-2.005.959-3.127 1.184a4.92 4.92 0 00-8.384 4.482C7.69 8.095 4.067 6.13 1.64 3.162a4.822 4.822 0 00-.666 2.475c0 1.71.87 3.213 2.188 4.096a4.904 4.904 0 01-2.228-.616v.06a4.923 4.923 0 003.946 4.827 4.996 4.996 0 01-2.212.085 4.936 4.936 0 004.604 3.417 9.867 9.867 0 01-6.102 2.105c-.39 0-.779-.023-1.17-.067a13.995 13.995 0 007.557 2.209c9.053 0 13.998-7.496 13.998-13.985 0-.21 0-.42-.015-.63A9.935 9.935 0 0024 4.59z"></path></svg>
-          <p>Twitter</p>
-        </a>
-        <a href="https://starknet.io/discord" title="Discord" target="_blank" class="footer_icon">
-          <svg stroke="currentColor" fill="currentColor" stroke-width="0" role="img" viewBox="0 0 24 24" font-size="1.25rem" aria-hidden="true" focusable="false" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><title></title><path d="M20.317 4.3698a19.7913 19.7913 0 00-4.8851-1.5152.0741.0741 0 00-.0785.0371c-.211.3753-.4447.8648-.6083 1.2495-1.8447-.2762-3.68-.2762-5.4868 0-.1636-.3933-.4058-.8742-.6177-1.2495a.077.077 0 00-.0785-.037 19.7363 19.7363 0 00-4.8852 1.515.0699.0699 0 00-.0321.0277C.5334 9.0458-.319 13.5799.0992 18.0578a.0824.0824 0 00.0312.0561c2.0528 1.5076 4.0413 2.4228 5.9929 3.0294a.0777.0777 0 00.0842-.0276c.4616-.6304.8731-1.2952 1.226-1.9942a.076.076 0 00-.0416-.1057c-.6528-.2476-1.2743-.5495-1.8722-.8923a.077.077 0 01-.0076-.1277c.1258-.0943.2517-.1923.3718-.2914a.0743.0743 0 01.0776-.0105c3.9278 1.7933 8.18 1.7933 12.0614 0a.0739.0739 0 01.0785.0095c.1202.099.246.1981.3728.2924a.077.077 0 01-.0066.1276 12.2986 12.2986 0 01-1.873.8914.0766.0766 0 00-.0407.1067c.3604.698.7719 1.3628 1.225 1.9932a.076.076 0 00.0842.0286c1.961-.6067 3.9495-1.5219 6.0023-3.0294a.077.077 0 00.0313-.0552c.5004-5.177-.8382-9.6739-3.5485-13.6604a.061.061 0 00-.0312-.0286zM8.02 15.3312c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9555-2.4189 2.157-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.9555 2.4189-2.1569 2.4189zm7.9748 0c-1.1825 0-2.1569-1.0857-2.1569-2.419 0-1.3332.9554-2.4189 2.1569-2.4189 1.2108 0 2.1757 1.0952 2.1568 2.419 0 1.3332-.946 2.4189-2.1568 2.4189Z"></path></svg>
-          <p>Discord</p>
-        </a>
-        <a href="https://github.com/starknet-io/starknet-docs" title="GitHub" target="_blank" class="footer_icon">
-          <svg stroke="currentColor" fill="currentColor" stroke-width="0" role="img" viewBox="0 0 24 24" font-size="1.25rem" aria-hidden="true" focusable="false" height="1em" width="1em" xmlns="http://www.w3.org/2000/svg"><title></title><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"></path></svg>
-          <p>GitHub</p>
-        </a>
-  <!--    </div> -->
+      <p>Built with ✨<br>By the Starknet Community</p>
     </div>
   </div>
 </footer>
diff --git a/src/partials/header-content.hbs b/src/partials/header-content.hbs
@@ -27,7 +27,25 @@
 
     <div id="topbar-nav" class="navbar-menu">
       <div class="navbar-end">
+        <div class-name="navbar-item">
+          <a href="https://twitter.com/@Starknet" title="Twitter" target="_blank" class="footer_icon">
+<svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="22.5" height="22.5" viewBox="0 0 32 32">
+<path d="M 4.0175781 4 L 13.091797 17.609375 L 4.3359375 28 L 6.9511719 28 L 14.246094 19.34375 L 20.017578 28 L 20.552734 28 L 28.015625 28 L 18.712891 14.042969 L 27.175781 4 L 24.560547 4 L 17.558594 12.310547 L 12.017578 4 L 4.0175781 4 z M 7.7558594 6 L 10.947266 6 L 24.279297 26 L 21.087891 26 L 7.7558594 6 z"></path>
+</svg>          </a>
+        </div>
+        <div class="navbar-item" style="margin:0 10px">
+          <a href="https://starknet.io/discord" title="Discord" target="_blank" class="footer_icon">
+            <svg xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" width="30" height="30" viewBox="0 0 50 50">
+              <path d="M 18.90625 7 C 18.90625 7 12.539063 7.4375 8.375 10.78125 C 8.355469 10.789063 8.332031 10.800781 8.3125 10.8125 C 7.589844 11.480469 7.046875 12.515625 6.375 14 C 5.703125 15.484375 4.992188 17.394531 4.34375 19.53125 C 3.050781 23.808594 2 29.058594 2 34 C 1.996094 34.175781 2.039063 34.347656 2.125 34.5 C 3.585938 37.066406 6.273438 38.617188 8.78125 39.59375 C 11.289063 40.570313 13.605469 40.960938 14.78125 41 C 15.113281 41.011719 15.429688 40.859375 15.625 40.59375 L 18.0625 37.21875 C 20.027344 37.683594 22.332031 38 25 38 C 27.667969 38 29.972656 37.683594 31.9375 37.21875 L 34.375 40.59375 C 34.570313 40.859375 34.886719 41.011719 35.21875 41 C 36.394531 40.960938 38.710938 40.570313 41.21875 39.59375 C 43.726563 38.617188 46.414063 37.066406 47.875 34.5 C 47.960938 34.347656 48.003906 34.175781 48 34 C 48 29.058594 46.949219 23.808594 45.65625 19.53125 C 45.007813 17.394531 44.296875 15.484375 43.625 14 C 42.953125 12.515625 42.410156 11.480469 41.6875 10.8125 C 41.667969 10.800781 41.644531 10.789063 41.625 10.78125 C 37.460938 7.4375 31.09375 7 31.09375 7 C 31.019531 6.992188 30.949219 6.992188 30.875 7 C 30.527344 7.046875 30.234375 7.273438 30.09375 7.59375 C 30.09375 7.59375 29.753906 8.339844 29.53125 9.40625 C 27.582031 9.09375 25.941406 9 25 9 C 24.058594 9 22.417969 9.09375 20.46875 9.40625 C 20.246094 8.339844 19.90625 7.59375 19.90625 7.59375 C 19.734375 7.203125 19.332031 6.964844 18.90625 7 Z M 18.28125 9.15625 C 18.355469 9.359375 18.40625 9.550781 18.46875 9.78125 C 16.214844 10.304688 13.746094 11.160156 11.4375 12.59375 C 11.074219 12.746094 10.835938 13.097656 10.824219 13.492188 C 10.816406 13.882813 11.039063 14.246094 11.390625 14.417969 C 11.746094 14.585938 12.167969 14.535156 12.46875 14.28125 C 17.101563 11.410156 22.996094 11 25 11 C 27.003906 11 32.898438 11.410156 37.53125 14.28125 C 37.832031 14.535156 38.253906 14.585938 38.609375 14.417969 C 38.960938 14.246094 39.183594 13.882813 39.175781 13.492188 C 39.164063 13.097656 38.925781 12.746094 38.5625 12.59375 C 36.253906 11.160156 33.785156 10.304688 31.53125 9.78125 C 31.59375 9.550781 31.644531 9.359375 31.71875 9.15625 C 32.859375 9.296875 37.292969 9.894531 40.3125 12.28125 C 40.507813 12.460938 41.1875 13.460938 41.8125 14.84375 C 42.4375 16.226563 43.09375 18.027344 43.71875 20.09375 C 44.9375 24.125 45.921875 29.097656 45.96875 33.65625 C 44.832031 35.496094 42.699219 36.863281 40.5 37.71875 C 38.5 38.496094 36.632813 38.84375 35.65625 38.9375 L 33.96875 36.65625 C 34.828125 36.378906 35.601563 36.078125 36.28125 35.78125 C 38.804688 34.671875 40.15625 33.5 40.15625 33.5 C 40.570313 33.128906 40.605469 32.492188 40.234375 32.078125 C 39.863281 31.664063 39.226563 31.628906 38.8125 32 C 38.8125 32 37.765625 32.957031 35.46875 33.96875 C 34.625 34.339844 33.601563 34.707031 32.4375 35.03125 C 32.167969 35 31.898438 35.078125 31.6875 35.25 C 29.824219 35.703125 27.609375 36 25 36 C 22.371094 36 20.152344 35.675781 18.28125 35.21875 C 18.070313 35.078125 17.8125 35.019531 17.5625 35.0625 C 16.394531 34.738281 15.378906 34.339844 14.53125 33.96875 C 12.234375 32.957031 11.1875 32 11.1875 32 C 10.960938 31.789063 10.648438 31.699219 10.34375 31.75 C 9.957031 31.808594 9.636719 32.085938 9.53125 32.464844 C 9.421875 32.839844 9.546875 33.246094 9.84375 33.5 C 9.84375 33.5 11.195313 34.671875 13.71875 35.78125 C 14.398438 36.078125 15.171875 36.378906 16.03125 36.65625 L 14.34375 38.9375 C 13.367188 38.84375 11.5 38.496094 9.5 37.71875 C 7.300781 36.863281 5.167969 35.496094 4.03125 33.65625 C 4.078125 29.097656 5.0625 24.125 6.28125 20.09375 C 6.90625 18.027344 7.5625 16.226563 8.1875 14.84375 C 8.8125 13.460938 9.492188 12.460938 9.6875 12.28125 C 12.707031 9.894531 17.140625 9.296875 18.28125 9.15625 Z M 18.5 21 C 15.949219 21 14 23.316406 14 26 C 14 28.683594 15.949219 31 18.5 31 C 21.050781 31 23 28.683594 23 26 C 23 23.316406 21.050781 21 18.5 21 Z M 31.5 21 C 28.949219 21 27 23.316406 27 26 C 27 28.683594 28.949219 31 31.5 31 C 34.050781 31 36 28.683594 36 26 C 36 23.316406 34.050781 21 31.5 21 Z M 18.5 23 C 19.816406 23 21 24.265625 21 26 C 21 27.734375 19.816406 29 18.5 29 C 17.183594 29 16 27.734375 16 26 C 16 24.265625 17.183594 23 18.5 23 Z M 31.5 23 C 32.816406 23 34 24.265625 34 26 C 34 27.734375 32.816406 29 31.5 29 C 30.183594 29 29 27.734375 29 26 C 29 24.265625 30.183594 23 31.5 23 Z"></path>
+            </svg>
+          </a>
+        </div>
         <div class="navbar-item">
+          <a href="https://github.com/starknet-io/starknet-docs" title="GitHub" target="_blank" class="footer_icon">
+            <svg width="25" height="25" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><g id="SVGRepo_bgCarrier" stroke-width="0"></g><g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"></g><g id="SVGRepo_iconCarrier"><path d="M21.035 5.257c.91 1.092 1.364 2.366 1.364 3.822 0 5.277-3.002 6.824-5.823 7.279.364.637.455 1.365.455 2.093v3.73c0 .455-.273.728-.637.728a.718.718 0 0 1-.728-.728v-3.73a2.497 2.497 0 0 0-.728-2.093l.455-1.183c2.821-.364 5.733-1.274 5.733-6.187 0-1.183-.455-2.275-1.274-3.185l-.182-.727a4.04 4.04 0 0 0 .09-2.73c-.454.09-1.364.273-2.91 1.365l-.547.09a13.307 13.307 0 0 0-6.55 0l-.547-.09C7.57 2.71 6.66 2.437 6.204 2.437c-.273.91-.273 1.91.09 2.73l-.181.727c-.91.91-1.365 2.093-1.365 3.185 0 4.822 2.73 5.823 5.732 6.187l.364 1.183c-.546.546-.819 1.274-.728 2.002v3.821a.718.718 0 0 1-.728.728.718.718 0 0 1-.728-.728V20.18c-3.002.637-4.185-.91-5.095-2.092-.455-.546-.819-1.001-1.274-1.092-.09-.091-.364-.455-.273-.819.091-.364.455-.637.82-.455.91.182 1.455.91 2 1.547.82 1.092 1.639 2.092 4.095 1.547v-.364c-.09-.728.091-1.456.455-2.093-2.73-.546-5.914-2.093-5.914-7.279 0-1.456.455-2.73 1.365-3.822-.273-1.273-.182-2.638.273-3.73l.455-.364C5.749 1.073 7.023.8 9.66 2.437a13.673 13.673 0 0 1 6.642 0C18.851.708 20.216.98 20.398 1.072l.455.364c.455 1.274.546 2.548.182 3.821z"></path></g></svg>
+          </a>        
+      </div>
+        {{!-- <div class="navbar-item">
           <a class="navbar-link" href="https://starknet.io/" target="_blank">Starknet Home</a>
         </div>
         <div class="navbar-item">
@@ -41,7 +59,7 @@
         </div>
         <div class="navbar-item">
           <a class="navbar-link" href="https://github.com/starknet-io/starknet-docs" target="_blank">GitHub</a>
-        </div>
+        </div> --}}
         <div class="theme-toggle-container">
           <button onclick="switch_style('toggle')" id="theme-toggle" class="theme-toggle navbar-item"></button>
         </div>

diff --git a/src/partials/header.hbs b/src/partials/header.hbs
@@ -1,4 +1,4 @@
 {{> header-scripts}}
 {{> header-content}}
-{{> toolbar}}
+{{!-- {{> toolbar}} --}}
 {{!-- {{> banner}} --}}
diff --git a/src/partials/nav.hbs b/src/partials/nav.hbs
@@ -1,8 +1,9 @@
 <div class="nav-container"{{#if page.component}} data-component="{{page.component.name}}" data-version="{{page.version}}"{{/if}}>
   <aside class="nav">
     <div class="panels">
-{{> nav-menu}}
+    {{> nav-menu}}
 {{!-- {{> nav-explore}} --}}
     </div>
+    {{> footer-content}}
   </aside>
 </div>
diff --git a/src/partials/toc.hbs b/src/partials/toc.hbs
@@ -1,3 +1,11 @@
-<aside class="toc sidebar" data-title="{{{or page.attributes.toctitle 'Contents'}}}" data-levels="{{{or page.attributes.toclevels 2}}}">
+<aside class="toc sidebar" data-title="{{{or page.attributes.toctitle 'Table of Contents'}}}" data-levels="{{{or page.attributes.toclevels 2}}}">
+  <div style="position:sticky;top:7rem;z-index:2;margin-bottom:1rem">
+    <div class="edit-this-page">
+      <a href="{{page.editUrl}}" target="_blank">✏️&nbsp;&nbsp;Edit page</a>
+    </div>
+    <div class="edit-this-page">
+      <a href='https://github.com/starknet-io/starknet-docs/issues/new?assignees=landauraz&title=Feedback for "{{page.title}}"' target="_blank">❤️&nbsp;&nbsp;Share feedback</a>
+    </div>
+  </div>
   <div class="toc-menu"></div>
 </aside>