diff --git a/src/sql/workbench/contrib/executionPlan/browser/executionPlanComparisonPropertiesView.ts b/src/sql/workbench/contrib/executionPlan/browser/executionPlanComparisonPropertiesView.ts index 8707637890..f992da5e7b 100644 --- a/src/sql/workbench/contrib/executionPlan/browser/executionPlanComparisonPropertiesView.ts +++ b/src/sql/workbench/contrib/executionPlan/browser/executionPlanComparisonPropertiesView.ts @@ -248,7 +248,6 @@ export class ExecutionPlanComparisonPropertiesView extends ExecutionPlanProperti const topProp = v.topProp; const bottomProp = v.bottomProp; - const parentRowCellStyling = 'font-weight: bold'; let diffIconClass = ''; if (topProp && bottomProp) { row['displayOrder'] = v.topProp.displayOrder; @@ -276,8 +275,8 @@ export class ExecutionPlanComparisonPropertiesView extends ExecutionPlanProperti title: removeLineBreaks(v.bottomProp.displayValue, ' ') }; if ((topProp && !isString(topProp.value)) || (bottomProp && !isString(bottomProp.value))) { - row['name'].style = parentRowCellStyling; - row['primary'].style = parentRowCellStyling; + row['name'].iconCssClass += ` parent-row-styling`; + row['primary'].iconCssClass += ` parent-row-styling`; row['secondary'].iconCssClass += ` parent-row-styling`; } rows.push(row); @@ -295,8 +294,8 @@ export class ExecutionPlanComparisonPropertiesView extends ExecutionPlanProperti }; rows.push(row); if (!isString(topProp.value)) { - row['name'].style = parentRowCellStyling; - row['primary'].style = parentRowCellStyling; + row['name'].iconCssClass += ` parent-row-styling`; + row['primary'].iconCssClass += ` parent-row-styling`; this.convertPropertiesToTableRows(topProp.value, undefined, rows.length - 1, indent + 2, rows); } } else if (!topProp && bottomProp) { @@ -307,7 +306,7 @@ export class ExecutionPlanComparisonPropertiesView extends ExecutionPlanProperti }; rows.push(row); if (!isString(bottomProp.value)) { - row['name'].style = parentRowCellStyling; + row['name'].iconCssClass += ` parent-row-styling`; row['secondary'].iconCssClass += ` parent-row-styling`; this.convertPropertiesToTableRows(undefined, bottomProp.value, rows.length - 1, indent + 2, rows); } diff --git a/src/sql/workbench/contrib/executionPlan/browser/executionPlanPropertiesView.ts b/src/sql/workbench/contrib/executionPlan/browser/executionPlanPropertiesView.ts index 437dfd42a3..499d5b4378 100644 --- a/src/sql/workbench/contrib/executionPlan/browser/executionPlanPropertiesView.ts +++ b/src/sql/workbench/contrib/executionPlan/browser/executionPlanPropertiesView.ts @@ -128,8 +128,6 @@ export class ExecutionPlanPropertiesView extends ExecutionPlanPropertiesViewBase break; } - const parentRowCellStyling = 'font-weight: bold'; - props.forEach((p, i) => { let row = {}; rows.push(row); @@ -138,12 +136,10 @@ export class ExecutionPlanPropertiesView extends ExecutionPlanPropertiesViewBase if (!isString(p.value)) { // Styling values in the parent row differently to make them more apparent and standout compared to the rest of the cells. row['name'] = { - text: row['name'], - style: parentRowCellStyling + text: row['name'] }; row['value'] = { - text: removeLineBreaks(p.displayValue, ' '), - style: parentRowCellStyling + text: removeLineBreaks(p.displayValue, ' ') }; row['tootltip'] = p.displayValue; this.convertModelToTableRows(p.value, rows.length - 1, indent + 2, rows); diff --git a/src/sql/workbench/contrib/executionPlan/browser/executionPlanPropertiesViewBase.ts b/src/sql/workbench/contrib/executionPlan/browser/executionPlanPropertiesViewBase.ts index 810c4a9be5..c4e4f9fc17 100644 --- a/src/sql/workbench/contrib/executionPlan/browser/executionPlanPropertiesViewBase.ts +++ b/src/sql/workbench/contrib/executionPlan/browser/executionPlanPropertiesViewBase.ts @@ -13,7 +13,7 @@ import { Codicon } from 'vs/base/common/codicons'; import { sortAlphabeticallyIconClassNames, sortByDisplayOrderIconClassNames, sortReverseAlphabeticallyIconClassNames } from 'sql/workbench/contrib/executionPlan/browser/constants'; import { attachTableStyler } from 'sql/platform/theme/common/styler'; import { RESULTS_GRID_DEFAULTS } from 'sql/workbench/common/constants'; -import { contrastBorder, listHoverBackground } from 'vs/platform/theme/common/colorRegistry'; +import { contrastBorder, listHoverBackground, listInactiveSelectionBackground } from 'vs/platform/theme/common/colorRegistry'; import { TreeGrid } from 'sql/base/browser/ui/table/treeGrid'; import { ISashEvent, IVerticalSashLayoutProvider, Orientation, Sash } from 'vs/base/browser/ui/sash/sash'; import { CellSelectionModel } from 'sql/base/browser/ui/table/plugins/cellSelectionModel.plugin'; @@ -332,6 +332,16 @@ registerThemingParticipant((theme: IColorTheme, collector: ICssStyleCollector) = } `); } + + const parentRowBackground = theme.getColor(listInactiveSelectionBackground); + if (parentRowBackground) { + collector.addRule(` + .eps-container .ui-widget-content.slick-row[aria-expanded="true"], + .eps-container .ui-widget-content.slick-row[aria-expanded="false"] { + background-color: ${parentRowBackground}; + } + `); + } });