From 42241e25fbbb9bbfac6feff433f7270c68d690f9 Mon Sep 17 00:00:00 2001
From: Daizu <daizutabi@gmail.com>
Date: Thu, 19 Sep 2024 23:32:09 +0000
Subject: [PATCH 1/2] Update template

---
 src/mkapi/templates/object.jinja2 | 9 ++++++---
 1 file changed, 6 insertions(+), 3 deletions(-)

diff --git a/src/mkapi/templates/object.jinja2 b/src/mkapi/templates/object.jinja2
index a66d1c43..c0417404 100644
--- a/src/mkapi/templates/object.jinja2
+++ b/src/mkapi/templates/object.jinja2
@@ -1,14 +1,17 @@
 <p class="mkapi-object mkapi-page-{{ namespace }}" id="{{ id }}" markdown="1">
 <span class="mkapi-object-link">
 [{{ namespace }}][__mkapi__.__{{ namespace }}__.{{ obj_id }}]
+{% if parent -%}
+<span class="mkapi-parent-toggle" title="Toggle class names">
+<i class="fa-regular fa-square-minus"></i>
+</span>
+{%- endif %}
 <span class="mkapi-document-toggle" title="Toggle all docs">
 <i class="fa-regular fa-square-minus"></i>
 </span>
 </span>
 {%- if kind  -%}
-<span class="mkapi-object-kind{% if parent %} mkapi-parent-toggle{% endif %}"
-{%- if parent %} title="Toggle class names"{% endif -%}
->{{ kind }}</span>
+<span class="mkapi-object-kind">{{ kind }}</span>
 {%- endif %}
 {% if parent -%}
 <span class="mkapi-object-parent">

From 2cfd5ae6d2ffd22e8d28c563e502bb1829876999 Mon Sep 17 00:00:00 2001
From: Daizu <daizutabi@gmail.com>
Date: Thu, 19 Sep 2024 23:47:54 +0000
Subject: [PATCH 2/2] Add toggle buttons to show/hide class names

---
 docs/usage/object.md              |  6 ++++--
 src/mkapi/css/mkapi-common.css    |  5 +----
 src/mkapi/javascript/mkapi.js     | 10 ++++++++++
 src/mkapi/templates/object.jinja2 |  4 ++--
 4 files changed, 17 insertions(+), 8 deletions(-)

diff --git a/docs/usage/object.md b/docs/usage/object.md
index a33cbb23..77a5bcf7 100644
--- a/docs/usage/object.md
+++ b/docs/usage/object.md
@@ -207,8 +207,10 @@ by its qualified name.
 The heading of a method's documentation
 contains a tooltip displaying the full name of the method
 along with the class to which the method belongs.
-You can also click the prefix *method* to display the
-qualified names of all methods on the current page.
+You can also click the
+<i class="fa-solid fa-square-plus"></i>
+button to display the qualified names of all methods
+on the current page.
 
 ## Source Code
 
diff --git a/src/mkapi/css/mkapi-common.css b/src/mkapi/css/mkapi-common.css
index 644ad701..787885f7 100644
--- a/src/mkapi/css/mkapi-common.css
+++ b/src/mkapi/css/mkapi-common.css
@@ -139,15 +139,12 @@ ul.mkapi-item-list {
 }
 
 .mkapi-document-toggle,
+.mkapi-parent-toggle,
 .mkapi-section-toggle {
   cursor: pointer;
   color: var(--mkapi-punctuation-color);
 }
 
-.mkapi-parent-toggle {
-  cursor: pointer;
-}
-
 .mkapi-page-object {
   margin-block-end: 0px;
   border-bottom: 1px solid var(--mkapi-object-border-color);
diff --git a/src/mkapi/javascript/mkapi.js b/src/mkapi/javascript/mkapi.js
index dd9d6c03..e96cb9da 100644
--- a/src/mkapi/javascript/mkapi.js
+++ b/src/mkapi/javascript/mkapi.js
@@ -40,5 +40,15 @@ parentButtons.forEach((button) => {
     elements.forEach((element) => {
       element.style.display = isVisible ? "none" : "inline";
     });
+
+    const buttons = document.querySelectorAll(".mkapi-parent-toggle");
+    buttons.forEach((button) => {
+      const icon = button.querySelector("i");
+      if (icon) {
+        icon.className = isVisible
+          ? "fa-solid fa-square-plus"
+          : "fa-solid fa-square-xmark";
+      }
+    });
   });
 });
diff --git a/src/mkapi/templates/object.jinja2 b/src/mkapi/templates/object.jinja2
index c0417404..5b71125b 100644
--- a/src/mkapi/templates/object.jinja2
+++ b/src/mkapi/templates/object.jinja2
@@ -1,11 +1,11 @@
 <p class="mkapi-object mkapi-page-{{ namespace }}" id="{{ id }}" markdown="1">
 <span class="mkapi-object-link">
-[{{ namespace }}][__mkapi__.__{{ namespace }}__.{{ obj_id }}]
 {% if parent -%}
 <span class="mkapi-parent-toggle" title="Toggle class names">
-<i class="fa-regular fa-square-minus"></i>
+<i class="fa-solid fa-square-plus"></i>
 </span>
 {%- endif %}
+[{{ namespace }}][__mkapi__.__{{ namespace }}__.{{ obj_id }}]
 <span class="mkapi-document-toggle" title="Toggle all docs">
 <i class="fa-regular fa-square-minus"></i>
 </span>