Fix direct reference to mui theme

src/apps/experimental/routes/user/display/index.tsx

@@ -5,7 +5,6 @@ import React, { useCallback } from 'react';
 
 import Page from 'components/Page';
 import globalize from 'scripts/globalize';
-import theme from 'themes/theme';
 import { DisplayPreferences } from './DisplayPreferences';
 import { ItemDetailPreferences } from './ItemDetailPreferences';
 import { LibraryPreferences } from './LibraryPreferences';
@@ -80,11 +79,7 @@ export default function UserDisplayPreferences() {
 
                         <Button
                             type='submit'
-                            sx={{
+                            size='large'
-                                color: theme.palette.text.primary,
-                                fontSize: theme.typography.htmlFontSize,
-                                fontWeight: theme.typography.fontWeightBold
-                            }}
                         >
                             {globalize.translate('Save')}
                         </Button>

src/themes/theme.ts

@@ -55,7 +55,18 @@ const theme = createTheme({
         MuiButton: {
             defaultProps: {
                 variant: 'contained'
-            }
+            },
+            variants: [
+                {
+                    props: {
+                        size: 'large'
+                    },
+                    style: {
+                        fontSize: '1rem',
+                        fontWeight: 'bold'
+                    }
+                }
+            ]
         },
         MuiFormControl: {
             defaultProps: {