Org html: mitigate <summary> differences in Chrome

config.org

@@ -4652,7 +4652,8 @@ somewhat spiffy.
          (name (plist-get properties :name)))
     (format "<details class='code' open><summary%s>%s</summary>%s</details>"
             (if name " class='named'" "")
-            (if (not name) lang (format "<span class='name'>%s</span> %s" name lang))
+            (if (not name) (concat "<span class='lang'>" lang "</span>")
+              (format "<span class='name'>%s</span><span class='lang'>%s</span>" name lang))
             (funcall orig-fn src-block contents info))))
 #+END_SRC
 

misc/pile-css-theme/_code.scss

@@ -75,24 +75,28 @@ details.code {
     padding-botton: 4px;
     margin-left: -10px;
     z-index: 1;
+    outline: none;
     @include light-meta;
     .name {
       font-size: 14px;
       color: $text-medium;
+      margin-right: 0.7em;
     }
   }
   summary::marker {
     color: $back-medium;
   }
   &[open] summary {
-    color: transparent;
     margin-bottom: -32px;
+    .lang {
+      color: transparent;
+    }
   }
   &[open] summary.named {
     margin-bottom: -26px;
   }
   &:not([open]) summary {
-    margin-bottom: -16px;
+    margin-bottom: -10px;
   }
 }
 

misc/pile-css-theme/main.css

@@ -1146,6 +1146,7 @@ details.code summary {
   padding-botton: 4px;
   margin-left: -10px;
   z-index: 1;
+  outline: none;
   font-family: "Open Sans";
   font-weight: normal;
   font-style: normal;
@@ -1154,20 +1155,22 @@ details.code summary {
   color: var(--text-light); }
   details.code summary .name {
     font-size: 14px;
-    color: var(--text-medium); }
+    color: var(--text-medium);
+    margin-right: 0.7em; }
 
 details.code summary::marker {
   color: var(--back-medium); }
 
 details.code[open] summary {
-  color: transparent;
   margin-bottom: -32px; }
+  details.code[open] summary .lang {
+    color: transparent; }
 
 details.code[open] summary.named {
   margin-bottom: -26px; }
 
 details.code:not([open]) summary {
-  margin-bottom: -16px; }
+  margin-bottom: -10px; }
 
 .example,
 .src {