fix: fix editor progress position when enabled pinnedTabsOnSeparateRow (

#195314)

* fix: fix editor progress position when enabled pinnedTabsOnSeparateRow

* fix: fix editor progress position

* fix: fix editor progress position

* fix: add commit to editor title progress style

* Revert "fix: add commit to editor title progress style"

This reverts commit 302ec88.

* Revert "fix: fix editor progress position"

This reverts commit ec445b6.

* Revert "fix: fix editor progress position"

This reverts commit cea64be.

* Revert "fix: fix editor progress position when enabled pinnedTabsOnSeparateRow"

This reverts commit 8f2c0e7.

* feat: add --editor-group-tabs-height css variable to set progress bar position

* update height in lyout

* Remove setting redraws as already done elsewhere

* Remove 2px for progress bit height

---------

Co-authored-by: ermin.zem <ermin.zem@alibaba-inc.com>
Co-authored-by: BeniBenj <besimmonds@microsoft.com>

build/lib/stylelint/vscode-known-variables.json

@@ -737,6 +737,7 @@
  "--tab-sizing-fixed-min-width",
  "--tab-sizing-fixed-max-width",
  "--editor-group-tab-height",
+ "--editor-group-tabs-height",
  "--testMessageDecorationFontFamily",
  "--testMessageDecorationFontSize",
  "--title-border-bottom-color",
@@ -783,4 +784,4 @@
  "--z-index-notebook-sticky-scroll",
  "--zoom-factor"
  ]
-}
+}

src/vs/workbench/browser/parts/editor/editorGroupView.ts

@@ -1930,6 +1930,8 @@ export class EditorGroupView extends Themable implements IEditorGroupView {
  available: new Dimension(width, height - this.editorPane.minimumHeight)
  });
 
+ this.element.style.setProperty('--editor-group-tabs-height', `${this.titleHeight.offset}px`);
+
  // Pass the container width and remaining height to the editor layout
  const editorHeight = Math.max(0, height - titleControlSize.height);
  this.editorContainer.style.height = `${editorHeight}px`;

src/vs/workbench/browser/parts/editor/media/editorgroupview.css

@@ -185,3 +185,8 @@
  width: 100%;
  height: 100%;
 }
+
+/* Override top position of progress bar which defined in vs/workbench/browser/media/part.css */
+.monaco-workbench .part.editor > .content .monaco-progress-container {
+ top: min(calc(var(--editor-group-tabs-height) - 2px), 0);
+}