remove createGlobalStyles from theme

frontend/packages/app/src/App.tsx

@@ -6,7 +6,6 @@ import {
   InfoCard,
   Page,
   theme,
-  withGlobalStyles,
 } from '@backstage/core';
 import helloWorld, { MyComponent } from '@backstage/plugin-hello-world';
 //import PageHeader from './components/PageHeader';
@@ -25,6 +24,20 @@ import SideBar from './components/SideBar';
 import entities from './entities';
 
 const useStyles = makeStyles(theme => ({
+  '@global': {
+    html: {
+      height: '100%',
+      fontFamily: theme.typography.fontFamily,
+    },
+    body: {
+      height: '100%',
+      fontFamily: theme.typography.fontFamily,
+    },
+    a: {
+      color: 'inherit',
+      textDecoration: 'none',
+    },
+  },
   root: {
     display: 'grid',
     // FIXME: Don't used a fixed width here
@@ -95,8 +108,6 @@ const AppShell: FC<{}> = ({ children }) => {
   );
 };
 
-const AppContent = withGlobalStyles(AppShell);
-
 const app = createApp();
 
 app.registerEntityKind(...entities);
@@ -107,7 +118,7 @@ const App: FC<{}> = () => {
   return (
     <CssBaseline>
       <ThemeProvider theme={BackstageTheme}>
-        <AppContent>
+        <AppShell>
           <Router>
             <Switch>
               <Route path="/login">
@@ -118,7 +129,7 @@ const App: FC<{}> = () => {
               </Route>
             </Switch>
           </Router>
-        </AppContent>
+        </AppShell>
       </ThemeProvider>
     </CssBaseline>
   );

frontend/packages/core/src/index.ts

@@ -9,5 +9,3 @@ export { default as InfoCard } from '../src/layout/InfoCard';
 export { default as ErrorBoundary } from '../src/layout/ErrorBoundary';
 
 export { default as BackstageTheme } from '../src/theme/BackstageTheme';
-export { withGlobalStyles } from '../src/theme/BackstageTheme';
-

frontend/packages/core/src/theme/BackstageTheme.js

@@ -1,4 +1,4 @@
-import { createMuiTheme, withStyles } from '@material-ui/core';
+import { createMuiTheme } from '@material-ui/core';
 import { darken, lighten } from '@material-ui/core/styles/colorManipulator';
 import { blue, yellow } from '@material-ui/core/colors';
 
@@ -332,24 +332,4 @@ const BackstageTheme = { ...extendedTheme, ...createOverrides(extendedTheme) };
 
 // Temporary workaround for files incorrectly importing the theme directly
 export const V1 = BackstageTheme;
-
-// Default styles for the application other than the built in mui components
-const styles = theme => ({
-  '@global': {
-    html: {
-      height: '100%',
-      fontFamily: theme.typography.fontFamily,
-    },
-    body: {
-      height: '100%',
-      fontFamily: theme.typography.fontFamily,
-    },
-    a: {
-      color: 'inherit',
-      textDecoration: 'none',
-    },
-  },
-});
-
-export const withGlobalStyles = withStyles(styles);
 export default BackstageTheme;

frontend/packages/plugins/login/src/components/LoginComponent/LoginComponent.tsx

@@ -23,7 +23,7 @@ const LoginComponent: FC<{}> = () => {
         style={{ marginTop: '24px', marginBottom: '24px' }}
       >
         <Button
-          variant="outlined"
+          variant="contained"
           color="primary"
           style={{ textTransform: 'none' }}
         >