mirror of
https://github.com/retspen/webvirtcloud
synced 2026-11-08 11:16:47 +00:00
faa6e4bb14
webvirtcloud.css still carried the upstream panel's rules for what
Bootstrap 5.3 has as utilities and components:
- the page's bottom space (body padding) is pb-5 on base.html's body,
and the console page no longer has to undo it;
- the VM page's action tabs (.action-button, .action-block with a
fixed 65px width) are text-center with a d-block icon; its tab panes
(#power ... #undefine, one rule each) mt-3;
- the bordered sub-tab panes (.tab-pane-bordered, a fixed #eee border
that dark themes could not change) border border-top-0 p-3;
- the search box and header buttons (.search, .btn-header) m-1 and
mt-1; the SSH key select (.keyselect) a form-select;
- the boot order list (.multipleselect, fixed size, #c0c0c0 border) a
list-group of form-check-input items; its unused .multipleselect-on
goes;
- table cells centred by a global rule are align-middle on each table.
Two rules against Bootstrap's behaviour go: menus opened on hover on
wide screens (Bootstrap opens them on a click, and keyboard and touch
users had no hover), and "a { outline: 0 }", which hid the keyboard
focus ring.
The paragraph and page-header margins and the 900px container stay
for a separate change: they set every page's layout.
73 lines
1.5 KiB
CSS
73 lines
1.5 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 */
|
|
|
|
.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;
|
|
}
|
|
|
|
p {
|
|
display: block;
|
|
margin: 10px 10px 10px 10px;
|
|
}
|
|
|
|
/* a live chart (static/js/charts.js) fills the width of its card at this height */
|
|
.chart {
|
|
height: 160px;
|
|
}
|