Change server group look (#13608)

* change server group look

* remove dead code

* add top padding

* add bot padding as well

* fix heights to account for padding

* fix arrow alignment

* fix ellipses and node length parity

* fix alignment
This commit is contained in:
Aditya Bist
2020-12-09 10:54:47 -08:00
committed by GitHub
parent 15b8fa72ec
commit 91522caa67
2 changed files with 24 additions and 18 deletions

View File

@@ -40,8 +40,8 @@
}
.server-explorer-viewlet .server-group {
height: 38px;
line-height: 38px;
height: 23px;
line-height: 23px;
color: #ffffff;
}
@@ -96,6 +96,23 @@
overflow: hidden;
}
/* OE server group */
.monaco-tree .monaco-tree-rows > .monaco-tree-row > .content.server-group,
.monaco-tree .monaco-tree-rows > .monaco-tree-row > .content.server-group > .server-group {
padding-left: 5px;
}
.monaco-tree .monaco-tree-rows > .monaco-tree-row > .content.server-group {
padding-right: 5px;
padding-top: 5px;
}
.monaco-tree .monaco-tree-rows > .monaco-tree-row > .content.server-group > .server-group > .name {
text-overflow: ellipsis;
overflow: hidden;
}
/* OE and connection label */
.monaco-tree .monaco-tree-rows > .monaco-tree-row > .content > .connection-tile > .label,
.monaco-tree .monaco-tree-rows > .monaco-tree-row > .content > .object-element-group > .label,
@@ -161,16 +178,6 @@
background: rgba(255, 255, 255, 80%);
}
.monaco-tree .monaco-tree-rows.show-twisties > .monaco-tree-row.expanded.has-children > .content.server-group:before,
.monaco-list .monaco-list-rows.show-twisties > .monaco-list-row.expanded.has-children > .content.server-group:before {
background: url('expanded-dark.svg') 50% 50% no-repeat;
}
.monaco-tree .monaco-tree-rows.show-twisties > .monaco-tree-row.has-children > .content.server-group:before,
.monaco-list .monaco-list-rows.show-twisties > .monaco-list-row.has-children > .content.server-group:before {
background: url('collapsed-dark.svg') 50% 50% no-repeat;
}
/* Add connection button */
.server-explorer-viewlet .button-section {
padding: 20px;

View File

@@ -45,7 +45,7 @@ export interface IObjectExplorerTemplateData {
export class ServerTreeRenderer implements IRenderer {
public static CONNECTION_HEIGHT = 23;
public static CONNECTION_GROUP_HEIGHT = 38;
public static CONNECTION_GROUP_HEIGHT = 33;
public static CONNECTION_TEMPLATE_ID = 'connectionProfile';
public static CONNECTION_GROUP_TEMPLATE_ID = 'connectionProfileGroup';
public static OBJECTEXPLORER_HEIGHT = 23;
@@ -231,14 +231,13 @@ export class ServerTreeRenderer implements IRenderer {
}
private renderConnectionProfileGroup(connectionProfileGroup: ConnectionProfileGroup, templateData: IConnectionProfileGroupTemplateData): void {
let rowElement = this.findParentElement(templateData.root, 'monaco-tree-row');
if (rowElement) {
let groupElement = this.findParentElement(templateData.root, 'server-group');
if (groupElement) {
if (connectionProfileGroup.color) {
rowElement.style.background = connectionProfileGroup.color;
groupElement.style.background = connectionProfileGroup.color;
} else {
// If the group doesn't contain specific color, assign the default color
rowElement.style.background = DefaultServerGroupColor;
groupElement.style.background = DefaultServerGroupColor;
}
}
if (connectionProfileGroup.description && (connectionProfileGroup.description !== '')) {