Changing from the button into a banner

	modified:   _resourcepdf/overrides/main.html
	new file:   _resourcepdf/overrides/partials/edit.html
	deleted:    _resourcepdf/overrides/partials/toc.html
	modified:   docs/css/extra.css

Author: alina-derkach-oaza

_resourcepdf/overrides/main.html

@@ -52,6 +52,9 @@
                     <div class="md-sidebar__inner">
                       {% include "partials/toc.html" %}
                     </div>
+                    <div class="md-sidebar__inner">
+                      {% include "partials/edit.html" %}
+                    </div>
                     <div class="md-sidebar__inner">
                       {% include "partials/banner.html" %}
                     </div>

_resourcepdf/overrides/partials/edit.html

@@ -0,0 +1,11 @@
+<div data-banner="data-banner">
+  <div class="actions">
+    <a href="{{ page.edit_url }}" title="Improve this page" class="edit-page-link">
+      <span class="edit-page-icon">
+        {% set icon = config.theme.icon.edit or "material/file-edit-outline" %}
+        {% include ".icons/" ~ icon ~ ".svg" %}
+      </span>
+      <span class="edit-page-text">Improve this page</span>
+    </a>
+  </div>
+</div>

_resourcepdf/overrides/partials/toc.html

@@ -11,40 +11,24 @@
     line-height: 1.6;
 }
 
-.edit-page-icon svg {
-  width: 1.7em;
-  height: 1.7em;
-  margin-right: 0.4em;
-  fill: currentColor;
-}
-
-.edit-page-box {            
-  display: flex;
+/* Style the link */
+.edit-page-link {
+  display: inline-flex;
   align-items: center;
-  justify-content: center;
-  padding: 0.5em 1em;
-  border: 2px solid #127ae8;
-  border-radius: 6px;
-  font-weight: bold;
-  font-size: 1.1em;
-  color: #127ae8;
-  background-color: transparent;
+  gap: 0.6em;
   text-decoration: none;
-  width: 100%;
-  max-width: 100%;
-  transition:
-    background-color 0.25s ease,
-    color 0.25s ease,
-    transform 0.2s ease,
-    box-shadow 0.2s ease;
-  margin-top: 0rem;
+  color: var(--md-typeset-a-color);
+  font-size: 1.25rem;
+  font-weight: 500;
+  line-height: 1.4;
+  transition: color 0.2s ease;
   cursor: pointer;
 }
 
-.edit-page-box:hover {
-  background-color: transparent;
-  color: #439eff;
-  transform: translateY(-2px); 
-  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); 
-}
-                
+/* Bigger icon, aligned with text */
+.edit-page-icon svg {
+  width: 1.4em;    
+  height: 1.4em;
+  fill: currentColor;
+  vertical-align: middle;
+}