mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-01-17 17:22:42 -05:00
8ff53281f9
* initial changes for actionbar collapsing * fix more not always all showing after resizing * collapse toolbar if window size is already small when dashboard is opened * make wrapping default behavior and collapse opt in * fix so keyboard navigation works in overflow * more keyboard fixing so that the actions in overflow get triggered * change overflow background with theme * change margin * udpate more button * use icon for ... * addressing comments * overflow css changes to match portal * arrow navigation working * handle tab and shift tab in overflow * keep arrow navigation within overflow * move reused code to helper methods * set roles for overflow * use actionsList instead of document.getElementById all the time * move collapsible action bar to its own class * renamve to overflowActionBar * fix focus rectangle around more element * hide overflow after an action is executed * hide overflow when clicking an action * hide overflow when focus leaves and loop focus within overflow when using arrow keys * fix double down arrow to move focus in overflow * update comment * fix clicking more not hiding overflow * add box-shadow for themes * fix hygiene error * fix hygiene error * widen focused outline for overflow actions
142 lines
2.6 KiB
CSS
142 lines
2.6 KiB
CSS
/*---------------------------------------------------------------------------------------------
|
|
* Copyright (c) Microsoft Corporation. All rights reserved.
|
|
* Licensed under the Source EULA. See License.txt in the project root for license information.
|
|
*--------------------------------------------------------------------------------------------*/
|
|
|
|
/* CSS Properties ported from taskbar.css */
|
|
|
|
.monaco-toolbar .dropdown > .dropdown-label:not(:empty):not(.tick) {
|
|
padding: 0;
|
|
}
|
|
|
|
.monaco-toolbar .toolbar-toggle-more {
|
|
display: inline-block;
|
|
padding: 0;
|
|
}
|
|
|
|
/* Taskbar */
|
|
|
|
.carbon-taskbar {
|
|
width: 100%;
|
|
position: relative;
|
|
}
|
|
|
|
.carbon-taskbar .monaco-action-bar {
|
|
padding: 2px 0px 2px 0px;
|
|
}
|
|
|
|
.carbon-taskbar.monaco-toolbar .monaco-action-bar.animated .actions-container {
|
|
justify-content: flex-start;
|
|
padding-left: 15px;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.taskbar-progress {
|
|
padding-left: 5px;
|
|
padding-top: 5px;
|
|
width: 15px;
|
|
height: 15px;
|
|
}
|
|
|
|
.carbon-taskbar .monaco-action-bar li {
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
|
|
.carbon-taskbar .action-item {
|
|
margin-right: 5px;
|
|
}
|
|
|
|
.carbon-taskbar .action-item.more {
|
|
padding-right: 15px;
|
|
}
|
|
|
|
.carbon-taskbar .action-label {
|
|
background-repeat: no-repeat;
|
|
background-position: 0% 50%;
|
|
padding-left: 15px;
|
|
}
|
|
|
|
.carbon-taskbar .action-item-label {
|
|
display: flex;
|
|
padding-right: 5px;
|
|
}
|
|
|
|
.listDatabasesSelectBox {
|
|
padding-left: 2px;
|
|
min-width: 100px;
|
|
}
|
|
|
|
.carbon-taskbar.monaco-toolbar .monaco-action-bar.animated .actions-container .action-item
|
|
.configuration.select-container .select-box {
|
|
margin-top: 4px;
|
|
margin-top: 3px;
|
|
}
|
|
|
|
.taskbarSeparator {
|
|
width: 1px;
|
|
background-color:#A5A5A5;
|
|
margin: 6px 8px;
|
|
}
|
|
|
|
.taskbarTextSeparator {
|
|
margin-left: 3px;
|
|
margin-right: 3px;
|
|
margin-top: 4px;
|
|
}
|
|
|
|
/* Taskbar Icons */
|
|
|
|
.carbon-taskbar .codicon {
|
|
background-size: 11px;
|
|
}
|
|
|
|
.carbon-taskbar .overflow {
|
|
position:absolute;
|
|
right:0;
|
|
display:none;
|
|
z-index: 3;
|
|
padding-left: 0;
|
|
margin-top: 6px;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
.vs-dark .carbon-taskbar .overflow {
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.hc-black .carbon-taskbar .overflow {
|
|
box-shadow: none;
|
|
}
|
|
|
|
.carbon-taskbar .overflow li {
|
|
padding: 5px;
|
|
margin-right: 0;
|
|
}
|
|
|
|
.carbon-taskbar .overflow li.focused a.action-label {
|
|
outline: none;
|
|
}
|
|
|
|
.carbon-taskbar .overflow a {
|
|
padding-left: 20px;
|
|
}
|
|
|
|
.carbon-taskbar .actions-container .action-item .action-label.moreActionsElement {
|
|
height: 18px;
|
|
margin-top: 3px;
|
|
background-position: center;
|
|
padding-right: 20px;
|
|
}
|
|
|
|
.carbon-taskbar .overflow .action-item .action-label{
|
|
background-size: 16px;
|
|
background-position: left;
|
|
}
|
|
|
|
.overflow .taskbarSeparator {
|
|
height: 1px;
|
|
width: 100%;
|
|
margin-left: 0;
|
|
}
|