Fix Material theme to work with any combination of pyScss and MDI icons

':before' class doesn't work as expected with current versions of
xstatic-mdi and PyScss. It's a temporary workaround with copy ':before'
styles from MDI directly into the Material theme.

Closes-Bug: #1771559
Co-Authored-By: Akihiro Motoki <amotoki@gmail.com>
Change-Id: I969ad70065c580ba90bb0a050c7a9cf242d805ec
(cherry picked from commit f3bfa38341)

openstack_dashboard/themes/material/static/horizon/_icons.scss

@@ -86,6 +86,9 @@ $icon-swap: (
 
 @each $fa-icon, $mdi-icon in $icon-swap {
   .fa-#{$fa-icon} {
+    &:before {
+      content: unquote("\"\\#{map-get($mdi-icons, $mdi-icon)}\"");
+    }
     @extend .mdi-#{$mdi-icon};
   }
 }

openstack_dashboard/themes/material/static/horizon/components/_checkboxes.scss

@@ -12,6 +12,7 @@
 
       &:before {
         @extend .mdi;
+        content: "\F131";
         font-size: $font-size-h5;
       }
     }
@@ -21,6 +22,7 @@
       @extend .mdi-checkbox-marked;
 
       &:before {
+        content: "\F132";
         color: $brand-primary;
       }
     }

openstack_dashboard/themes/material/static/horizon/components/_context_selection.scss

@@ -2,4 +2,8 @@
   @extend .mdi-stop;
   color: $gray-light;
   font-size: $font-size-small;
-}
+
+  &:before {
+    content: "\F4DB";
+  }
+}

openstack_dashboard/themes/material/static/horizon/components/_datepicker.scss

@@ -3,6 +3,10 @@
   @extend .mdi-arrow-right;
   padding-right: $padding-base-horizontal;
 
+  &:before {
+    content: "\F054";
+  }
+
   &-text {
     display: none;
   }

openstack_dashboard/themes/material/static/horizon/components/_navbar.scss

@@ -2,4 +2,8 @@
   @extend .mdi-stop;
   color: $gray-light;
   font-size: $font-size-small;
-}
+
+  &:before {
+    content: "\F4DB";
+  }
+}

openstack_dashboard/themes/material/static/horizon/components/_radiobuttons.scss

@@ -15,6 +15,7 @@
         font-size: $font-size-h5;
         line-height: $font-size-h5;
         vertical-align: middle;
+        content: "\F43D";
       }
     }
 
@@ -24,6 +25,7 @@
 
       &:before {
         color: $brand-primary;
+        content: "\F43E";
       }
     }
   }

openstack_dashboard/themes/material/static/horizon/components/_spinners.scss

@@ -20,11 +20,17 @@
 
     .hz-spinner-icon-up {
       @extend .mdi-plus;
+      &:before {
+        content: "\F415";
+      }
     }
 
     .hz-spinner-icon-down {
       @extend .mdi-minus;
       padding-right: $padding-xs-horizontal;
+      &:before {
+        content: "\F374";
+      }
     }
 
     &-container {