add shadow/border to breadcrumb picker

This commit is contained in:
Johannes Rieken 2018-07-09 17:25:59 +02:00
parent 25cabacf5d
commit 8422fccff1
2 changed files with 9 additions and 2 deletions

View file

@ -227,7 +227,10 @@ export class EditorBreadcrumbs implements IEditorBreadcrumbs {
return event.node;
},
render: (container: HTMLElement) => {
dom.addClasses(container, 'monaco-workbench', 'show-file-icons');
dom.addClasses(container, 'monaco-breadcrumbs-picker', 'monaco-workbench', 'show-file-icons');
let color = this._themeService.getTheme().getColor(SIDE_BAR_BACKGROUND);
container.style.borderColor = color.darken(.2).toString();
container.style.boxShadow = `${color.toString()} 6px 6px 6px -6px;`;
let { element } = event.item as Item;
let ctor: IConstructorSignature2<HTMLElement, BreadcrumbElement, BreadcrumbsPicker> = element instanceof FileElement ? BreadcrumbsFilePicker : BreadcrumbsOutlinePicker;
let res = this._instantiationService.createInstance(ctor, container, element);
@ -294,7 +297,6 @@ export abstract class BreadcrumbsPicker {
this.focus = dom.trackFocus(this._domNode);
this.focus.onDidBlur(_ => this._onDidPickElement.fire(undefined), undefined, this._disposables);
this._tree.domFocus();
this._tree.setInput(this._getInput(input));
}

View file

@ -11,3 +11,8 @@
.monaco-workbench>.part.editor>.content .editor-group-container .editor-breadcrumbs .monaco-breadcrumbs .monaco-breadcrumb-item:nth-child(2) { /*first-child is the style-element*/
padding-left: 8px;
}
.monaco-breadcrumbs-picker {
border: 1px #dddddd solid;
box-shadow: #dddddd 6px 6px 6px -6px;
}