Skip to content

Commit 63ea73a

Browse files
committed
Move cell execution order label back to below play button
1 parent 789eb03 commit 63ea73a

4 files changed

Lines changed: 20 additions & 15 deletions

File tree

src/vs/workbench/contrib/notebook/browser/media/notebook.css

Lines changed: 13 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -424,17 +424,16 @@
424424
top: 0px;
425425
}
426426
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .run-button-container {
427-
display: flex;
428-
align-items: center;
429-
justify-content: flex-end;
430-
position: absolute;
431-
top: 17px;
427+
position: relative;
432428
height: 16px;
429+
flex-shrink: 0;
430+
top: 9px;
431+
z-index: 27;
432+
/* Above the drag handle */
433433
}
434434

435435
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .run-button-container .monaco-toolbar {
436436
visibility: hidden;
437-
z-index: 27; /* Above the drag handle */
438437
}
439438

440439
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .run-button-container .monaco-toolbar .codicon {
@@ -453,12 +452,18 @@
453452
}
454453

455454
.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .execution-count-label {
455+
position: absolute;
456456
font-size: 10px;
457457
font-family: var(--monaco-monospace-font);
458458
white-space: pre;
459+
box-sizing: border-box;
459460
opacity: .6;
460-
padding-top: 1px;
461-
margin-right: 1px;
461+
462+
/* Sizing hacks */
463+
left: 26px;
464+
width: 35px;
465+
bottom: 0px;
466+
text-align: center;
462467
}
463468

464469
.monaco-workbench .notebookOverlay .cell .cell-editor-part {

src/vs/workbench/contrib/notebook/browser/notebookEditorWidget.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1982,14 +1982,14 @@ registerThemingParticipant((theme, collector) => {
19821982

19831983
// Cell Margin
19841984
collector.addRule(`.notebookOverlay .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row div.cell { margin: 0px ${CELL_MARGIN * 2}px 0px ${CELL_MARGIN}px; }`);
1985-
collector.addRule(`.notebookOverlay .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row div.cell.code { margin-left: ${CODE_CELL_LEFT_MARGIN + CELL_RUN_GUTTER}px; }`);
1986-
collector.addRule(`.notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .run-button-container { width: ${CODE_CELL_LEFT_MARGIN + CELL_RUN_GUTTER}px; }`);
1985+
collector.addRule(`.notebookOverlay .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row div.cell.code { margin-left: ${CODE_CELL_LEFT_MARGIN}px; }`);
19871986
collector.addRule(`.notebookOverlay .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row > .cell-inner-container { padding-top: ${CELL_TOP_MARGIN}px; }`);
19881987
collector.addRule(`.notebookOverlay .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .markdown-cell-row > .cell-inner-container { padding-bottom: ${CELL_BOTTOM_MARGIN}px; }`);
19891988
collector.addRule(`.notebookOverlay .output { margin: 0px ${CELL_MARGIN}px 0px ${CODE_CELL_LEFT_MARGIN + CELL_RUN_GUTTER}px; }`);
19901989
collector.addRule(`.notebookOverlay .output { width: calc(100% - ${CODE_CELL_LEFT_MARGIN + CELL_RUN_GUTTER + (CELL_MARGIN * 2)}px); }`);
19911990

19921991
collector.addRule(`.notebookOverlay .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row div.cell.markdown { padding-left: ${CELL_RUN_GUTTER}px; }`);
1992+
collector.addRule(`.notebookOverlay .cell .run-button-container { width: 20px; margin: 0px ${Math.floor(CELL_RUN_GUTTER - 20) / 2}px; }`);
19931993
collector.addRule(`.notebookOverlay .monaco-list .monaco-list-row .cell-focus-indicator-top { height: ${CELL_TOP_MARGIN}px; }`);
19941994
collector.addRule(`.notebookOverlay .monaco-list .monaco-list-row .cell-focus-indicator-side { bottom: ${BOTTOM_CELL_TOOLBAR_GAP}px; }`);
19951995
collector.addRule(`.notebookOverlay .monaco-list .monaco-list-row.code-cell-row .cell-focus-indicator-left,

src/vs/workbench/contrib/notebook/browser/view/renderers/cellRenderer.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -642,10 +642,10 @@ export class CodeCellRenderer extends AbstractCellRenderer implements IListRende
642642
const dragHandle = DOM.append(container, DOM.$('.cell-drag-handle'));
643643

644644
const cellContainer = DOM.append(container, $('.cell.code'));
645-
646-
const runButtonContainer = DOM.append(container, $('.run-button-container'));
645+
const runButtonContainer = DOM.append(cellContainer, $('.run-button-container'));
647646
const runToolbar = disposables.add(this.createToolbar(runButtonContainer));
648-
const executionOrderLabel = DOM.append(runButtonContainer, $('div.execution-count-label'));
647+
648+
const executionOrderLabel = DOM.append(cellContainer, $('div.execution-count-label'));
649649

650650
// create a special context key service that set the inCompositeEditor-contextkey
651651
const editorContextKeyService = disposables.add(this.contextKeyServiceProvider(container));

src/vs/workbench/contrib/notebook/browser/viewModel/markdownCellViewModel.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@ import * as editorCommon from 'vs/editor/common/editorCommon';
99
import * as model from 'vs/editor/common/model';
1010
import * as nls from 'vs/nls';
1111
import { IConfigurationService } from 'vs/platform/configuration/common/configuration';
12-
import { BOTTOM_CELL_TOOLBAR_GAP, BOTTOM_CELL_TOOLBAR_HEIGHT, CELL_BOTTOM_MARGIN, CELL_MARGIN, CELL_RUN_GUTTER, CELL_TOP_MARGIN, CODE_CELL_LEFT_MARGIN, COLLAPSED_INDICATOR_HEIGHT } from 'vs/workbench/contrib/notebook/browser/constants';
12+
import { BOTTOM_CELL_TOOLBAR_GAP, BOTTOM_CELL_TOOLBAR_HEIGHT, CELL_BOTTOM_MARGIN, CELL_MARGIN, CELL_TOP_MARGIN, CODE_CELL_LEFT_MARGIN, COLLAPSED_INDICATOR_HEIGHT } from 'vs/workbench/contrib/notebook/browser/constants';
1313
import { EditorFoldingStateDelegate } from 'vs/workbench/contrib/notebook/browser/contrib/fold/foldingModel';
1414
import { CellFindMatch, ICellViewModel, MarkdownCellLayoutChangeEvent, MarkdownCellLayoutInfo, NotebookLayoutInfo } from 'vs/workbench/contrib/notebook/browser/notebookBrowser';
1515
import { MarkdownRenderer } from 'vs/workbench/contrib/notebook/browser/view/renderers/mdRenderer';
@@ -89,7 +89,7 @@ export class MarkdownCellViewModel extends BaseCellViewModel implements ICellVie
8989
}
9090

9191
private computeEditorWidth(outerWidth: number) {
92-
return outerWidth - (CELL_MARGIN * 2) - CODE_CELL_LEFT_MARGIN - CELL_RUN_GUTTER;
92+
return outerWidth - (CELL_MARGIN * 2) - CODE_CELL_LEFT_MARGIN;
9393
}
9494

9595
layoutChange(state: MarkdownCellLayoutChangeEvent) {

0 commit comments

Comments
 (0)