diff --git a/packages/core/src/data-editor/stories/data-editor-beautiful.stories.tsx b/packages/core/src/data-editor/stories/data-editor-beautiful.stories.tsx index 086c65ead..00e6ff1b9 100644 --- a/packages/core/src/data-editor/stories/data-editor-beautiful.stories.tsx +++ b/packages/core/src/data-editor/stories/data-editor-beautiful.stories.tsx @@ -1508,6 +1508,18 @@ export const ThemePerColumn: React.VFC = () => { accentColor: "#009CA6", accentLight: "#009CA620", fgIconHeader: "#FFFFFF", + baseFontStyle: "600 13px", + }, + }; + c[4] = { + ...c[4], + themeOverride: { + textDark: "#009CA6", + bgIconHeader: "#009CA6", + accentColor: "#009CA6", + accentLight: "#009CA620", + fgIconHeader: "#FFFFFF", + baseFontStyle: "600 13px", }, }; c[9] = { diff --git a/packages/core/src/data-grid/data-grid-render.tsx b/packages/core/src/data-grid/data-grid-render.tsx index ef0569938..65158eb87 100644 --- a/packages/core/src/data-grid/data-grid-render.tsx +++ b/packages/core/src/data-grid/data-grid-render.tsx @@ -1056,20 +1056,20 @@ function drawCells( ctx.rect(colDrawX, colDrawY, colWidth, colHeight); ctx.clip(); }; - reclip(); - + const colSelected = selectedColumns.hasIndex(c.sourceIndex); - + const groupTheme = getGroupDetails(c.group ?? "").overrideTheme; const colTheme = - c.themeOverride === undefined && groupTheme === undefined - ? outerTheme - : { ...outerTheme, ...groupTheme, ...c.themeOverride }; + c.themeOverride === undefined && groupTheme === undefined + ? outerTheme + : { ...outerTheme, ...groupTheme, ...c.themeOverride }; const colFont = `${colTheme.baseFontStyle} ${colTheme.fontFamily}`; if (colFont !== font) { font = colFont; ctx.font = colFont; } + reclip(); let prepResult: PrepResult | undefined = undefined; walkRowsInCol(