diff --git a/src/vs/base/browser/ui/iconLabel/iconlabel.css b/src/vs/base/browser/ui/iconLabel/iconlabel.css index 651843fcc9..aa31b52cb9 100644 --- a/src/vs/base/browser/ui/iconLabel/iconlabel.css +++ b/src/vs/base/browser/ui/iconLabel/iconlabel.css @@ -32,6 +32,7 @@ .monaco-icon-label > .monaco-icon-label-description-container { overflow: hidden; /* this causes the label/description to shrink first if decorations are enabled */ text-overflow: ellipsis; + margin-right: auto; } .monaco-icon-label > .monaco-icon-label-description-container > .label-name { @@ -39,6 +40,12 @@ white-space: pre; /* enable to show labels that include multiple whitespaces */ } +.monaco-icon-label > .decorations-wrapper { + display: flex; + flex-direction: row; + padding-right: 12px; +} + .monaco-icon-label > .monaco-icon-label-description-container > .label-description { opacity: .7; margin-left: 0.5em; @@ -56,6 +63,5 @@ font-size: 90%; font-weight: 600; padding: 0 12px 0 5px; - margin-left: auto; text-align: center; } diff --git a/src/vs/workbench/browser/parts/activitybar/media/activitybarpart.css b/src/vs/workbench/browser/parts/activitybar/media/activitybarpart.css index 5a92b2e1f5..1d3c735e75 100644 --- a/src/vs/workbench/browser/parts/activitybar/media/activitybarpart.css +++ b/src/vs/workbench/browser/parts/activitybar/media/activitybarpart.css @@ -4,25 +4,130 @@ *--------------------------------------------------------------------------------------------*/ .monaco-workbench > .part.activitybar { - width: 50px; + width: 50px; } .monaco-workbench > .activitybar > .content { - height: 100%; - display: flex; - flex-direction: column; - justify-content: space-between; + height: 100%; + display: flex; + flex-direction: column; + justify-content: space-between; } .monaco-workbench > .activitybar > .content .monaco-action-bar { - text-align: left; - background-color: inherit; + text-align: left; + background-color: inherit; } .monaco-workbench > .activitybar .action-item:focus { - outline: 0 !important; /* activity bar indicates focus custom */ + outline: 0 !important; /* activity bar indicates focus custom */ } .monaco-workbench .activitybar > .content > .composite-bar > .monaco-action-bar .action-label.toggle-more { - -webkit-mask: url('ellipsis-global.svg') no-repeat 50% 50%; -} \ No newline at end of file + -webkit-mask: url("ellipsis-global.svg") no-repeat 50% 50%; +} + +.monaco-workbench .activitybar > .content > .extras-bar { + flex: 1; + display: flex; + flex-direction: column; + overflow: visible; +} + +.monaco-workbench .activitybar > .content > .extras-bar .toggle-terminal { + transition: 500ms color ease; + opacity: 0.65; + filter: brightness(115%); + padding-top: 10px; + padding-bottom: 10px; +} + +.monaco-workbench .activitybar > .content > .extras-bar .toggle-terminal:hover { + opacity: 1; +} + +.monaco-workbench .activitybar > .content > .extras-bar .toggle-terminal.disabled { + cursor: disabled; + opacity: 0.45 !important; +} + +.monaco-workbench .activitybar > .content > .extras-bar .toggle-terminal > .icon { + text-align: center; + display: block; +} + +.monaco-workbench .activitybar > .content > .extras-bar .toggle-terminal > .icon > svg { + width: 29px; + fill: currentColor; +} + +.monaco-workbench .activitybar > .content > .extras-bar .fasttime { + transition: 500ms color ease; + opacity: 0.65; + filter: brightness(115%); +} + +.monaco-workbench .activitybar > .content > .extras-bar .fasttime:hover { + opacity: 1; +} + +.monaco-workbench .activitybar > .content > .extras-bar .fasttime.disabled { + cursor: disabled; + opacity: 0.45 !important; +} + +.monaco-workbench .activitybar > .content > .extras-bar .fasttime > .icon { + text-align: center; + display: block; +} + +.monaco-workbench .activitybar > .content > .extras-bar .fasttime > .icon > svg { + width: 22px; + fill: currentColor; +} + +.monaco-workbench .activitybar > .content > .extras-bar .fasttime > .text { + font-size: 12px; + text-align: center; +} + +.monaco-workbench .activitybar > .content > .extras-bar .fasttime > .text.unknown { + font-size: 8px; + opacity: 0; +} + +.monaco-workbench .activitybar > .content > .extras-bar > .feedback { + transition: 500ms color ease; + padding-top: 10px; + padding-bottom: 10px; + margin-left: 0px; + margin-top: auto; + flex: 0; + cursor: default; +} + +.monaco-workbench .activitybar > .content > .extras-bar .feedback > .icon { + text-align: center; + display: block; + opacity: 0.65; + filter: brightness(115%); + cursor: pointer; +} + +.monaco-workbench .activitybar > .content > .extras-bar .feedback .feedback { + position: initial; + margin-left: 0px; +} + +.monaco-workbench .activitybar > .content > .extras-bar .feedback .feedback-dropdown { + bottom: -63px; +} + +.monaco-workbench .activitybar > .content > .extras-bar .feedback:hover > .icon { + opacity: 1; +} + +.monaco-workbench .activitybar > .content > .extras-bar .feedback > .icon > svg { + width: 29px; + fill: currentColor; +}