Adjust focus styles.

package-lock.json

@@ -1,6 +1,6 @@
 {
   "name": "@splidejs/splide",
-  "version": "3.6.1",
+  "version": "3.6.2",
   "lockfileVersion": 1,
   "requires": true,
   "dependencies": {

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@splidejs/splide",
-  "version": "3.6.1",
+  "version": "3.6.2",
   "description": "Splide is a lightweight, flexible and accessible slider/carousel. No dependencies, no Lighthouse errors.",
   "author": "Naotoshi Fujita",
   "license": "MIT",

src/css/core/object/objects/slide.scss

@@ -5,9 +5,18 @@
     flex-shrink: 0;
     list-style-type: none !important;
     margin: 0;
-    outline: none;
     position: relative;
 
+    &:focus:not(:focus-visible) {
+      outline: 0;
+    }
+
+    @media all and (-ms-high-contrast: none) {
+      &:focus {
+        outline: 0;
+      }
+    }
+
     img {
       vertical-align: bottom;
     }

src/css/template/default/object/modifiers/nav.scss

@@ -33,8 +33,14 @@ $opacity-active: false !default;
             }
           }
 
-          &:focus {
-            outline: none;
+          &:focus:not(:focus-visible) {
+            outline: 0;
+          }
+
+          @media all and (-ms-high-contrast: none) {
+            &:focus {
+              outline: 0;
+            }
           }
         }
       }

src/css/template/default/object/objects/arrow.scss

@@ -71,7 +71,13 @@ $right: 1em !default;
     }
 
     &:focus:not(:focus-visible) {
-      outline: none;
+      outline: 0;
+    }
+
+    @media all and (-ms-high-contrast: none) {
+      &:focus {
+        outline: 0;
+      }
     }
 
     &--prev {

src/css/template/default/object/objects/pagination.scss

@@ -60,7 +60,13 @@ $dot-transform-active: scale( 1.4 ) !default;
       }
 
       &:focus:not(:focus-visible) {
-        outline: none;
+        outline: 0;
+      }
+
+      @media all and (-ms-high-contrast: none) {
+        &:focus {
+          outline: 0;
+        }
       }
     }
   }