Merge pull request #48 from starknet-io/toolbar-refactor2

Refactored toolbar
starknet-io · Nov 12, 2024 · 0e3fbe2 · 0e3fbe2
2 parents e797661 + 5f4b29f
commit 0e3fbe2
Show file tree

Hide file tree

Showing 9 changed files with 45 additions and 13 deletions.
diff --git a/build/ui-bundle.zip b/build/ui-bundle.zip
diff --git a/src/css/breadcrumbs.css b/src/css/breadcrumbs.css
@@ -1,7 +1,7 @@
 .breadcrumbs {
   display: none;
   flex: 1 1;
-  padding: 0 0.5rem 0 0.75rem;
+  padding-right: 0.5rem;
   line-height: var(--nav-line-height);
   color: var(--breadcrumbs-font-color);
 }
@@ -29,7 +29,7 @@ a + .breadcrumbs {
   margin: 0;
 }
 
-.breadcrumbs li::after {
+.breadcrumbs li::before {
   content: "/";
   padding: 0 0.5rem;
 }

diff --git a/src/css/extensions/custom-dark.css b/src/css/extensions/custom-dark.css
@@ -87,9 +87,10 @@
 } */
 
 .pencil {
-  /*
-  background-image: url(../img/pencil-filled.svg);
-  */
+  fill: var(--color-athens-white);
+}
+
+.heart {
   fill: var(--color-athens-white);
 }
 

diff --git a/src/css/extensions/custom.css b/src/css/extensions/custom.css
@@ -246,8 +246,17 @@
   background-repeat: no-repeat;
   height: 1rem;
   width: 1rem;
+  padding: 0 0.75rem;
+  vertical-align: text-bottom;
+}
+
+.heart {
+  background-image: url(../img/heart.svg);
+  background-repeat: no-repeat;
+  height: 1rem;
+  width: 1rem;
   padding: 0 1em;
-  vertical-align: middle;
+  vertical-align: text-bottom;
 }
 
 .navbar-end .navbar-item .navbar-dropdown {
@@ -274,7 +283,7 @@
 }
 
 .edit-this-page:hover a {
-  color: var(--color-ultramarine-blue);
+  /* color: var(--color-ultramarine-blue); */
   text-decoration: none;
 }
 

diff --git a/src/css/toolbar.css b/src/css/toolbar.css
@@ -66,6 +66,7 @@
 @media screen and (min-width: 1024px) {
   .home-link {
     margin: calc(var(--toolbar-height) / 4);
+    margin-right: 0
   }
   .edit-this-page {
     display: block;

diff --git a/src/img/heart.svg b/src/img/heart.svg
diff --git a/src/js/vendor/custom.js b/src/js/vendor/custom.js
@@ -14,7 +14,7 @@
   }
 
   for (var i = 0; i < images.length; i++) {
-    if (!(images[i].classList.contains('copy-icon') || images[i].classList.contains('pencil') || hasParentClass(images[i],'overview-box'))){
+    if (!(images[i].classList.contains('copy-icon') || images[i].classList.contains('pencil') || images[i].classList.contains('heart') || hasParentClass(images[i],'overview-box'))){
       images[i].setAttribute('data-zoomable', 'true')
     }
   }

diff --git a/src/partials/breadcrumbs.hbs b/src/partials/breadcrumbs.hbs
@@ -1,11 +1,11 @@
 <nav class="breadcrumbs" aria-label="breadcrumbs">
   {{#if page.breadcrumbs}}
   <ul>
-    {{#with page.componentVersion}}
+    {{!-- {{#with page.componentVersion}}
     {{#if (and ./title (ne ./title @root.page.breadcrumbs.0.content))}}
     <li><a href="{{{relativize ./url}}}">{{{./title}}}</a></li>
     {{/if}}
-    {{/with}}
+    {{/with}} --}}
     {{#each page.breadcrumbs}}
     <li>
     {{~#if (and ./url (eq ./urlType 'internal'))~}}

diff --git a/src/partials/toolbar.hbs b/src/partials/toolbar.hbs
@@ -1,10 +1,10 @@
 <div class="toolbar" role="navigation">
   {{!-- {{> nav-toggle}} --}}
-  <div class="components-versions desktop-only">
+  {{!-- <div class="components-versions desktop-only"> --}}
     {{!-- {{> top-components}}
     <span></span>
     {{> page-versions}} --}}
-  </div>
+  {{!-- </div> --}}
   <span></span>
   <span></span>
   {{#with site.homeUrl}}
@@ -18,6 +18,9 @@
     </div>
   {{/if}}
   <div class="edit-this-page">
-    <a href="{{page.editUrl}}"><img class="pencil">Edit this Page</a>
+    <a href='https://github.com/starknet-io/starknet-docs/issues/new?assignees=landauraz&title=Feedback for "{{page.title}}"' target="_blank"><img class="heart">Share feedback</a>
+  </div>
+  <div class="edit-this-page">
+    <a href="{{page.editUrl}}" target="_blank"><img class="pencil">Edit content</a>
   </div>
 </div>