diff --git a/frontend/packages/app/src/App.tsx b/frontend/packages/app/src/App.tsx
index 0f22c76671..a814c94a57 100644
--- a/frontend/packages/app/src/App.tsx
+++ b/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 (
-
+
@@ -118,7 +129,7 @@ const App: FC<{}> = () => {
-
+
);
diff --git a/frontend/packages/core/src/index.ts b/frontend/packages/core/src/index.ts
index 45110734fb..5619dab3e8 100644
--- a/frontend/packages/core/src/index.ts
+++ b/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';
-
diff --git a/frontend/packages/core/src/theme/BackstageTheme.js b/frontend/packages/core/src/theme/BackstageTheme.js
index fbf521abe0..1c0f4cd2b7 100644
--- a/frontend/packages/core/src/theme/BackstageTheme.js
+++ b/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;
diff --git a/frontend/packages/plugins/login/src/components/LoginComponent/LoginComponent.tsx b/frontend/packages/plugins/login/src/components/LoginComponent/LoginComponent.tsx
index 31caa7d4db..8826eceda7 100644
--- a/frontend/packages/plugins/login/src/components/LoginComponent/LoginComponent.tsx
+++ b/frontend/packages/plugins/login/src/components/LoginComponent/LoginComponent.tsx
@@ -23,7 +23,7 @@ const LoginComponent: FC<{}> = () => {
style={{ marginTop: '24px', marginBottom: '24px' }}
>