Improved appearance of details outline

squidfunk · Sep 19, 2021 · 3c352bd · 3c352bd
1 parent 726888c
commit 3c352bd
Show file tree

Hide file tree

Showing 8 changed files with 13 additions and 7 deletions.
diff --git a/material/assets/stylesheets/main.4596ff4f.min.css.map b/material/assets/stylesheets/main.4596ff4f.min.css.map
diff --git a/.../assets/stylesheets/main.4596ff4f.min.css → .../assets/stylesheets/main.665c42a3.min.css b/.../assets/stylesheets/main.4596ff4f.min.css → .../assets/stylesheets/main.665c42a3.min.css
diff --git a/material/assets/stylesheets/main.665c42a3.min.css.map b/material/assets/stylesheets/main.665c42a3.min.css.map
diff --git a/material/base.html b/material/base.html
@@ -39,7 +39,7 @@
       {% endif %}
     {% endblock %}
     {% block styles %}
-      <link rel="stylesheet" href="{{ 'assets/stylesheets/main.4596ff4f.min.css' | url }}">
+      <link rel="stylesheet" href="{{ 'assets/stylesheets/main.665c42a3.min.css' | url }}">
       {% if config.theme.palette %}
         {% set palette = config.theme.palette %}
         <link rel="stylesheet" href="{{ 'assets/stylesheets/palette.3f5d1f46.min.css' | url }}">

diff --git a/src/assets/stylesheets/main/_typeset.scss b/src/assets/stylesheets/main/_typeset.scss
@@ -166,7 +166,7 @@ kbd {
       color: var(--md-accent-fg-color);
     }
 
-    // Text link on keyboard focus
+    // Show outline for keyboard devices
     &.focus-visible {
       outline-color: var(--md-accent-fg-color);
       outline-offset: px2rem(4px);

diff --git a/src/assets/stylesheets/main/extensions/pymdownx/_details.scss b/src/assets/stylesheets/main/extensions/pymdownx/_details.scss
@@ -84,6 +84,12 @@
       padding: px2rem(8px) px2rem(44px) px2rem(8px) px2rem(36px);
     }
 
+    // Show outline for keyboard devices
+    &.focus-visible {
+      outline-color: var(--md-accent-fg-color);
+      outline-offset: px2rem(4px);
+    }
+
     // Hide outline for pointer devices
     &:not(.focus-visible) {
       outline: none;

diff --git a/src/assets/stylesheets/main/layout/_base.scss b/src/assets/stylesheets/main/layout/_base.scss
@@ -140,7 +140,7 @@ body {
     display: block;
   }
 
-  // Show outline for pointer devices
+  // Show outline for keyboard devices
   &.focus-visible + label {
     outline-style: auto;
     outline-color: var(--md-accent-fg-color);

diff --git a/src/assets/stylesheets/main/layout/_nav.scss b/src/assets/stylesheets/main/layout/_nav.scss
@@ -125,7 +125,7 @@
       color: var(--md-accent-fg-color);
     }
 
-    // Navigation link on keyboard focus
+    // Show outline for keyboard devices
     &.focus-visible {
       outline-color: var(--md-accent-fg-color);
       outline-offset: px2rem(4px);