feat(HCM): update first half of components

Author: tw15egan

packages/components/src/components/file-uploader/_file-uploader.scss

@@ -160,12 +160,6 @@
       text-overflow: ellipsis;
       white-space: nowrap;
     }
-
-    // Windows, Firefox HCM Fix
-    @media screen and (-ms-high-contrast: active),
-      screen and (prefers-contrast) {
-      outline: 2px solid transparent;
-    }
   }
 
   .#{$prefix}--file__selected-file--field {
@@ -307,13 +301,6 @@
 
   .#{$prefix}--file__state-container .#{$prefix}--file-close svg path {
     fill: $icon-primary;
-
-    // Windows, Firefox HCM Fix
-    @media screen and (-ms-high-contrast: active),
-      screen and (prefers-contrast) {
-      // `ButtonText` is a CSS2 system color to help improve colors in HCM
-      fill: ButtonText;
-    }
   }
 
   .#{$prefix}--file__state-container .#{$prefix}--inline-loading__animation {
@@ -335,6 +322,17 @@
     outline: 2px solid $focus;
     outline-offset: -2px;
   }
+
+  // Windows HCM fix
+  /* stylelint-disable */
+  .#{$prefix}--file__selected-file {
+    @include high-contrast-mode('outline');
+  }
+
+  .#{$prefix}--file__state-container .#{$prefix}--file-close svg path {
+    @include high-contrast-mode('icon-fill');
+  }
+  /* stylelint-enable */
 }
 
 @include exports('file-uploader') {

packages/components/src/components/modal/_modal.scss

@@ -324,14 +324,6 @@
     align-items: flex-start;
   }
 
-  .#{$prefix}--modal-footer button.#{$prefix}--btn:focus {
-    // Firefox HCM Fix
-    @media screen and (prefers-contrast) {
-      border: none;
-      outline-style: dotted;
-    }
-  }
-
   .#{$prefix}--modal-close {
     position: absolute;
     top: 0;
@@ -352,11 +344,6 @@
     &:focus {
       border-color: $focus;
       outline: none;
-
-      // Firefox HCM Fix
-      @media screen and (prefers-contrast) {
-        border-style: dotted;
-      }
     }
   }
 
@@ -368,13 +355,6 @@
     width: rem(20px);
     height: rem(20px);
     fill: $icon-primary;
-
-    // Windows, Firefox HCM Fix
-    @media screen and (-ms-high-contrast: active),
-      screen and (prefers-contrast) {
-      // `ButtonText` is a CSS2 system color to help improve colors in HCM
-      fill: ButtonText;
-    }
   }
 
   .#{$prefix}--body--with-modal-open {
@@ -384,6 +364,17 @@
   .#{$prefix}--body--with-modal-open .#{$prefix}--tooltip {
     z-index: z('modal');
   }
+
+  // Windows HCM fixes
+  /* stylelint-disable */
+  .#{$prefix}--modal-close__icon {
+    @include high-contrast-mode('icon-fill');
+  }
+
+  .#{$prefix}--modal-close:focus {
+    @include high-contrast-mode('focus');
+  }
+  /* stylelint-enable */
 }
 
 @include exports('modal') {

packages/components/src/components/notification/_inline-notification.scss

@@ -301,13 +301,17 @@
     fill: $icon-primary;
   }
 
+  // Windows HCM fixes
   /* stylelint-disable */
   .#{$prefix}--inline-notification {
     @include high-contrast-mode('outline');
   }
-  .#{$prefix}--inline-notification__close-button {
+
+  .#{$prefix}--inline-notification__close-button:focus,
+  .#{$prefix}--btn.#{$prefix}--btn--ghost.#{$prefix}--inline-notification__action-button:focus {
     @include high-contrast-mode('focus');
   }
+
   .#{$prefix}--inline-notification__icon {
     @include high-contrast-mode('icon-fill');
   }

packages/components/src/components/notification/_toast-notification.scss

@@ -221,11 +221,12 @@
     color: $text-primary;
   }
 
+  // Windows HCM fixes
   /* stylelint-disable */
   .#{$prefix}--toast-notification {
     @include high-contrast-mode('outline');
   }
-  .#{$prefix}--toast-notification__close-button {
+  .#{$prefix}--toast-notification__close-button:focus {
     @include high-contrast-mode('focus');
   }
   .#{$prefix}--toast-notification__icon {