mirror of
https://github.com/Azure/cosmos-explorer.git
synced 2024-12-22 08:34:49 +00:00
280 lines
5.0 KiB
Plaintext
280 lines
5.0 KiB
Plaintext
|
@import "./Common/Constants";
|
||
|
|
||
|
.main {
|
||
|
width: 100%;
|
||
|
float: left;
|
||
|
transition: all .0s ease-in-out;
|
||
|
-ms-transition: all 0s ease-in-out;
|
||
|
-webkit-transition: all 0s ease-in-out;
|
||
|
-moz-transition: all .0s ease-in-out;
|
||
|
height: 100%;
|
||
|
background-color: white;
|
||
|
border-left: 0px solid white;
|
||
|
}
|
||
|
|
||
|
.resourceTree {
|
||
|
height: 100%;
|
||
|
flex: 0 0 auto;
|
||
|
}
|
||
|
|
||
|
.resourceTreeScroll {
|
||
|
height: 100%;
|
||
|
display: flex;
|
||
|
overflow-y: auto;
|
||
|
overflow-x: hidden;
|
||
|
padding-right: 10px;
|
||
|
}
|
||
|
|
||
|
.userSelectNone {
|
||
|
-webkit-user-select: none;
|
||
|
-moz-user-select: none;
|
||
|
-ms-user-select: none;
|
||
|
}
|
||
|
|
||
|
.treeHovermargin {
|
||
|
margin-left: 16px;
|
||
|
}
|
||
|
|
||
|
.highlight {
|
||
|
padding: @SmallSpace 2px;
|
||
|
outline: 0;
|
||
|
|
||
|
&:hover {
|
||
|
.hover();
|
||
|
}
|
||
|
|
||
|
&:active {
|
||
|
.active();
|
||
|
}
|
||
|
|
||
|
&:focus {
|
||
|
.focus();
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.contextmenushowing {
|
||
|
background-color: #EEE;
|
||
|
}
|
||
|
|
||
|
.collectionstree {
|
||
|
width: 100%;
|
||
|
margin-top: @DefaultSpace;
|
||
|
|
||
|
|
||
|
.databaseList {
|
||
|
list-style-type: none;
|
||
|
padding-left: 0px;
|
||
|
|
||
|
.collectionList {
|
||
|
padding-left:(2 * @MediumSpace);
|
||
|
}
|
||
|
|
||
|
.collectionChildList {
|
||
|
padding-left: @LargeSpace;
|
||
|
}
|
||
|
|
||
|
.databaseDocuments {
|
||
|
padding-left: (5 * @MediumSpace);
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.pointerCursor {
|
||
|
cursor: pointer;
|
||
|
}
|
||
|
|
||
|
.menuEllipsis {
|
||
|
padding-right: 6px;
|
||
|
font-weight: bold;
|
||
|
font-size: 18px;
|
||
|
position: relative;
|
||
|
top: -5px;
|
||
|
left: 0px;
|
||
|
float: right;
|
||
|
display: none;
|
||
|
padding-left: 6px!important;
|
||
|
line-height: @TreeLineHeight;
|
||
|
}
|
||
|
|
||
|
.databaseMenu {
|
||
|
.flex-display();
|
||
|
}
|
||
|
|
||
|
.databaseMenu:hover .menuEllipsis,
|
||
|
.databaseMenu:focus .menuEllipsis {
|
||
|
display: block;
|
||
|
}
|
||
|
|
||
|
.databaseCollChildTextOverflow {
|
||
|
text-overflow: ellipsis;
|
||
|
white-space: nowrap;
|
||
|
overflow: hidden;
|
||
|
flex: 1;
|
||
|
}
|
||
|
|
||
|
.collectionMenu {
|
||
|
.flex-display();
|
||
|
}
|
||
|
|
||
|
.collectionMenu:hover .menuEllipsis,
|
||
|
.collectionMenu:focus .menuEllipsis {
|
||
|
display: block;
|
||
|
}
|
||
|
|
||
|
.documentsMenu:hover .menuEllipsis,
|
||
|
.documentsMenu:focus .menuEllipsis {
|
||
|
display: block;
|
||
|
}
|
||
|
|
||
|
.treeChildMenu {
|
||
|
display: flex;
|
||
|
}
|
||
|
|
||
|
.storedProcedureMenu:hover .menuEllipsis,
|
||
|
.storedProcedureMenu:focus .menuEllipsis {
|
||
|
display: block;
|
||
|
}
|
||
|
|
||
|
.childMenu {
|
||
|
overflow: hidden;
|
||
|
text-overflow: ellipsis;
|
||
|
white-space: nowrap;
|
||
|
padding-left: (6 * @MediumSpace);
|
||
|
width: 100%;
|
||
|
}
|
||
|
|
||
|
.storedChildMenu:hover .menuEllipsis,
|
||
|
.storedChildMenu:focus .menuEllipsis {
|
||
|
display: block;
|
||
|
}
|
||
|
|
||
|
.contextmenu6 {
|
||
|
top: -29px;
|
||
|
}
|
||
|
|
||
|
.userDefinedMenu:hover .contextmenu6 {
|
||
|
display: block;
|
||
|
}
|
||
|
|
||
|
.userDefinedchildMenu:hover .menuEllipsis,
|
||
|
.userDefinedchildMenu:focus .menuEllipsis {
|
||
|
display: block;
|
||
|
}
|
||
|
|
||
|
.triggersMenu:hover .menuEllipsis,
|
||
|
.triggersMenu:focus .menuEllipsis {
|
||
|
display: block;
|
||
|
}
|
||
|
|
||
|
.triggersChildMenu:hover .menuEllipsis,
|
||
|
.triggersChildMenu:focus .menuEllipsis {
|
||
|
display: block;
|
||
|
}
|
||
|
|
||
|
.databaseId {
|
||
|
font-size: 14px;
|
||
|
}
|
||
|
|
||
|
.storedUdfTriggerMenu {
|
||
|
padding-left: 0px;
|
||
|
}
|
||
|
|
||
|
.collectionstree img {
|
||
|
width: 16px;
|
||
|
height: 16px;
|
||
|
vertical-align: text-top;
|
||
|
}
|
||
|
|
||
|
img.collectionsTreeCollapseExpand {
|
||
|
width: 10px;
|
||
|
height: 10px;
|
||
|
vertical-align: middle;
|
||
|
margin-bottom: 5px;
|
||
|
}
|
||
|
|
||
|
.collapsed::before {
|
||
|
content: "\23F5";
|
||
|
margin-left: 0px;
|
||
|
font-size: 15px;
|
||
|
}
|
||
|
|
||
|
.expanded::before {
|
||
|
content: '\23F7';
|
||
|
margin-left: 0px;
|
||
|
font-size: 15px;
|
||
|
}
|
||
|
|
||
|
.collectionMenuChildren {
|
||
|
padding-left: 42px;
|
||
|
}
|
||
|
|
||
|
.main-nav {
|
||
|
width: 100vh;
|
||
|
height: 40px;
|
||
|
background: white;
|
||
|
transform-origin: left top;
|
||
|
-webkit-transform-origin: left top;
|
||
|
-ms-transform-origin: left top;
|
||
|
transform: rotate(-90deg) translateX(-100%);
|
||
|
-webkit-transform: rotate(-90deg) translateX(-100%);
|
||
|
-ms-transform: rotate(-90deg) translateX(-100%);
|
||
|
border-bottom: 1px solid #CCC;
|
||
|
}
|
||
|
|
||
|
.main-nav-img {
|
||
|
width: 16px;
|
||
|
height: 16px;
|
||
|
margin: -32px 0 0 0;
|
||
|
transform: rotate(-90deg) translateX(-100%);
|
||
|
-webkit-transform: rotate(-90deg) translateX(-100%);
|
||
|
-ms-transform: rotate(-90deg) translateX(-100%);
|
||
|
}
|
||
|
|
||
|
.main-nav-img.main-nav-sub-img {
|
||
|
width: 16px;
|
||
|
height: 16px;
|
||
|
margin: 0px 0px 0 0;
|
||
|
transform: rotate(180deg) translateX(0%);
|
||
|
-webkit-transform: rotate(180deg) translateX(0%);
|
||
|
-ms-transform: rotate(180deg) translateX(0%);
|
||
|
position: absolute;
|
||
|
right: -8px;
|
||
|
top: 16px;
|
||
|
}
|
||
|
|
||
|
ul.nav {
|
||
|
margin: 0 auto;
|
||
|
margin-top: 0px;
|
||
|
margin-left: 0px;
|
||
|
}
|
||
|
|
||
|
.mini ul.nav li {
|
||
|
float: right;
|
||
|
line-height: 25px;
|
||
|
height: auto;
|
||
|
margin-top: 3px;
|
||
|
}
|
||
|
|
||
|
.spancolchildstyle {
|
||
|
padding: 4px;
|
||
|
}
|
||
|
|
||
|
.contextmenubutton {
|
||
|
float: right;
|
||
|
display: none;
|
||
|
}
|
||
|
|
||
|
.highlight:hover>.contextmenubutton {
|
||
|
display: unset;
|
||
|
}
|
||
|
|
||
|
.highlight:hover>.contextmenubutton::after {
|
||
|
content: "\2026";
|
||
|
font-size: 12px;
|
||
|
}
|
||
|
|
||
|
.showEllipsis {
|
||
|
text-overflow: ellipsis;
|
||
|
white-space: nowrap;
|
||
|
overflow: hidden;
|
||
|
}
|