proxmox-mirrors/pve-manager
1
0
Fork 0
mirror of https://git.proxmox.com/git/pve-manager synced 2025-08-10 14:57:47 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

add new tree and grid classes for the 'unknown' status

Browse Source 
this displays a '?' similar to the check/cross, to show something
is wrong, but we do not know if its offline

also cleanup the classes a bit, so we do not have to have so many
different ones

Signed-off-by: Dominik Csapak <d.csapak@proxmox.com>
This commit is contained in:
Dominik Csapak 2017-11-03 09:51:36 +01:00 committed by Fabian Grünbichler
parent 03f18f5e0b
commit 2fa8270b21
1 changed files with 58 additions and 75 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

133
www/css/ext6-pve.css
View File

@ -55,7 +55,8 @@
/* overwrite folder icons of theme */ /* overwrite folder icons of theme */
.x-tree-icon-parent, .x-tree-icon-parent,
.x-tree-icon-parent-expanded { .x-tree-icon-parent-expanded,
.x-tree-icon-leaf {
background: none; background: none;
display: inline-block; display: inline-block;
font: normal normal normal 14px/1 FontAwesome; font: normal normal normal 14px/1 FontAwesome;
@ -93,15 +94,7 @@
/* tree icons */ /* tree icons */
/* big symbols */ /* big symbols */
.x-fa-tree, .x-tree-icon-custom {
.x-fa-tree-running,
.x-fa-tree-stopped,
.x-fa-tree-paused,
.x-fa-tree-online,
.x-fa-tree-offline,
.x-fa-tree-template-lxc,
.x-fa-tree-template-qemu,
.x-fa-tree-datacenter {
font-size: 1.25em; font-size: 1.25em;
line-height: 1.6em; line-height: 1.6em;
color: #555; color: #555;
@ -109,41 +102,29 @@
} }
/* grid icons (resources, etc) */ /* grid icons (resources, etc) */
.x-fa-grid, .x-grid-icon-custom {
.x-fa-grid-running,
.x-fa-grid-stopped,
.x-fa-grid-paused,
.x-fa-grid-online,
.x-fa-grid-offline,
.x-fa-grid-template-lxc,
.x-fa-grid-template-qemu {
font-size: 1.25em; font-size: 1.25em;
color: #555; color: #555;
margin-right: 5px; margin-right: 5px;
} }
/* the running vms are darker */ /* the running vms are darker */
.x-fa-tree-running, .x-tree-icon-custom.running,
.x-fa-grid-running { .x-grid-icon-custom.running {
color: #000; color: #000;
} }
/* stopped and offline items are greyed out */
.x-tree-icon-custom.stopped,
.x-grid-icon-custom.stopped,
.x-tree-icon-custom.offline,
.x-grid-icon-custom.offline {
color: #cfcfcf;
}
/* the small icons */ /* the small icons */
.x-fa-tree-running:after, .x-tree-icon-custom:after,
.x-fa-tree-stopped:after, .x-grid-icon-custom:after {
.x-fa-tree-paused:after,
.x-fa-tree-template-lxc:after,
.x-fa-tree-template-qemu:after,
.x-fa-tree-online:after,
.x-fa-tree-offline:after,
.x-fa-grid:after,
.x-fa-grid-running:after,
.x-fa-grid-stopped:after,
.x-fa-grid-paused:after,
.x-fa-grid-online:after,
.x-fa-grid-offline:after,
.x-fa-grid-template-lxc:after,
.x-fa-grid-template-qemu:after {
position: relative; position: relative;
left: -5px; left: -5px;
top: 1px; top: 1px;
@ -152,79 +133,81 @@
content: "\ "; content: "\ ";
} }
.x-fa-tree-online:after, /* the green check */
.x-fa-grid-online:after { .x-tree-icon-custom.online:after,
.x-grid-icon-custom.online:after {
content: "\f058"; content: "\f058";
color: #21BF4B; color: #21BF4B;
} }
.x-fa-tree-offline:after, /* the red x */
.x-fa-grid-offline:after { .x-tree-icon-custom.offline:after,
.x-grid-icon-custom.offline:after,
.x-tree-icon-custom.ha-error:after,
.x-grid-icon-custom.ha-error:after {
content: "\f057"; content: "\f057";
color: #CC1800; color: #CC1800;
} }
.x-fa-tree-running:after, /* the grey '?' */
.x-fa-grid-running:after { .x-tree-icon-custom.unknown:after,
.x-grid-icon-custom.unknown:after {
content: "\f059";
color: #888;
}
/* the play symbol */
.x-tree-icon-custom.running:after,
.x-grid-icon-custom.running:after {
content: "\f04b"; content: "\f04b";
color: #21BF4B; color: #21BF4B;
} }
.x-fa-tree-paused:after, /* the pause symbol */
.x-fa-grid-paused:after { .x-tree-icon-custom.paused:after,
.x-grid-icon-custom.paused:after {
content: "\f04c"; content: "\f04c";
color: #CC8E00; color: #CC8E00;
font-size: 0.6em; font-size: 0.6em;
} }
.x-fa-tree-stopped, /* the warning triangle symbol */
.x-fa-grid-stopped, .x-tree-icon-custom.nearfull:after,
.x-fa-tree-offline, .x-grid-icon-custom.nearfull:after {
.x-fa-grid-offline { content: "\f071";
color: #cfcfcf; color: #CC8E00;
} }
/* /* the error triangle symbol */
.x-fa-tree-stopped:after { .x-tree-icon-custom.full:after,
content: "\f04d"; .x-grid-icon-custom.full:after {
color: #f5c5c5; content: "\f071";
font-size: 0.5em; color: #CC1800;
} }
*/
.x-fa-tree-template-lxc:after, /* the lxc template */
.x-fa-grid-template-lxc:after { .x-tree-icon-custom.lxc:after,
.x-grid-icon-custom.lxc:after {
content: "\f1b2"; content: "\f1b2";
background: #fff; background: #fff;
} }
/* the qemu template */
.x-fa-tree-template-qemu:after, .x-tree-icon-custom.qemu:after,
.x-fa-grid-template-qemu:after { .x-grid-icon-custom.qemu:after {
content : "\f108"; content : "\f108";
background: #fff; background: #fff;
} }
.x-grid-item-over /* fixes background on mouseover and selected items */
.x-fa-tree-template-qemu:after, .x-grid-item-over .qemu:after,
.x-grid-item-over .x-grid-item-over .lxc:after {
.x-fa-tree-template-lxc:after,
.x-grid-item-over
.x-fa-grid-template-qemu:after,
.x-grid-item-over
.x-fa-grid-template-lxc:after {
background-color: #e2eff9; background-color: #e2eff9;
text-shadow: -1px 0px 2px #e2eff9; text-shadow: -1px 0px 2px #e2eff9;
} }
.x-grid-item-selected .x-grid-item-selected .qemu:after,
.x-fa-tree-template-qemu:after, .x-grid-item-selected .lxc:after {
.x-grid-item-selected
.x-fa-tree-template-lxc:after,
.x-grid-item-selected
.x-fa-grid-template-qemu:after,
.x-grid-item-selected
.x-fa-grid-template-lxc:after {
background-color: #c2ddf2; background-color: #c2ddf2;
text-shadow: -1px 0px 2px #c2ddf2; text-shadow: -1px 0px 2px #c2ddf2;
} }