fix(UI): Fix font-family override in UITextDisplayer (#7249)

Font settings were applied to ".shaka-video-container *", all
descendents of .shaka-video-container. This meant that the font setting
inheritance intended in our UI text displayer was broken, because those
descendents effectively had their own settings and didn't inherit them
from their parents in the subtitle DOM hierarchy. We fix this by
breaking down the CSS and applying those font settings directly to the
top level .shaka-video-container, to be inherited by any descendent
without their own setting.

lib/text/ui_text_displayer.js

@@ -710,10 +710,6 @@ shaka.text.UITextDisplayer = class {
           // Only do this for the text itself.
           elem.style.backgroundColor = 'rgba(0, 0, 0, 0.8)';
         }
-        const fontFamily = inherit((c) => c.fontFamily);
-        if (fontFamily) {
-          elem.style.fontFamily = fontFamily;
-        }
       }
       if (text) {
         elem.textContent = text;

ui/less/containers.less

@@ -22,10 +22,9 @@
   }
 
   /* Set the fonts for all other content. */
-  * {
-    font-family: Roboto, sans-serif, TengwarTelcontar;
-    -webkit-font-smoothing: antialiased;
-  }
+  font-family: Roboto, sans-serif, TengwarTelcontar;
+  font-weight: normal;
+  -webkit-font-smoothing: antialiased;
 }
 
 /* Each browser has a different prefixed pseudo-class for fullscreened elements.