mirror of
https://github.com/ckaczor/azuredatastudio.git
synced 2026-01-18 09:35:39 -05:00
Dashboard toolbar overflow (#9796)
* 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
This commit is contained in:
@@ -47,6 +47,10 @@
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.carbon-taskbar .action-item.more {
|
||||
padding-right: 15px;
|
||||
}
|
||||
|
||||
.carbon-taskbar .action-label {
|
||||
background-repeat: no-repeat;
|
||||
background-position: 0% 50%;
|
||||
@@ -86,3 +90,52 @@
|
||||
.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;
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user