Fix focus ring glitch on API autosummary "[source]" link (#1778)

src/pydata_sphinx_theme/assets/styles/content/_api.scss

@@ -111,6 +111,21 @@ span.highlighted {
   background-color: var(--pst-color-target);
 }
 
+dl > dt > a:has(.viewcode-link) {
+  // Sphinx applies a `float:right` rule to the .viewcode-line span, which
+  // exposes a browser glitch in the focus ring. It seems the browser creates
+  // two separate boxes, an empty box where the anchor element gets laid out and
+  // then another box around the anchor's contents that have been floated right.
+  // Firefox draws the focus ring around the empty anchor element box. Chrome
+  // draws two focus rings: one around the empty anchor and one around the
+  // floated-right element. To fix the glitch, we apply the float rule on the
+  // parent rather than the child.
+  float: right;
+  .viewcode-link {
+    float: none;
+  }
+}
+
 /*******************************************************************************
 * Styling for autosummary titles like "parameters" and "returns"
 */