mirror of
				https://github.com/Unleash/unleash.git
				synced 2025-10-27 11:02:16 +01:00 
			
		
		
		
	refactor: add a MainTheme type (#686)
* refactor: add a MainTheme type * refactor: use numbers for z-index values
This commit is contained in:
		
							parent
							
								
									010f766de9
								
							
						
					
					
						commit
						93aa1ab8b8
					
				@ -38,7 +38,6 @@ export const useStyles = makeStyles(theme => ({
 | 
				
			|||||||
        position: 'relative',
 | 
					        position: 'relative',
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
    errorMessage: {
 | 
					    errorMessage: {
 | 
				
			||||||
        // @ts-expect-error
 | 
					 | 
				
			||||||
        fontSize: theme.fontSizes.smallBody,
 | 
					        fontSize: theme.fontSizes.smallBody,
 | 
				
			||||||
        color: theme.palette.error.main,
 | 
					        color: theme.palette.error.main,
 | 
				
			||||||
        position: 'absolute',
 | 
					        position: 'absolute',
 | 
				
			||||||
 | 
				
			|||||||
@ -4,7 +4,7 @@ export const useStyles = makeStyles(theme => ({
 | 
				
			|||||||
    feedback: {
 | 
					    feedback: {
 | 
				
			||||||
        borderRadius: '12.5px',
 | 
					        borderRadius: '12.5px',
 | 
				
			||||||
        backgroundColor: '#fff',
 | 
					        backgroundColor: '#fff',
 | 
				
			||||||
        zIndex: '9999',
 | 
					        zIndex: 9999,
 | 
				
			||||||
        boxShadow: '2px 2px 4px 4px rgba(143,143,143, 0.25)',
 | 
					        boxShadow: '2px 2px 4px 4px rgba(143,143,143, 0.25)',
 | 
				
			||||||
        padding: '1.5rem',
 | 
					        padding: '1.5rem',
 | 
				
			||||||
        maxWidth: '400px',
 | 
					        maxWidth: '400px',
 | 
				
			||||||
 | 
				
			|||||||
@ -29,7 +29,7 @@ export const useStyles = makeStyles(theme => ({
 | 
				
			|||||||
            right: '0px',
 | 
					            right: '0px',
 | 
				
			||||||
            bottom: '0px',
 | 
					            bottom: '0px',
 | 
				
			||||||
            padding: '2rem 0',
 | 
					            padding: '2rem 0',
 | 
				
			||||||
            zIndex: '500',
 | 
					            zIndex: 500,
 | 
				
			||||||
            position: 'fixed',
 | 
					            position: 'fixed',
 | 
				
			||||||
            width: '100%',
 | 
					            width: '100%',
 | 
				
			||||||
            height: '100%',
 | 
					            height: '100%',
 | 
				
			||||||
 | 
				
			|||||||
@ -54,7 +54,6 @@ export const useStyles = makeStyles(theme => ({
 | 
				
			|||||||
        position: 'relative',
 | 
					        position: 'relative',
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
    errorMessage: {
 | 
					    errorMessage: {
 | 
				
			||||||
        // @ts-expect-error
 | 
					 | 
				
			||||||
        fontSize: theme.fontSizes.smallBody,
 | 
					        fontSize: theme.fontSizes.smallBody,
 | 
				
			||||||
        color: theme.palette.error.main,
 | 
					        color: theme.palette.error.main,
 | 
				
			||||||
        position: 'absolute',
 | 
					        position: 'absolute',
 | 
				
			||||||
 | 
				
			|||||||
@ -38,7 +38,6 @@ export const useStyles = makeStyles(theme => ({
 | 
				
			|||||||
        position: 'relative',
 | 
					        position: 'relative',
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
    errorMessage: {
 | 
					    errorMessage: {
 | 
				
			||||||
        // @ts-expect-error
 | 
					 | 
				
			||||||
        fontSize: theme.fontSizes.smallBody,
 | 
					        fontSize: theme.fontSizes.smallBody,
 | 
				
			||||||
        color: theme.palette.error.main,
 | 
					        color: theme.palette.error.main,
 | 
				
			||||||
        position: 'absolute',
 | 
					        position: 'absolute',
 | 
				
			||||||
 | 
				
			|||||||
@ -6,7 +6,6 @@ export const useStyles = makeStyles(theme => ({
 | 
				
			|||||||
    },
 | 
					    },
 | 
				
			||||||
    formHeader: {
 | 
					    formHeader: {
 | 
				
			||||||
        fontWeight: 'bold',
 | 
					        fontWeight: 'bold',
 | 
				
			||||||
        // @ts-expect-error
 | 
					 | 
				
			||||||
        fontSize: theme.fontSizes.bodySize,
 | 
					        fontSize: theme.fontSizes.bodySize,
 | 
				
			||||||
        marginTop: '1.5rem',
 | 
					        marginTop: '1.5rem',
 | 
				
			||||||
        marginBottom: '0.5rem',
 | 
					        marginBottom: '0.5rem',
 | 
				
			||||||
 | 
				
			|||||||
@ -38,7 +38,6 @@ export const useStyles = makeStyles(theme => ({
 | 
				
			|||||||
        marginBottom: '0.5rem',
 | 
					        marginBottom: '0.5rem',
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
    typeDescription: {
 | 
					    typeDescription: {
 | 
				
			||||||
        // @ts-expect-error
 | 
					 | 
				
			||||||
        fontSize: theme.fontSizes.smallBody,
 | 
					        fontSize: theme.fontSizes.smallBody,
 | 
				
			||||||
        color: theme.palette.grey[600],
 | 
					        color: theme.palette.grey[600],
 | 
				
			||||||
        top: '-13px',
 | 
					        top: '-13px',
 | 
				
			||||||
@ -55,7 +54,6 @@ export const useStyles = makeStyles(theme => ({
 | 
				
			|||||||
        position: 'relative',
 | 
					        position: 'relative',
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
    errorMessage: {
 | 
					    errorMessage: {
 | 
				
			||||||
        // @ts-expect-error
 | 
					 | 
				
			||||||
        fontSize: theme.fontSizes.smallBody,
 | 
					        fontSize: theme.fontSizes.smallBody,
 | 
				
			||||||
        color: theme.palette.error.main,
 | 
					        color: theme.palette.error.main,
 | 
				
			||||||
        position: 'absolute',
 | 
					        position: 'absolute',
 | 
				
			||||||
 | 
				
			|||||||
@ -7,7 +7,7 @@ export const useStyles = makeStyles(theme => ({
 | 
				
			|||||||
        padding: '0.5rem',
 | 
					        padding: '0.5rem',
 | 
				
			||||||
        boxShadow: 'none',
 | 
					        boxShadow: 'none',
 | 
				
			||||||
        position: 'relative',
 | 
					        position: 'relative',
 | 
				
			||||||
        zIndex: '300',
 | 
					        zIndex: 300,
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
    links: {
 | 
					    links: {
 | 
				
			||||||
        display: 'flex',
 | 
					        display: 'flex',
 | 
				
			||||||
 | 
				
			|||||||
@ -38,7 +38,6 @@ export const useStyles = makeStyles(theme => ({
 | 
				
			|||||||
        position: 'relative',
 | 
					        position: 'relative',
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
    errorMessage: {
 | 
					    errorMessage: {
 | 
				
			||||||
        // @ts-expect-error
 | 
					 | 
				
			||||||
        fontSize: theme.fontSizes.smallBody,
 | 
					        fontSize: theme.fontSizes.smallBody,
 | 
				
			||||||
        color: theme.palette.error.main,
 | 
					        color: theme.palette.error.main,
 | 
				
			||||||
        position: 'absolute',
 | 
					        position: 'absolute',
 | 
				
			||||||
 | 
				
			|||||||
@ -3,7 +3,7 @@ import { makeStyles } from '@material-ui/styles';
 | 
				
			|||||||
export const useStyles = makeStyles(theme => ({
 | 
					export const useStyles = makeStyles(theme => ({
 | 
				
			||||||
    profile: {
 | 
					    profile: {
 | 
				
			||||||
        position: 'absolute',
 | 
					        position: 'absolute',
 | 
				
			||||||
        zIndex: '5000',
 | 
					        zIndex: 5000,
 | 
				
			||||||
        minWidth: '300px',
 | 
					        minWidth: '300px',
 | 
				
			||||||
        right: 0,
 | 
					        right: 0,
 | 
				
			||||||
        padding: '1.5rem',
 | 
					        padding: '1.5rem',
 | 
				
			||||||
 | 
				
			|||||||
@ -1,6 +1,16 @@
 | 
				
			|||||||
import { createTheme } from '@material-ui/core/styles';
 | 
					import { createTheme, Theme } from '@material-ui/core/styles';
 | 
				
			||||||
 | 
					
 | 
				
			||||||
const theme = createTheme({
 | 
					type MainTheme = typeof mainTheme;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					declare module '@material-ui/core/styles/createTheme' {
 | 
				
			||||||
 | 
					    interface Theme extends MainTheme {}
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					declare module '@material-ui/core/styles/makeStyles' {
 | 
				
			||||||
 | 
					    interface Theme extends MainTheme {}
 | 
				
			||||||
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					const mainTheme = {
 | 
				
			||||||
    typography: {
 | 
					    typography: {
 | 
				
			||||||
        fontFamily: ['Sen', 'Roboto, sans-serif'],
 | 
					        fontFamily: ['Sen', 'Roboto, sans-serif'],
 | 
				
			||||||
        fontWeightBold: '700',
 | 
					        fontWeightBold: '700',
 | 
				
			||||||
@ -117,6 +127,6 @@ const theme = createTheme({
 | 
				
			|||||||
        semi: '700',
 | 
					        semi: '700',
 | 
				
			||||||
        bold: '700',
 | 
					        bold: '700',
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
});
 | 
					};
 | 
				
			||||||
 | 
					
 | 
				
			||||||
export default theme;
 | 
					export default createTheme(mainTheme as unknown as Theme);
 | 
				
			||||||
		Loading…
	
		Reference in New Issue
	
	Block a user