mirror of
https://github.com/retspen/webvirtcloud
synced 2026-11-08 11:16:47 +00:00
c1e30aeb7f
The fork's own rules in webvirtcloud.css redid what Bootstrap 5.3 has: - the capacity bars (.cap-*) are Bootstrap progress bars: the memory a .progress-stacked of running VMs' memory and shut-off VMs' (at half opacity), each segment a progressbar with its amount as its value text; the pool bars a thin .progress. The line where the host's memory ends goes: the share above the bar says it, red when over; - the status dot (.compute-dot) is a rounded-circle, the big figures (.compute-ratio) fs-4, the Computes table's cell padding py-3; - the steps of creating a VM (.create-steps) are a breadcrumb with "›" as its divider; - the XML and Advanced disclosures (.disclosure with a turning chevron) are Bootstrap accordions; - the chosen volumes and networks (.row-list) are list-unstyled, their names text-break; - a chart's container is position-relative by utility; its height stays. Dead rules go too: .netIN, .netOUT, .diskRD, .diskWR, .input-xs and .bottom-bar-margin had no users.
169 lines
2.6 KiB
CSS
169 lines
2.6 KiB
CSS
/*!
|
|
* WebVirtCloud (http://github.com/retspen/webvirtcloud)
|
|
* Code licensed under the Apache License v2.0.
|
|
* For details, see http://www.apache.org/licenses/LICENSE-2.0.
|
|
*/
|
|
|
|
/* Global Styles */
|
|
|
|
body {
|
|
padding-bottom: 50px;
|
|
}
|
|
|
|
.container {
|
|
max-width: 900px;
|
|
}
|
|
|
|
.page-header {
|
|
margin: 5px 5px 20px 20px;
|
|
}
|
|
|
|
#editor {
|
|
position: absolute;
|
|
top: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
left: 0;
|
|
}
|
|
|
|
/* Tom Select's control keeps the text colour of the select it replaces:
|
|
its own stylesheet fixes one, unreadable on some Bootswatch themes */
|
|
.ts-wrapper.form-select .ts-control,
|
|
.ts-wrapper.form-select .ts-control input {
|
|
color: inherit;
|
|
}
|
|
|
|
.xmlheight {
|
|
height: 364px;
|
|
}
|
|
|
|
.ace_editor {
|
|
height: 350px;
|
|
}
|
|
|
|
/* headers of sortable tables (static/js/sort_tables.js): the sorted one shows
|
|
its direction, up for ascending */
|
|
th[role=columnheader]:not([data-sort-method="none"]) {
|
|
cursor: pointer;
|
|
user-select: none;
|
|
}
|
|
|
|
th[aria-sort]:not([data-sort-method="none"])::after {
|
|
content: "";
|
|
display: inline-block;
|
|
margin-left: 0.4em;
|
|
vertical-align: middle;
|
|
border: 0.3em solid transparent;
|
|
border-top-color: currentColor;
|
|
}
|
|
|
|
th[aria-sort="ascending"]:not([data-sort-method="none"])::after {
|
|
border-top-color: transparent;
|
|
border-bottom-color: currentColor;
|
|
}
|
|
|
|
.host-collapsed tr[host] {
|
|
display: none;
|
|
}
|
|
|
|
.search {
|
|
margin: 5px;
|
|
}
|
|
|
|
.btn-header {
|
|
margin-top: 5px;
|
|
}
|
|
|
|
.action-block {
|
|
display: block;
|
|
padding: 15px 0;
|
|
font-weight: 400;
|
|
font-size: 14px;
|
|
width: 65px;
|
|
}
|
|
|
|
.action-button {
|
|
text-align: center;
|
|
}
|
|
|
|
.tab-pane-bordered {
|
|
border: 1px solid #eee;
|
|
border-top-width: 0;
|
|
padding: 20px;
|
|
}
|
|
|
|
p {
|
|
display: block;
|
|
margin: 10px 10px 10px 10px;
|
|
}
|
|
|
|
#power {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
#access {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
#resize {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
#snapshots {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
#settings {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
#graphics {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
#undefine {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
/* a live chart (static/js/charts.js) fills the width of its card at this height */
|
|
.chart {
|
|
height: 160px;
|
|
}
|
|
|
|
.keyselect {
|
|
display: inline;
|
|
min-width: 250px;
|
|
}
|
|
|
|
.multipleselect {
|
|
width:27em;
|
|
height:10em;
|
|
border:solid 2px #c0c0c0;
|
|
overflow:auto;
|
|
padding: 0 1em;
|
|
margin: 0.9em;
|
|
}
|
|
|
|
.multipleselect label {
|
|
display:block;
|
|
}
|
|
|
|
.multipleselect-on {
|
|
color:#ffffff;
|
|
background-color:#000099;
|
|
}
|
|
|
|
/* make dropdowns show on hover */
|
|
@media only screen and (min-width: 768px) {
|
|
.dropdown:hover .dropdown-menu {
|
|
display: block;
|
|
}
|
|
}
|
|
.table > tbody > tr > td {
|
|
vertical-align: middle;
|
|
}
|
|
|
|
/* remove ugly dotted outline on tabs */
|
|
a {
|
|
outline: 0;
|
|
}
|