GNOME.org
 

[epiphany] use <details> element for details in error pages

commit d45a4bb2a4734bc08ac30b781dea64a800648970
Author: Çağatay Yiğit Şahin <cyigitsahin outlook com>
Date:   Sat Jun 1 23:34:28 2019 +0300

    use <details> element for details in error pages

 src/resources/error.css  |  4 ++++
 src/resources/error.html | 20 +++-----------------
 2 files changed, 7 insertions(+), 17 deletions(-)
---
diff --git a/src/resources/error.css b/src/resources/error.css
index fdddb0cc6..ee0647b7a 100644
--- a/src/resources/error.css
+++ b/src/resources/error.css
@@ -136,3 +136,7 @@ html {
     color: #fff;
     background-image: linear-gradient(to bottom, #f14545, #ef2929 60%, #ee1616);
 }
+
+details > summary::-webkit-details-marker {
+  color: black;
+}
diff --git a/src/resources/error.html b/src/resources/error.html
index f2f8a50a4..e98a626a9 100644
--- a/src/resources/error.html
+++ b/src/resources/error.html
@@ -35,17 +35,6 @@
     function hiddenButtonAction() {
       %s
     }
-    function toggleDetailsBox() {
-      let div = document.getElementById('reveal');
-      if (div.className == "hidden") {
-        div.className = "visible";
-        document.getElementById('pointer').innerHTML = "&#9660;";
-      }
-      else if (div.className == "visible") {
-        div.className = "hidden";
-        document.getElementById('pointer').innerHTML = "&#9658;";
-      }
-    }
   </script>
 </head>
 <body>
@@ -61,16 +50,13 @@
         %s
       </div>
       <div id="msg-details" class="%s">
-        <span class="clickable" onclick="javascript:toggleDetailsBox()">
-          <span id="pointer" style="color: black;">&#9658;</span>
-          %s
-        </span>
-        <div id="reveal" class="hidden">
+        <details>
+          <summary class="clickable">%s</summary>
           %s
           <button class="btn destructive-action %s" accesskey="%s" onclick="javascript:hiddenButtonAction()">
             <strong>%s</strong>
           </button>
-        </div>
+        </details>
       </div>
       <div id="footer">
         <button class="btn suggested-action visible" accesskey="%s" onclick="javascript:buttonAction()">
[Date Prev][Date Next]   [Thread Prev][Thread Next]   [Thread Index] [Date Index] [Author Index]