Conditionally enable focus indicator for top bar buttons and selected tab

Enable a focus indicator for top bar buttons and the selected tab when
using keyboard input

src/styles/sidebar/components/selection-tabs.scss

@@ -17,15 +17,14 @@
 }
 
 .selection-tabs__type {
+  @include outline-on-keyboard-focus;
+
   color: $grey-6;
   margin-right: 20px;
   cursor: pointer;
   min-width: 85px;
   min-height: 18px;
 
-  // Disable focus ring for selected tab
-  outline: none;
-
   user-select: none;
 }
 

src/styles/sidebar/components/simple-search.scss

@@ -21,6 +21,8 @@
   $expanded-max-width: 150px;
 
   .simple-search-input {
+    @include outline-on-keyboard-focus;
+
     flex-grow: 1;
     order: 1;
 
@@ -28,7 +30,6 @@
 
     // disable the default browser styling for the input
     border: none;
-    outline: none;
     padding: 0px;
     width: 100%;
 

src/styles/sidebar/components/top-bar.scss

@@ -51,11 +51,12 @@
 
 // Removes the native styling from a <button> element
 @mixin reset-native-btn-styles {
+  @include outline-on-keyboard-focus;
+
   padding: 0px;
   margin: 0px;
   background-color: transparent;
   border-style: none;
-  outline: none;
 }
 
 .top-bar__btn {