debt - refer to tab height also in code

This commit is contained in:
Benjamin Pasero
2023-09-09 13:28:26 +02:00
parent a54f99fec1
commit 7d7dfa8f3e
7 changed files with 22 additions and 22 deletions

View File

@@ -734,7 +734,7 @@
"--tab-sizing-current-width",
"--tab-sizing-fixed-min-width",
"--tab-sizing-fixed-max-width",
"--editor-group-title-height",
"--editor-group-tab-height",
"--testMessageDecorationFontFamily",
"--testMessageDecorationFontSize",
"--title-border-bottom-color",

View File

@@ -93,9 +93,9 @@ export abstract class EditorTabsControl extends Themable {
protected readonly groupTransfer = LocalSelectionTransfer.getInstance<DraggedEditorGroupIdentifier>();
protected readonly treeItemsTransfer = LocalSelectionTransfer.getInstance<DraggedTreeItemsIdentifier>();
private static readonly EDITOR_TITLE_HEIGHT = {
normal: 35,
compact: 22
private static readonly EDITOR_TAB_HEIGHT = {
normal: 35 as const,
compact: 22 as const
};
protected breadcrumbsControl: BreadcrumbsControl | undefined = undefined;
@@ -156,7 +156,7 @@ export abstract class EditorTabsControl extends Themable {
}
protected create(parent: HTMLElement): void {
this.updateTitleHeight();
this.updateTabHeight();
}
protected createBreadcrumbsControl(container: HTMLElement, options: IBreadcrumbsControlOptions): void {
@@ -429,19 +429,19 @@ export abstract class EditorTabsControl extends Themable {
return keybinding ? keybinding.getLabel() ?? undefined : undefined;
}
protected get titleHeight() {
return this.accessor.partOptions.tabHeight !== 'compact' ? EditorTabsControl.EDITOR_TITLE_HEIGHT.normal : EditorTabsControl.EDITOR_TITLE_HEIGHT.compact;
protected get tabHeight() {
return this.accessor.partOptions.tabHeight !== 'compact' ? EditorTabsControl.EDITOR_TAB_HEIGHT.normal : EditorTabsControl.EDITOR_TAB_HEIGHT.compact;
}
protected updateTitleHeight(): void {
this.parent.style.setProperty('--editor-group-title-height', `${this.titleHeight}px`);
protected updateTabHeight(): void {
this.parent.style.setProperty('--editor-group-tab-height', `${this.tabHeight}px`);
}
updateOptions(oldOptions: IEditorPartOptions, newOptions: IEditorPartOptions): void {
// Update title height
// Update tab height
if (oldOptions.tabHeight !== newOptions.tabHeight) {
this.updateTitleHeight();
this.updateTabHeight();
}
}

View File

@@ -30,7 +30,7 @@
}
.monaco-workbench .part.editor > .content .editor-group-container > .title .monaco-icon-label::before {
height: var(--editor-group-title-height); /* tweak the icon size of the editor labels when icons are enabled */
height: var(--editor-group-tab-height); /* tweak the icon size of the editor labels when icons are enabled */
}
.monaco-workbench .part.editor > .content .editor-group-container > .title.breadcrumbs .monaco-icon-label::after,

View File

@@ -71,7 +71,7 @@
.monaco-workbench .part.editor > .content .editor-group-container > .title .tabs-container {
display: flex;
height: var(--editor-group-title-height);
height: var(--editor-group-tab-height);
scrollbar-width: none; /* Firefox: hide scrollbar */
}
@@ -97,7 +97,7 @@
display: flex;
white-space: nowrap;
cursor: pointer;
height: var(--editor-group-title-height);
height: var(--editor-group-tab-height);
box-sizing: border-box;
padding-left: 10px;
}
@@ -265,7 +265,7 @@
.monaco-workbench .part.editor > .content .editor-group-container > .title .tabs-container > .tab .tab-label {
margin-top: auto;
margin-bottom: auto;
line-height: var(--editor-group-title-height); /* aligns icon and label vertically centered in the tab */
line-height: var(--editor-group-tab-height); /* aligns icon and label vertically centered in the tab */
}
.monaco-workbench .part.editor > .content .editor-group-container > .title .tabs-container > .tab.sizing-shrink .tab-label,
@@ -473,7 +473,7 @@
cursor: default;
flex: initial;
padding: 0 8px 0 4px;
height: var(--editor-group-title-height);
height: var(--editor-group-tab-height);
}
.monaco-workbench .part.editor > .content .editor-group-container > .title .editor-actions .action-item {

View File

@@ -6,7 +6,7 @@
/* Title Label */
.monaco-workbench .part.editor > .content .editor-group-container > .title > .label-container {
height: var(--editor-group-title-height);
height: var(--editor-group-tab-height);
display: flex;
justify-content: flex-start;
align-items: center;
@@ -15,7 +15,7 @@
}
.monaco-workbench .part.editor > .content .editor-group-container > .title > .label-container > .title-label {
line-height: var(--editor-group-title-height);
line-height: var(--editor-group-tab-height);
overflow: hidden;
text-overflow: ellipsis;
position: relative;
@@ -94,7 +94,7 @@
flex: initial;
opacity: 0.5;
padding-right: 8px;
height: var(--editor-group-title-height);
height: var(--editor-group-tab-height);
}
.monaco-workbench .part.editor > .content .editor-group-container > .title > .title-actions .action-item {

View File

@@ -1550,7 +1550,7 @@ export class MultiEditorTabsControl extends EditorTabsControl {
if (this.accessor.partOptions.wrapTabs && this.tabsAndActionsContainer?.classList.contains('wrapping')) {
total = this.tabsAndActionsContainer.offsetHeight;
} else {
total = this.titleHeight;
total = this.tabHeight;
}
const offset = total;
@@ -1708,7 +1708,7 @@ export class MultiEditorTabsControl extends EditorTabsControl {
if (tabsWrapMultiLine) {
if (
(tabsContainer.offsetHeight > dimensions.available.height) || // if height exceeds available height
(allTabsWidth === visibleTabsWidth && tabsContainer.offsetHeight === this.titleHeight) || // if wrapping is not needed anymore
(allTabsWidth === visibleTabsWidth && tabsContainer.offsetHeight === this.tabHeight) || // if wrapping is not needed anymore
(!lastTabFitsWrapped()) // if last tab does not fit anymore
) {
updateTabsWrapping(false);

View File

@@ -350,7 +350,7 @@ export class SingleEditorTabsControl extends EditorTabsControl {
getHeight(): IEditorGroupTitleHeight {
return {
total: this.titleHeight,
total: this.tabHeight,
offset: 0
};
}