mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-02-17 02:51:36 -05:00
* Fixed #3415 add padding-left/right 8px * We will keep CSS consistent for review and editing mode. So removed codes not used.
This commit is contained in:
@@ -9,6 +9,6 @@
|
|||||||
<code-component *ngIf="isEditMode" [cellModel]="cellModel" (onContentChanged)="handleContentChanged()" [model]="model" [activeCellId]="activeCellId" [hideVerticalToolbar]=true>
|
<code-component *ngIf="isEditMode" [cellModel]="cellModel" (onContentChanged)="handleContentChanged()" [model]="model" [activeCellId]="activeCellId" [hideVerticalToolbar]=true>
|
||||||
</code-component>
|
</code-component>
|
||||||
</div>
|
</div>
|
||||||
<div #preview style="flex: 0 0 auto;" (dblclick)="toggleEditMode()">
|
<div #preview class ="notebook-preview" style="flex: 0 0 auto;" (dblclick)="toggleEditMode()">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -38,7 +38,6 @@ export class TextCellComponent extends CellView implements OnInit, OnChanges {
|
|||||||
private _content: string;
|
private _content: string;
|
||||||
private isEditMode: boolean;
|
private isEditMode: boolean;
|
||||||
private _sanitizer: ISanitizer;
|
private _sanitizer: ISanitizer;
|
||||||
private _previewCssApplied: boolean = false;
|
|
||||||
private _model: NotebookModel;
|
private _model: NotebookModel;
|
||||||
private _activeCellId: string;
|
private _activeCellId: string;
|
||||||
|
|
||||||
@@ -127,29 +126,13 @@ export class TextCellComponent extends CellView implements OnInit, OnChanges {
|
|||||||
}
|
}
|
||||||
|
|
||||||
public handleContentChanged(): void {
|
public handleContentChanged(): void {
|
||||||
if (!this._previewCssApplied) {
|
|
||||||
this.updatePreviewCssClass();
|
|
||||||
}
|
|
||||||
this.updatePreview();
|
this.updatePreview();
|
||||||
}
|
}
|
||||||
|
|
||||||
public toggleEditMode(editMode?: boolean): void {
|
public toggleEditMode(editMode?: boolean): void {
|
||||||
this.isEditMode = editMode !== undefined? editMode : !this.isEditMode;
|
this.isEditMode = editMode !== undefined? editMode : !this.isEditMode;
|
||||||
this.updatePreviewCssClass();
|
|
||||||
this.updatePreview();
|
this.updatePreview();
|
||||||
this._changeRef.detectChanges();
|
this._changeRef.detectChanges();
|
||||||
}
|
}
|
||||||
|
|
||||||
// Updates the css class to preview 'div' based on edit mode
|
|
||||||
private updatePreviewCssClass() {
|
|
||||||
let outputElement = <HTMLElement>this.output.nativeElement;
|
|
||||||
if (this.isEditMode && this.cellModel.source) {
|
|
||||||
outputElement.className = 'notebook-preview';
|
|
||||||
this._previewCssApplied = true;
|
|
||||||
}
|
|
||||||
else {
|
|
||||||
outputElement.className = '';
|
|
||||||
this._previewCssApplied = false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -11,4 +11,6 @@ text-cell-component .notebook-preview {
|
|||||||
border-top-width: 1px;
|
border-top-width: 1px;
|
||||||
border-top-style: solid;
|
border-top-style: solid;
|
||||||
user-select: initial;
|
user-select: initial;
|
||||||
|
padding-left: 8px;
|
||||||
|
padding-right: 8px;
|
||||||
}
|
}
|
||||||
Reference in New Issue
Block a user