ckaczor/azuredatastudio
1
0
Fork 0
mirror of https://github.com/ckaczor/azuredatastudio.git synced 2026-01-21 17:22:55 -05:00
Code Issues Packages Projects Releases Wiki Activity

Fix properties container and overflow actionbar styles (#10180)

Browse Source 
* Fix styles

* Undo bold
This commit is contained in:
Charles Gagnon
2020-04-28 16:27:07 -07:00
committed by GitHub
parent 98f3f57f77
commit 750f6e6559
9 changed files with 101 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
src/sql/base/browser/ui/propertiesContainer/media/propertiesContainer.css
View File

@@ -28,14 +28,17 @@ properties-container .columnLayout.property {
flex-direction: column;
}
properties-container .propertyName {
properties-container .propertyName,
properties-container .splitter {
opacity: 0.6;
font-size: 12px;
flex: 0 0 auto
}
.vs-dark properties-container .propertyName,
.hc-black properties-container .propertyName {
.hc-black properties-container .propertyName,
.vs-dark properties-container .splitter,
.hc-black properties-container .splitter {
opacity: 1;
}

2
src/sql/base/browser/ui/taskbar/overflowActionbar.ts
View File

@@ -2,8 +2,6 @@
* Copyright (c) Microsoft Corporation. All rights reserved.
* Licensed under the Source EULA. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
import 'sql/base/browser/ui/taskbar/overflowActionbarStyles';
import { IAction } from 'vs/base/common/actions';
import { StandardKeyboardEvent } from 'vs/base/browser/keyboardEvent';
import { KeyCode, KeyMod } from 'vs/base/common/keyCodes';

43
src/sql/base/browser/ui/taskbar/overflowActionbarStyles.ts
View File

@@ -1,43 +0,0 @@
/*---------------------------------------------------------------------------------------------
* Copyright (c) Microsoft Corporation. All rights reserved.
* Licensed under the Source EULA. See License.txt in the project root for license information.
*--------------------------------------------------------------------------------------------*/
// eslint-disable-next-line code-import-patterns
import { registerThemingParticipant, IColorTheme, ICssStyleCollector } from 'vs/platform/theme/common/themeService';
// eslint-disable-next-line code-import-patterns
import { EDITOR_PANE_BACKGROUND, DASHBOARD_BORDER, TOOLBAR_OVERFLOW_SHADOW } from 'vs/workbench/common/theme';
// eslint-disable-next-line code-import-patterns
import { focusBorder } from 'vs/platform/theme/common/colorRegistry';
registerThemingParticipant((theme: IColorTheme, collector: ICssStyleCollector) => {
const overflowBackground = theme.getColor(EDITOR_PANE_BACKGROUND);
if (overflowBackground) {
collector.addRule(`.carbon-taskbar .overflow {
background-color: ${overflowBackground};
}`);
}
const overflowShadow = theme.getColor(TOOLBAR_OVERFLOW_SHADOW);
if (overflowShadow) {
collector.addRule(`.carbon-taskbar .overflow {
box-shadow: 0px 4px 4px ${overflowShadow};
}`);
}
const border = theme.getColor(DASHBOARD_BORDER);
if (border) {
collector.addRule(`.carbon-taskbar .overflow {
border: 1px solid ${border};
}`);
}
const activeOutline = theme.getColor(focusBorder);
if (activeOutline) {
collector.addRule(`.carbon-taskbar .overflow li.focused {
outline: 1px solid;
outline-offset: -3px;
outline-color: ${activeOutline}
}`);
}
});

8
src/sql/base/browser/ui/taskbar/taskbar.ts
View File

@@ -25,6 +25,10 @@ export interface ITaskbarContent {
element?: HTMLElement;
}
export interface ITaskbarOptions extends IToolBarOptions {
collapseOverflow?: boolean
}
/**
* A widget that combines an action bar for actions. This class was needed because we
* want the ability to use the custom QueryActionBar in order to display other HTML
@@ -34,14 +38,14 @@ export class Taskbar {
private options: IToolBarOptions;
private actionBar: ActionBar;
constructor(container: HTMLElement, options: IToolBarOptions = { orientation: ActionsOrientation.HORIZONTAL }, collapseOverflow: boolean = false) {
constructor(container: HTMLElement, options: ITaskbarOptions = { orientation: ActionsOrientation.HORIZONTAL }) {
this.options = options;
let element = document.createElement('div');
element.className = 'monaco-toolbar carbon-taskbar';
container.appendChild(element);
if (collapseOverflow) {
if (options.collapseOverflow) {
this.actionBar = new OverflowActionBar(
element,
{