From d0249f4727c4be252a9daa056977c1d80f48aea2 Mon Sep 17 00:00:00 2001 From: Rob Lourens Date: Thu, 10 Feb 2022 11:31:46 -0800 Subject: [PATCH] Ensure input expand button is always shown for long code cell text. Fix #141579 --- .../notebook/browser/media/notebook.css | 23 ++++++------------- .../notebook/browser/notebookEditorWidget.ts | 4 ++++ 2 files changed, 11 insertions(+), 16 deletions(-) diff --git a/src/vs/workbench/contrib/notebook/browser/media/notebook.css b/src/vs/workbench/contrib/notebook/browser/media/notebook.css index 5131c5ad1ca..bc04d3161c8 100644 --- a/src/vs/workbench/contrib/notebook/browser/media/notebook.css +++ b/src/vs/workbench/contrib/notebook/browser/media/notebook.css @@ -347,25 +347,25 @@ .monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container .cell-collapse-preview { padding: 0px 8px; + display: flex; + align-items: center; } .monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container .cell-collapse-preview .monaco-tokenized-source { font-size: var(--notebook-cell-input-preview-font-size); font-family: var(--notebook-cell-input-preview-font-family); cursor: pointer; -} - -.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container .cell-collapse-preview .monaco-tokenized-source { - display: inline-block; + white-space: normal; + overflow: hidden; } .monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container .cell-collapse-preview .expandInputIcon { - position: relative; - left: 0px; padding: 2px; border-radius: 5px; - vertical-align:middle; height: 16px; width: 16px; + + cursor: pointer; + z-index: var(--z-index-notebook-input-collapse-condicon); } .monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container .cell-collapse-preview .expandInputIcon:before { @@ -375,15 +375,6 @@ vertical-align: bottom; } -.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container .codicon { - position: absolute; - padding: 4px 6px; - left: -30px; - bottom: 0; - cursor: pointer; - z-index: var(--z-index-notebook-input-collapse-condicon); -} - .monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .output-collapse-container { cursor: pointer; } diff --git a/src/vs/workbench/contrib/notebook/browser/notebookEditorWidget.ts b/src/vs/workbench/contrib/notebook/browser/notebookEditorWidget.ts index 367d7a157c4..c44f95ea37a 100644 --- a/src/vs/workbench/contrib/notebook/browser/notebookEditorWidget.ts +++ b/src/vs/workbench/contrib/notebook/browser/notebookEditorWidget.ts @@ -879,6 +879,10 @@ export class NotebookEditorWidget extends Disposable implements INotebookEditorD .monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container .cell-collapse-preview { line-height: ${collapsedIndicatorHeight}px; } + + .monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .input-collapse-container .cell-collapse-preview .monaco-tokenized-source { + max-height: ${collapsedIndicatorHeight}px; + } `); styleSheets.push(`.monaco-workbench .notebookOverlay > .cell-list-container > .monaco-list > .monaco-scrollable-element > .monaco-list-rows > .monaco-list-row .cell-bottom-toolbar-container .monaco-toolbar { height: ${bottomToolbarHeight}px }`);