diff --git a/src/vs/editor/contrib/suggest/browser/media/suggest.css b/src/vs/editor/contrib/suggest/browser/media/suggest.css index 4febb443944f468f43186dfca160635172fe15bb..5e2b764763e1f230a727a3d677a6ec639c63c794 100644 --- a/src/vs/editor/contrib/suggest/browser/media/suggest.css +++ b/src/vs/editor/contrib/suggest/browser/media/suggest.css @@ -87,7 +87,7 @@ font-weight: bold; } -.monaco-editor .suggest-widget .details > .monaco-scrollable-element > .body > .header > .close, +.monaco-editor .suggest-widget .details > .monaco-scrollable-element > .body > .close, .monaco-editor .suggest-widget .monaco-list .monaco-list-row > .contents > .main > .docs-details { opacity: 0.6; background-position: center center; @@ -96,15 +96,16 @@ cursor: pointer; } -.monaco-editor .suggest-widget .details > .monaco-scrollable-element > .body > .header > .close { +.monaco-editor .suggest-widget .details > .monaco-scrollable-element > .body > .close { background-image: url('./close.svg'); + float: right; } .monaco-editor .suggest-widget .monaco-list .monaco-list-row > .contents > .main > .docs-details { background-image: url('./info.svg'); } -.monaco-editor .suggest-widget .details > .monaco-scrollable-element > .body > .header > .close:hover, +.monaco-editor .suggest-widget .details > .monaco-scrollable-element > .body > .close:hover, .monaco-editor .suggest-widget .monaco-list .monaco-list-row > .contents > .main > .docs-details:hover { opacity: 1; } @@ -203,14 +204,7 @@ white-space: pre-wrap; } -.monaco-editor .suggest-widget .details > .monaco-scrollable-element > .body > .header { - padding: 4px 5px; - display: flex; - box-sizing: border-box; - border-bottom: 1px solid rgba(204, 204, 204, 0.5); -} - -.monaco-editor .suggest-widget .details > .monaco-scrollable-element > .body > .header > .type { +.monaco-editor .suggest-widget .details > .monaco-scrollable-element > .body > .type { flex: 2; overflow: hidden; text-overflow: ellipsis; @@ -231,8 +225,8 @@ /* High Contrast and Dark Theming */ -.monaco-editor.vs-dark .suggest-widget .details > .monaco-scrollable-element > .body > .header > .close, -.monaco-editor.hc-black .suggest-widget .details > .monaco-scrollable-element > .body > .header > .close { +.monaco-editor.vs-dark .suggest-widget .details > .monaco-scrollable-element > .body > .close, +.monaco-editor.hc-black .suggest-widget .details > .monaco-scrollable-element > .body > .close { background-image: url('./close-dark.svg'); } diff --git a/src/vs/editor/contrib/suggest/browser/suggestWidget.ts b/src/vs/editor/contrib/suggest/browser/suggestWidget.ts index 36ba2953a93a0e57ace93a5760508dcc0ff060e5..7c7fc8c1869143931a28f69631d352881f0be8aa 100644 --- a/src/vs/editor/contrib/suggest/browser/suggestWidget.ts +++ b/src/vs/editor/contrib/suggest/browser/suggestWidget.ts @@ -186,7 +186,6 @@ class SuggestionDetails { private el: HTMLElement; private close: HTMLElement; - private header: HTMLElement; private scrollbar: DomScrollableElement; private body: HTMLElement; private type: HTMLElement; @@ -211,11 +210,10 @@ class SuggestionDetails { append(this.el, this.scrollbar.getDomNode()); this.disposables.push(this.scrollbar); - this.header = append(this.body, $('.header')); - this.type = append(this.header, $('p.type')); - - this.close = append(this.header, $('span.close')); + this.close = append(this.body, $('span.close')); this.close.title = nls.localize('readLess', "Read less...{0}", triggerKeybindingLabel); + this.type = append(this.body, $('p.type')); + this.docs = append(this.body, $('p.docs')); this.ariaLabel = null; @@ -243,7 +241,7 @@ class SuggestionDetails { this.type.innerText = item.suggestion.detail || ''; this.docs.textContent = item.suggestion.documentation; - this.el.style.height = this.header.offsetHeight + this.docs.offsetHeight + 'px'; + this.el.style.height = this.type.offsetHeight + this.docs.offsetHeight + 'px'; this.close.onmousedown = e => { e.preventDefault();