/* Machines (VMs) related styles */ .grid-view .build-progress { animation: progress_animation 5s infinite, pulse 1s infinite; -webkit-animation: progress_animation 5s infinite, pulse 1s infinite; } .list-view .build-progress { animation: progress_animation_list 5s infinite, pulse 1s infinite; -webkit-animation: progress_animation_list 5s infinite, pulse 1s infinite; } .reboot-progress { animation: reboot_pulse 1s infinite; -webkit-animation: reboot_pulse 1s infinite; } @include keyframes( progress_animation) { from { width: 0% } to { width: 100% } } @include keyframes( progress_animation_list) { from { width: 0% } to { width: $list-vm-height; } } @include keyframes( pulse) { from { color: $secondary-color } to { color: darken($secondary-color,10%) } } @include keyframes( reboot_pulse) { from { color: $vm-rebooting-color } to { color: darken($vm-rebooting-color,10%) } } .vms .items-list { .img-wrap { width: 60px; span { &:hover { cursor: pointer; } } .snf-PC_fill { font-size: 60px; color: $vm-active-color; } .os { @include sprite('../images/os-unknown.png', 22px, 22px); position: absolute; top:8px; left:19px; &.windows { background-image:url('../images/os-windows.png'); } &.kubuntu { background-image:url('../images/os-kubuntu.png'); } &.fedora { background-image:url('../images/os-fedora.png'); } } } [data-status="off"] { .img-wrap { .snf-PC_fill { color: $vm-off-color; } } .status .logs, .status .state { color: $vm-off-color; } } [data-status="error"] { .img-wrap { .snf-PC_fill { color: $vm-error-color; } } .status .logs, .status .state a{ color: $vm-error-color; } } [data-status="shutting"] { .img-wrap { .snf-PC_fill { color: $vm-shutting-color; } } .status .logs, .status .state { color: $vm-shutting-color; } } [data-status="starting"] { .img-wrap { .snf-PC_fill { color: $vm-starting-color; } } .status .logs, .status .state { color: $vm-starting-color; } } [data-status="rebooting"] { .btn5.temp { color: #5c8fe1; border-color: #5c8fe1; padding: 0 4px; position: absolute; right: 0; } .img-wrap { .snf-PC_fill { color: $vm-rebooting-color; } } .status .logs, .status .state { color: $vm-rebooting-color; } } [data-status="building"] { .btn5.temp { color: #5c8fe1; border-color: #5c8fe1; padding: 0 4px; position: absolute; right: 0; } .img-wrap { .snf-PC_fill { display: block; overflow: hidden; } .incomplete { color: #c7eae0; width:60px; } .complete { width: 0%; position: relative; top: -60px; } } } // there's no running } .vm { .top { .img-wrap { //@include sprite('../images/vm-on.png', 112px, 116px); display: inline-block; height: 112px; .snf-PC_fill { font-size: 112px; color: $vm-active-color; } &.off { .snf-PC_fill { color: $vm-off-color; } } } .os { @include sprite('../images/os-unknown.png', 44px, 44px); position: absolute; background-size:100%; left:34px; top:11px; &.windows { background-image:url('../images/os-windows.png'); } &.kubuntu { background-image:url('../images/os-kubuntu.png'); } &.fedora { background-image:url('../images/os-fedora.png'); } } } } #vm-connect { .info { font-style:italic; font-size:emCalc(13px); color: lighten($primary-color,5%); } .ssh { text-align: center; span { padding: 10px 30px; background:$secondary-color; color:#fff; } } }