From c21b8a8f8e929a341127f99bdae84d8801e6857b Mon Sep 17 00:00:00 2001 From: Pubudu Dodangoda Date: Sun, 8 Jan 2023 23:49:37 +1100 Subject: [PATCH 1/2] docs: update code example to use correct API usage Existing code example is invalid. Added a `root` block inside the styleOverrides to fix it Signed-off-by: Pubudu Dodangoda --- docs/data/joy/customization/approaches/approaches.md | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/docs/data/joy/customization/approaches/approaches.md b/docs/data/joy/customization/approaches/approaches.md index ed79a29b517c6c..856f9ede5b5e94 100644 --- a/docs/data/joy/customization/approaches/approaches.md +++ b/docs/data/joy/customization/approaches/approaches.md @@ -80,10 +80,12 @@ const theme = extendTheme({ components: { // The component identifier always start with `Joy${ComponentName}`. JoyButton: { - styleOverrides: ({ theme }) => ({ - // theme.vars.* return the CSS variables. - fontSize: theme.vars.fontSize.lg, // 'var(--joy-fontSize-lg)' - }), + styleOverrides: { + root: ({theme}) => { + // theme.vars.* return the CSS variables. + fontSize: theme.vars.fontSize.lg, // 'var(--joy-fontSize-lg)' + }, + }, }, }, }); From df185127470f24cd92ff0e3c2b33f2b1f93184bf Mon Sep 17 00:00:00 2001 From: Zeeshan Tamboli Date: Tue, 10 Jan 2023 14:22:11 +0530 Subject: [PATCH 2/2] Update docs/data/joy/customization/approaches/approaches.md Signed-off-by: Zeeshan Tamboli --- docs/data/joy/customization/approaches/approaches.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/data/joy/customization/approaches/approaches.md b/docs/data/joy/customization/approaches/approaches.md index 856f9ede5b5e94..b8d407be11708b 100644 --- a/docs/data/joy/customization/approaches/approaches.md +++ b/docs/data/joy/customization/approaches/approaches.md @@ -81,7 +81,7 @@ const theme = extendTheme({ // The component identifier always start with `Joy${ComponentName}`. JoyButton: { styleOverrides: { - root: ({theme}) => { + root: ({ theme }) => { // theme.vars.* return the CSS variables. fontSize: theme.vars.fontSize.lg, // 'var(--joy-fontSize-lg)' },