diff --git a/src/components/sprite-info/sprite-info.css b/src/components/sprite-info/sprite-info.css
index 200aedaf7..f018abe8e 100644
--- a/src/components/sprite-info/sprite-info.css
+++ b/src/components/sprite-info/sprite-info.css
@@ -62,6 +62,11 @@
border-bottom-left-radius: $form-radius;
}
+.radio-left:focus {
+ border-color: #4c97ff;
+ box-shadow: inset 0 0 0 -2px rgba(0, 0, 0, 0.1);
+}
+
.radio-right {
border-bottom: 1px solid $form-border;
border-top: 1px solid $form-border;
@@ -70,6 +75,11 @@
border-bottom-right-radius: $form-radius;
}
+.radio-right:focus {
+ border-color: #4c97ff;
+ box-shadow: inset 0 0 0 -2px rgba(0, 0, 0, 0.1);
+}
+
.icon {
width: 100%;
height: 100%;
diff --git a/src/components/sprite-info/sprite-info.jsx b/src/components/sprite-info/sprite-info.jsx
index 5fcfd440f..9e1c8a409 100644
--- a/src/components/sprite-info/sprite-info.jsx
+++ b/src/components/sprite-info/sprite-info.jsx
@@ -118,6 +118,7 @@ class SpriteInfo extends React.Component {
)}
tabIndex="4"
onClick={this.props.onClickVisible}
+ onKeyPress={this.props.onPressVisible}
>
);
}