Change the button location

	new file:   _resourcepdf/overrides/partials/toc.html
	modified:   docs/css/extra.css
	modified:   mkdocs-base.yml

Author: alina-derkach-oaza

_resourcepdf/overrides/partials/toc.html

@@ -0,0 +1,23 @@
+{% if page.toc %}
+<nav class="md-nav md-nav--secondary">
+  <label class="md-nav__title" for="__toc">Table of contents</label>
+  <ul class="md-nav__list" data-md-scrollfix>
+    {% for toc_item in page.toc %}
+      {% include "partials/toc-item.html" with context %}
+    {% endfor %}
+  </ul>
+
+  {# Edit this page link below the TOC #}
+  {% if page.edit_url %}
+  <div class="md-source-file">
+<a href="{{ page.edit_url }}" title="Improve this page" class="edit-page-box">
+  <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>
+  {% endif %}
+</nav>
+{% endif %}

docs/css/extra.css

@@ -11,40 +11,40 @@
     line-height: 1.6;
 }
 
-.md-content__button.md-icon {
-  color: #127ae8 !important;  /* Example: deep orange */
+.edit-page-icon svg {
+  width: 1.7em;
+  height: 1.7em;
+  margin-right: 0.4em;
+  fill: currentColor; /* Makes icon match text color */
 }
 
-/* Optional: hover effect */
-.md-content__button.md-icon:hover {
-  color: #439eff !important;
-}
-
-.md-content__button.md-icon svg {
-  width: 34px;
-  height: 34px;
-}
-
-.md-content__button.md-icon[href*="/edit/"] {
-  display: inline-flex;          /* make the button a flex container */
-  flex-direction: column;        /* stack children vertically */
-  align-items: center;           /* center them horizontally */
-  margin-top: -4px;
-}
-
-.md-content__button.md-icon[href*="/edit/"] svg {
-  width: 34px;
-  height: 34px;
+.edit-page-box {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  padding: 0.5em 1em;
+  min-width: 260px;
+  border: 2px solid #127ae8;
+  border-radius: 6px;
+  font-weight: bold;
+  font-size: 1.1em;
+  color: #127ae8;
+  background-color: transparent;
+  text-decoration: none;
+  min-width: 250px;
+  transition: 
+    background-color 0.25s ease,
+    color 0.25s ease,
+    transform 0.2s ease,
+    box-shadow 0.2s ease;
+  margin-top: 1rem;
+  cursor: pointer;
 }
 
-.md-content__button.md-icon[href*="/edit/"]::after {
-  content: "Improve this page";
-  margin-top: 2px;
-  font-size: 0.7rem;
-  color: #2C323E;
-  text-align: center;
-  display: block;
-  width: 100%;
-  font-weight: bold;
+.edit-page-box:hover {
+  background-color: #439eff;
+  color: white;
+  transform: translateY(-2px); 
+  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); 
 }
 

mkdocs-base.yml

@@ -51,8 +51,8 @@ theme:
     - navigation.indexes
     - content.tooltips
     - content.tabs.link
-    - content.action.edit
-#    - content.action.view
+#    - content.action.edit
+    - content.action.view
     - content.code.copy
     - content.code.annotate
     - toc.follow