mirror of
https://github.com/retspen/webvirtcloud
synced 2026-11-08 11:16:47 +00:00
47fadea53c
The list gets a state selector beside the search box. The search now
matches plain text in any case (a '(' no longer breaks it), and in the
grouped list a host's name shows all of its VMs while a host row shows
only while one of its VMs does. The filter moves to
static/js/instance_filter.js with a Node test; the other lists keep
filter-table.js. Collapsing a host now sets a class on its table body
instead of each row's display, so a collapsed host and the filter no
longer undo each other.
204 lines
No EOL
3.2 KiB
CSS
204 lines
No EOL
3.2 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;
|
||
}
|
||
|
||
/* a disclosure's chevron points up while its section is open */
|
||
.disclosure[aria-expanded="true"] .bi-chevron-down {
|
||
transform: rotate(180deg);
|
||
}
|
||
|
||
/* the steps of creating a VM: the separator is drawn, not a list item */
|
||
.create-steps li + li::before {
|
||
content: "›";
|
||
margin-right: 0.5rem;
|
||
color: var(--bs-secondary-color);
|
||
}
|
||
|
||
.xmlheight {
|
||
height: 364px;
|
||
}
|
||
|
||
.ace_editor {
|
||
height: 350px;
|
||
}
|
||
|
||
.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 */
|
||
.chart {
|
||
position: relative;
|
||
height: 160px;
|
||
}
|
||
|
||
.netIN {
|
||
border-color: rgb(83, 191, 189);
|
||
margin: 0.5em;
|
||
border-style: solid;
|
||
border-width: 0 0 0 1em;
|
||
padding: 0 0.3em;
|
||
}
|
||
|
||
.netOUT {
|
||
border-color: rgb(151, 187, 205);
|
||
margin: 0.5em;
|
||
border-style: solid;
|
||
border-width: 0 0 0 1em;
|
||
padding: 0 0.3em;
|
||
}
|
||
|
||
.diskRD {
|
||
border-color: rgb(190, 195, 205);
|
||
margin: 0.5em;
|
||
border-style: solid;
|
||
border-width: 0 0 0 1em;
|
||
padding: 0 0.3em;
|
||
}
|
||
|
||
.diskWR {
|
||
border-color: rgb(249, 134, 33);
|
||
margin: 0.5em;
|
||
border-style: solid;
|
||
border-width: 0 0 0 1em;
|
||
padding: 0 0.3em;
|
||
}
|
||
.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;
|
||
}
|
||
|
||
.bottom-bar-margin {
|
||
margin-top: 65px;
|
||
}
|
||
|
||
/* 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;
|
||
}
|
||
|
||
.input-xs {
|
||
height: 22px;
|
||
padding: 2px 5px;
|
||
font-size: 12px;
|
||
line-height: 1.5; /* If Placeholder of the input is moved up, rem/modify this. */
|
||
border-radius: 2px;
|
||
} |