Remove focus-visible polyfill (#11677)

* Remove focus-visible polyfill

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

res/css/_common.pcss

@@ -230,7 +230,7 @@ textarea:focus {
 /* accessible (focusable) components. Not intended for buttons, but */
 /* should be used on things like focusable containers where the outline */
 /* is usually not helping anyone. */
-*:focus:not(.focus-visible) {
+*:focus:not(:focus-visible) {
     outline: none;
 }
 
@@ -585,7 +585,7 @@ legend {
     cursor: pointer;
     display: inline-block;
 
-    &:not(.focus-visible) {
+    &:not(:focus-visible) {
         outline: none;
     }
 }

res/css/views/dialogs/_CreateRoomDialog.pcss

@@ -28,7 +28,7 @@ limitations under the License.
             display: none;
         }
 
-        &:not(.focus-visible) {
+        &:not(:focus-visible) {
             outline: none;
         }
     }

res/css/views/elements/_Slider.pcss

@@ -35,7 +35,7 @@ limitations under the License.
             --active-color: $slider-background-color;
         }
 
-        &:focus:not(.focus-visible) {
+        &:focus:not(:focus-visible) {
             outline: none;
         }
 

res/css/views/elements/_StyledCheckbox.pcss

@@ -70,7 +70,7 @@ limitations under the License.
             cursor: not-allowed;
         }
 
-        &.focus-visible {
+        &:focus-visible {
             & + label .mx_Checkbox_background {
                 @mixin unreal-focus;
             }

res/css/views/elements/_StyledRadioButton.pcss

@@ -78,7 +78,7 @@ limitations under the License.
             }
         }
 
-        &.focus-visible {
+        &:focus-visible {
             & + div {
                 @mixin unreal-focus;
             }

res/css/views/rooms/_EventTile.pcss

@@ -224,7 +224,7 @@ $left-gutter: 64px;
             }
         }
 
-        &.focus-visible:focus-within,
+        &:focus-visible:focus-within,
         &.mx_EventTile_actionBarFocused,
         &.mx_EventTile_isEditing,
         &.mx_EventTile_selected {
@@ -870,7 +870,7 @@ $left-gutter: 64px;
         border: 1px solid transparent;
 
         .mx_EventTile:hover &,
-        .mx_EventTile.focus-visible:focus-within & {
+        .mx_EventTile:focus-visible:focus-within & {
             border: 1px solid $tertiary-content;
         }
     }
@@ -993,7 +993,7 @@ $left-gutter: 64px;
 .mx_EventTile:hover .mx_MessageActionBar,
 .mx_EventTile.mx_EventTile_actionBarFocused .mx_MessageActionBar,
 [data-whatinput="keyboard"] .mx_EventTile:focus-within .mx_MessageActionBar,
-.mx_EventTile.focus-visible:focus-within .mx_MessageActionBar {
+.mx_EventTile:focus-visible:focus-within .mx_MessageActionBar {
     visibility: visible;
 }
 
@@ -1002,7 +1002,7 @@ $left-gutter: 64px;
 /* animation for when it's shown which means duplicating the style definition in */
 /* multiple places. */
 .mx_EventTile:not(:hover):not(.mx_EventTile_actionBarFocused):not([data-whatinput="keyboard"] :focus-within) {
-    &:not(.focus-visible:focus-within) .mx_MessageActionBar .mx_Indicator {
+    &:not(:focus-visible:focus-within) .mx_MessageActionBar .mx_Indicator {
         animation: none;
     }
 }

res/css/views/rooms/_LinkPreviewGroup.pcss

@@ -27,7 +27,7 @@ limitations under the License.
     }
 
     &:hover .mx_LinkPreviewGroup_hide img,
-    .mx_LinkPreviewGroup_hide.focus-visible:focus img {
+    .mx_LinkPreviewGroup_hide:focus-visible:focus img {
         visibility: visible;
     }