mirror of
https://github.com/Unleash/unleash.git
synced 2025-08-04 13:48:56 +02:00
chore(1-3356): make mui buttons respect font size changes (#9275)
Makes the MUI buttons use `body1.fontSize` for their own font size. Turns out we had a hardcoded `16px` in the `app.css` file, which made it hard to override. This change removes mui button styling in `app.css` and puts it into the `theme.ts` file instead. Also updates the border radius to match the one we use in the theme (from 3px to 4px). It's a subtle change: before:  after: 
This commit is contained in:
parent
fd1ad5ac5b
commit
65bec89d3c
@ -27,12 +27,6 @@ button {
|
|||||||
margin: 0;
|
margin: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.MuiButton-root {
|
|
||||||
border-radius: 3px;
|
|
||||||
text-transform: none;
|
|
||||||
font-size: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.skeleton {
|
.skeleton {
|
||||||
position: relative;
|
position: relative;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
@ -161,7 +155,7 @@ input.hide-clear[type="search"]::-webkit-search-results-decoration {
|
|||||||
|
|
||||||
/*
|
/*
|
||||||
This style is to hide the error message block from "vanilla-jsoneditor" package.
|
This style is to hide the error message block from "vanilla-jsoneditor" package.
|
||||||
The package has another minmal way to show error inline with the editor. And so we are hiding this block
|
The package has another minimal way to show error inline with the editor. And so we are hiding this block
|
||||||
which shows at the bottom of the editor and does not have the best UX - because it shows errors even as user
|
which shows at the bottom of the editor and does not have the best UX - because it shows errors even as user
|
||||||
is typing in the editor.
|
is typing in the editor.
|
||||||
*/
|
*/
|
||||||
|
@ -18,7 +18,10 @@ export const baseTheme = {
|
|||||||
fontWeightBold: '700',
|
fontWeightBold: '700',
|
||||||
fontWeightMedium: '700',
|
fontWeightMedium: '700',
|
||||||
allVariants: { lineHeight: 1.4 },
|
allVariants: { lineHeight: 1.4 },
|
||||||
button: { lineHeight: 1.75 },
|
button: {
|
||||||
|
fontSize: `${15 / 16}rem`,
|
||||||
|
lineHeight: 1.75,
|
||||||
|
},
|
||||||
h1: {
|
h1: {
|
||||||
fontSize: '1.5rem',
|
fontSize: '1.5rem',
|
||||||
lineHeight: 1.875,
|
lineHeight: 1.875,
|
||||||
@ -332,6 +335,16 @@ export const lightTheme = createTheme({
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
|
// Buttons
|
||||||
|
MuiButton: {
|
||||||
|
styleOverrides: {
|
||||||
|
root: ({ theme }) => ({
|
||||||
|
borderRadius: theme.shape.borderRadius,
|
||||||
|
textTransform: 'none',
|
||||||
|
}),
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
// Links
|
// Links
|
||||||
MuiLink: {
|
MuiLink: {
|
||||||
styleOverrides: {
|
styleOverrides: {
|
||||||
|
Loading…
Reference in New Issue
Block a user