From 0e1e3e387617a52f162a8dc5cb6fa5ec731d3697 Mon Sep 17 00:00:00 2001 From: Luke Cotter <4013877+lukecotter@users.noreply.github.com> Date: Sat, 10 May 2025 18:19:38 +0100 Subject: [PATCH 1/5] refactor: switch from monospaced font on namespace column --- log-viewer/modules/components/analysis-view/AnalysisView.ts | 3 --- log-viewer/modules/components/calltree-view/CalltreeView.ts | 1 - log-viewer/modules/components/database-view/SOQLView.ts | 1 - log-viewer/modules/datagrid/style/DataGrid.scss | 1 - 4 files changed, 6 deletions(-) diff --git a/log-viewer/modules/components/analysis-view/AnalysisView.ts b/log-viewer/modules/components/analysis-view/AnalysisView.ts index 1b02a1ac..57dabadc 100644 --- a/log-viewer/modules/components/analysis-view/AnalysisView.ts +++ b/log-viewer/modules/components/analysis-view/AnalysisView.ts @@ -341,7 +341,6 @@ export class AnalysisView extends LitElement { headerSortStartingDir: 'desc', width: 150, sorter: 'string', - cssClass: 'datagrid-code-text', tooltip: true, headerFilter: 'list', headerFilterFunc: 'in', @@ -351,7 +350,6 @@ export class AnalysisView extends LitElement { multiselect: true, }, headerFilterLiveFilter: false, - variableHeight: true, }, { title: 'Type', @@ -360,7 +358,6 @@ export class AnalysisView extends LitElement { width: 150, sorter: 'string', tooltip: true, - cssClass: 'datagrid-code-text', }, { title: 'Count', diff --git a/log-viewer/modules/components/calltree-view/CalltreeView.ts b/log-viewer/modules/components/calltree-view/CalltreeView.ts index e552e062..bd55f7c3 100644 --- a/log-viewer/modules/components/calltree-view/CalltreeView.ts +++ b/log-viewer/modules/components/calltree-view/CalltreeView.ts @@ -666,7 +666,6 @@ export class CalltreeView extends LitElement { field: 'namespace', sorter: 'string', width: 120, - cssClass: 'datagrid-code-text', headerFilter: 'list', headerFilterFunc: this._namespaceFilter, headerFilterFuncParams: { filterCache: namespaceFilterCache }, diff --git a/log-viewer/modules/components/database-view/SOQLView.ts b/log-viewer/modules/components/database-view/SOQLView.ts index 2915fe9b..8435e2fb 100644 --- a/log-viewer/modules/components/database-view/SOQLView.ts +++ b/log-viewer/modules/components/database-view/SOQLView.ts @@ -450,7 +450,6 @@ export class SOQLView extends LitElement { title: 'Namespace', field: 'namespace', sorter: 'string', - cssClass: 'datagrid-code-text', width: 120, headerFilter: 'list', headerFilterFunc: 'in', diff --git a/log-viewer/modules/datagrid/style/DataGrid.scss b/log-viewer/modules/datagrid/style/DataGrid.scss index a78a813b..cd09f453 100644 --- a/log-viewer/modules/datagrid/style/DataGrid.scss +++ b/log-viewer/modules/datagrid/style/DataGrid.scss @@ -62,7 +62,6 @@ $footerActiveColor: #d00 !default; //footer bottom active text color padding: 2px 4px; box-sizing: border-box; border-radius: 2px; - font-size: inherit; appearance: textfield !important; } input[type='search']:focus { From f8ce3c02fc6f776d1c6858039aeb1b54da5f431f Mon Sep 17 00:00:00 2001 From: Luke Cotter <4013877+lukecotter@users.noreply.github.com> Date: Sat, 10 May 2025 18:21:40 +0100 Subject: [PATCH 2/5] refactor: use tabular-nums for number cells Ensure than the character in number align so the easier to read and compare. --- log-viewer/modules/components/calltree-view/CalltreeView.ts | 5 +++++ log-viewer/modules/components/database-view/DMLView.ts | 2 ++ log-viewer/modules/components/database-view/SOQLView.ts | 3 +++ log-viewer/modules/datagrid/style/DataGrid.scss | 4 ++++ 4 files changed, 14 insertions(+) diff --git a/log-viewer/modules/components/calltree-view/CalltreeView.ts b/log-viewer/modules/components/calltree-view/CalltreeView.ts index bd55f7c3..3c21c176 100644 --- a/log-viewer/modules/components/calltree-view/CalltreeView.ts +++ b/log-viewer/modules/components/calltree-view/CalltreeView.ts @@ -680,6 +680,7 @@ export class CalltreeView extends LitElement { title: 'DML Count', field: 'dmlCount.total', sorter: 'number', + cssClass: 'number-cell', width: 60, hozAlign: 'right', headerHozAlign: 'right', @@ -689,6 +690,7 @@ export class CalltreeView extends LitElement { title: 'SOQL Count', field: 'soqlCount.total', sorter: 'number', + cssClass: 'number-cell', width: 60, hozAlign: 'right', headerHozAlign: 'right', @@ -698,6 +700,7 @@ export class CalltreeView extends LitElement { title: 'Throws Count', field: 'totalThrownCount', sorter: 'number', + cssClass: 'number-cell', width: 60, hozAlign: 'right', headerHozAlign: 'right', @@ -707,6 +710,7 @@ export class CalltreeView extends LitElement { title: 'DML Rows', field: 'dmlRowCount.total', sorter: 'number', + cssClass: 'number-cell', width: 60, hozAlign: 'right', headerHozAlign: 'right', @@ -716,6 +720,7 @@ export class CalltreeView extends LitElement { title: 'SOQL Rows', field: 'soqlRowCount.total', sorter: 'number', + cssClass: 'number-cell', width: 60, hozAlign: 'right', headerHozAlign: 'right', diff --git a/log-viewer/modules/components/database-view/DMLView.ts b/log-viewer/modules/components/database-view/DMLView.ts index 7ea6d345..9945b5d4 100644 --- a/log-viewer/modules/components/database-view/DMLView.ts +++ b/log-viewer/modules/components/database-view/DMLView.ts @@ -345,6 +345,7 @@ export class DMLView extends LitElement { title: 'Row Count', field: 'rowCount', sorter: 'number', + cssClass: 'number-cell', width: 90, bottomCalc: 'sum', hozAlign: 'right', @@ -354,6 +355,7 @@ export class DMLView extends LitElement { title: 'Time Taken (ms)', field: 'timeTaken', sorter: 'number', + cssClass: 'number-cell', width: 110, hozAlign: 'right', headerHozAlign: 'right', diff --git a/log-viewer/modules/components/database-view/SOQLView.ts b/log-viewer/modules/components/database-view/SOQLView.ts index 8435e2fb..2b8a02fe 100644 --- a/log-viewer/modules/components/database-view/SOQLView.ts +++ b/log-viewer/modules/components/database-view/SOQLView.ts @@ -464,6 +464,7 @@ export class SOQLView extends LitElement { title: 'Row Count', field: 'rowCount', sorter: 'number', + cssClass: 'number-cell', width: 100, hozAlign: 'right', headerHozAlign: 'right', @@ -473,6 +474,7 @@ export class SOQLView extends LitElement { title: 'Time Taken (ms)', field: 'timeTaken', sorter: 'number', + cssClass: 'number-cell', width: 120, hozAlign: 'right', headerHozAlign: 'right', @@ -490,6 +492,7 @@ export class SOQLView extends LitElement { title: 'Aggregations', field: 'aggregations', sorter: 'number', + cssClass: 'number-cell', width: 100, hozAlign: 'right', headerHozAlign: 'right', diff --git a/log-viewer/modules/datagrid/style/DataGrid.scss b/log-viewer/modules/datagrid/style/DataGrid.scss index cd09f453..fc593770 100644 --- a/log-viewer/modules/datagrid/style/DataGrid.scss +++ b/log-viewer/modules/datagrid/style/DataGrid.scss @@ -141,6 +141,10 @@ $footerActiveColor: #d00 !default; //footer bottom active text color border-left: 6px solid transparent; border-right: 6px solid transparent; } + + .number-cell { + font-variant-numeric: tabular-nums; + } } .tabulator-edit-list { From d8084603cb5f097464f19175c1b8c38ab4174076 Mon Sep 17 00:00:00 2001 From: Luke Cotter <4013877+lukecotter@users.noreply.github.com> Date: Sat, 10 May 2025 18:22:07 +0100 Subject: [PATCH 3/5] refactor: use tabular-nums for number cells Ensure than the character in number align so the easier to read and compare. --- log-viewer/modules/components/analysis-view/AnalysisView.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/log-viewer/modules/components/analysis-view/AnalysisView.ts b/log-viewer/modules/components/analysis-view/AnalysisView.ts index 57dabadc..5f2e34be 100644 --- a/log-viewer/modules/components/analysis-view/AnalysisView.ts +++ b/log-viewer/modules/components/analysis-view/AnalysisView.ts @@ -363,6 +363,7 @@ export class AnalysisView extends LitElement { title: 'Count', field: 'count', sorter: 'number', + cssClass: 'number-cell', width: 65, hozAlign: 'right', headerHozAlign: 'right', From 995bdb74ea7a2d8d88b93b4ec9f317cd6945836e Mon Sep 17 00:00:00 2001 From: Luke Cotter <4013877+lukecotter@users.noreply.github.com> Date: Sun, 11 May 2025 11:39:33 +0100 Subject: [PATCH 4/5] refactor: match tabulator search list styling to VS Code - background color of each list item on hover and active now match VS Code style. - outline color of search list item matches vscode outline --- log-viewer/modules/datagrid/style/DataGrid.scss | 15 ++++++++++++++- 1 file changed, 14 insertions(+), 1 deletion(-) diff --git a/log-viewer/modules/datagrid/style/DataGrid.scss b/log-viewer/modules/datagrid/style/DataGrid.scss index fc593770..1bf63422 100644 --- a/log-viewer/modules/datagrid/style/DataGrid.scss +++ b/log-viewer/modules/datagrid/style/DataGrid.scss @@ -29,7 +29,7 @@ $rowSelectedBackground: var(--vscode-list-activeSelectionBackground); //row background color when selected and hovered $rowSelectedBackgroundHover: var(--vscode-list-activeSelectionBackground); -$editBoxColor: var(--vscode-list-activeSelectionBackground, #1d68cd); //border color for edit boxes +$editBoxColor: var(--vscode-focusBorder, #1d68cd); //border color for edit boxes $errorColor: #dd0000 !default; //error indication //footer theming @@ -149,4 +149,17 @@ $footerActiveColor: #d00 !default; //footer bottom active text color .tabulator-edit-list { border-color: var(--vscode-focusBorder, default); + + .tabulator-edit-list-item { + color: var(--vscode-editor-foreground, 'white'); + &.active { + background-color: var(--vscode-list-activeSelectionBackground); + color: var(--vscode-editor-foreground, 'white'); + } + + &:hover { + background-color: var(--vscode-list-activeSelectionBackground); + color: var(--vscode-editor-foreground, 'white'); + } + } } From 19b21ef729c943bc6ceb9650fbc01b9024e64d6c Mon Sep 17 00:00:00 2001 From: Luke Cotter <4013877+lukecotter@users.noreply.github.com> Date: Sun, 11 May 2025 11:50:25 +0100 Subject: [PATCH 5/5] docs: update changelog --- CHANGELOG.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index cb41fdcd..ecd99f52 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -21,6 +21,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - **✂️ Copy Text in Views**: You can now highlight and copy text from the Call Tree, Analysis, and Database views without the text clearing immediately after highlighting ([#504]). - **💎 Improved HiDPI Rendering**: Sharpened rendering for the timeline on HiDPI displays ([#588]). - **🔍 Call Tree Search**: Search in the Call Tree now only includes the visible filtered rows ([#539]). +- **🎨 Search Input Styling:**: The grid search input fits into VS Code styles better ([#619]). ### Fixed @@ -395,6 +396,7 @@ Skipped due to adopting odd numbering for pre releases and even number for relea [#592]: https://github.com/certinia/debug-log-analyzer/issues/592 [#93]: https://github.com/certinia/debug-log-analyzer/issues/93 [#539]: https://github.com/certinia/debug-log-analyzer/issues/539 +[#619]: https://github.com/certinia/debug-log-analyzer/issues/619