d7bde54533
* new backend API to get disk info from psutil * Disk info div + disk space gauge div * styling for git disk space gauge * inital commit - jquery request to system-info endpoint * div disk_info created * get_system_info function is initiated once DOM is fully loaded. * styling for disk-gauge-bar added * get_system_info endpoint returns additionally an information about network, cpu_time and memory * new <div> for graphical output of system info * increased widht for disk-gauge-container * if condition testing an index of response and rendering an output within div for graphical output * div deleted
1017 lines
23 KiB
CSS
1017 lines
23 KiB
CSS
/* :root {
|
|
--dt-row-selected: 18, 143, 175;
|
|
--dt-row-selected: 140,142,141;
|
|
} */
|
|
:root {
|
|
--dt-row-selected: 56,95,126;
|
|
--dt-row-selected-text: 173,181,189;
|
|
}
|
|
|
|
.truncated-text {
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
max-width: 150px; /* Adjust as needed */
|
|
display: inline-block;
|
|
}
|
|
|
|
.expanded-text {
|
|
white-space: normal;
|
|
overflow: visible;
|
|
}
|
|
|
|
.expand-icon {
|
|
margin-right: 3px;
|
|
vertical-align: middle;
|
|
font-size: 15px;
|
|
color: var(--bs-gray-400);
|
|
border-radius: 4px;
|
|
/* padding: 2px; */
|
|
}
|
|
|
|
.tool-icon {
|
|
margin-right: 0px;
|
|
vertical-align: middle;
|
|
font-size: 19px;
|
|
color: var(--bs-secondary);
|
|
border-radius: 4px;
|
|
/* padding: 2px; */
|
|
padding-left: 2px;
|
|
padding-right: 2px;
|
|
}
|
|
|
|
.tool-icon:hover {
|
|
background-color: var(--bs-info-text-emphasis);
|
|
color: var(--bs-dark-bg-subtle);
|
|
cursor: pointer;
|
|
border-radius: 4px;
|
|
/* padding: 2px; */
|
|
}
|
|
|
|
.scrollable-div {
|
|
width: 478px;
|
|
height: 260px;
|
|
overflow-y: auto;
|
|
border: 1px solid #585858;
|
|
padding: 10px;
|
|
}
|
|
|
|
/* #metadata-container {
|
|
overflow-y: auto;
|
|
height: 500px;
|
|
} */
|
|
|
|
#metadata-container {
|
|
display: flex;
|
|
flex-direction: column;
|
|
height: 100%; /* Adjust this as needed */
|
|
}
|
|
|
|
#toml-editor-container {
|
|
height: 60%; /* Adjust this as needed */
|
|
}
|
|
|
|
#python-editor-container {
|
|
height: 40%; /* Adjust this as needed */
|
|
margin-top: 3rem;
|
|
}
|
|
|
|
|
|
/* ... existing CSS ... */
|
|
.download-model, .delete-model, .inspect-model {
|
|
cursor: pointer;
|
|
padding: 0 5px;
|
|
}
|
|
|
|
.download-model {
|
|
color: green; /* or use an actual icon */
|
|
}
|
|
.delete-model {
|
|
color: red; /* or use an actual icon */
|
|
}
|
|
|
|
.stat_div {
|
|
display: contents;
|
|
}
|
|
|
|
/* Custom styles for dark mode and form offset */
|
|
.dropdown-menu-dark .form-control, .dropdown-menu-dark .btn {
|
|
background-color: #343a40;
|
|
border-color: #6c757d;
|
|
color: white;
|
|
}
|
|
.dropdown-menu-dark .form-control:focus {
|
|
box-shadow: none;
|
|
border-color: #5cb85c;
|
|
}
|
|
.dropdown-item {
|
|
position: relative;
|
|
display: flex;
|
|
align-items: center; /* Align play icon vertically */
|
|
}
|
|
.hover-icon {
|
|
margin-left: auto; /* Push play icon to the right */
|
|
cursor: pointer; /* Change cursor on hover */
|
|
}
|
|
.action-form {
|
|
z-index: 500000;
|
|
display: none; /* Hide form by default */
|
|
position: absolute;
|
|
left: 100%; /* Position form to the right of the dropdown item */
|
|
top: 0;
|
|
white-space: nowrap; /* Prevent wrapping on small screens */
|
|
width: max-content;
|
|
/* Add some space between the dropdown item and the form */
|
|
background: #343a40; /* Match the dropdown background color */
|
|
border-radius: 0.25rem; /* Match Bootstrap's border radius */
|
|
border: 1px solid #6c757d; /* Slight border for the form */
|
|
}
|
|
/* .form-group {
|
|
display: flex;
|
|
gap: 0.5rem;
|
|
align-items: center;
|
|
margin-bottom: 0.5rem;
|
|
} */
|
|
/* Floating label styles */
|
|
.form-label-group {
|
|
position: relative;
|
|
/* padding-top: 15px; */
|
|
}
|
|
.form-label-group label {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 12px;
|
|
font-size: 75%;
|
|
/* transform: translateY(-50%); */
|
|
margin-top: 0; /* Adjusted for font size */
|
|
color: #6c757d;
|
|
pointer-events: none;
|
|
}
|
|
.form-label-group input,
|
|
.form-label-group select {
|
|
padding-top: 18px;
|
|
/* padding-bottom: 2px; */
|
|
}
|
|
|
|
.pagination {
|
|
--bs-pagination-padding-x: 0.45rem;
|
|
--bs-pagination-padding-y: 0.15rem;
|
|
--bs-pagination-font-size: 1rem;
|
|
--bs-pagination-color: var(--bs-link-color);
|
|
--bs-pagination-bg: var(--bs-body-bg);
|
|
--bs-pagination-border-width: var(--bs-border-width);
|
|
--bs-pagination-border-color: var(--bs-border-color);
|
|
--bs-pagination-border-radius: var(--bs-border-radius);
|
|
--bs-pagination-hover-color: var(--bs-link-hover-color);
|
|
--bs-pagination-hover-bg: var(--bs-tertiary-bg);
|
|
--bs-pagination-hover-border-color: var(--bs-border-color);
|
|
--bs-pagination-focus-color: var(--bs-link-hover-color);
|
|
--bs-pagination-focus-bg: var(--bs-secondary-bg);
|
|
--bs-pagination-focus-box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
|
|
--bs-pagination-active-color: #fff;
|
|
--bs-pagination-active-bg: #203e3d;
|
|
--bs-pagination-active-border-color: #405d57;
|
|
--bs-pagination-disabled-color: var(--bs-secondary-color);
|
|
--bs-pagination-disabled-bg: var(--bs-secondary-bg);
|
|
--bs-pagination-disabled-border-color: var(--bs-border-color);
|
|
display: flex;
|
|
padding-left: 0;
|
|
list-style: none;
|
|
}
|
|
|
|
strong {
|
|
font-weight: normal;
|
|
}
|
|
|
|
.line {
|
|
/* font-family: 'Roboto Mono', monospace;
|
|
font-size: 11px; */
|
|
font-family: 'Fira Code', 'Roboto Mono', monospace;
|
|
font-size: 11px; /* Adjust size as necessary */
|
|
line-height: 1.3; /* This increases the line spacing */
|
|
}
|
|
|
|
[data-bs-theme=dark] {
|
|
--bs-font-sans-serif: Söhne, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Ubuntu, Cantarell, "Noto Sans", sans-serif, "Helvetica Neue", Arial, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
|
|
--bs-body-line-height: 1.3;
|
|
--bs-body-font-size: 1.125rem;
|
|
--bs-body-font-weight: 300;
|
|
color-scheme: dark;
|
|
--bs-body-color: #a1a1a1;
|
|
/* --bs-body-color: #787b86; */
|
|
--bs-body-color-rgb: 173,181,189;
|
|
/* --bs-body-bg: #2a2e39; */
|
|
--bs-body-bg: #121722;
|
|
--bs-body-bg-rgb: 33,37,41;
|
|
--bs-emphasis-color: #c8c8c8;
|
|
--bs-emphasis-color-rgb: 255,255,255;
|
|
--bs-secondary-color: rgba(173, 181, 189, 0.75);
|
|
--bs-secondary-color-rgb: 173,181,189;
|
|
--bs-secondary-bg: #343a40;
|
|
--bs-secondary-bg-rgb: 52,58,64;
|
|
--bs-tertiary-color: rgba(173, 181, 189, 0.5);
|
|
--bs-tertiary-color-rgb: 173,181,189;
|
|
--bs-tertiary-bg: #2b3035;
|
|
--bs-tertiary-bg-rgb: 43,48,53;
|
|
--bs-primary-text-emphasis: #6ea8fe;
|
|
--bs-secondary-text-emphasis: #a7acb1;
|
|
--bs-success-text-emphasis: #75b798;
|
|
--bs-info-text-emphasis: #6edff6;
|
|
--bs-warning-text-emphasis: #ffda6a;
|
|
--bs-danger-text-emphasis: #ea868f;
|
|
--bs-light-text-emphasis: #f8f9fa;
|
|
--bs-dark-text-emphasis: #dee2e6;
|
|
--bs-primary-bg-subtle: #031633;
|
|
--bs-secondary-bg-subtle: #161719;
|
|
--bs-success-bg-subtle: #051b11;
|
|
--bs-info-bg-subtle: #032830;
|
|
--bs-warning-bg-subtle: #332701;
|
|
--bs-danger-bg-subtle: #2c0b0e;
|
|
--bs-light-bg-subtle: #343a40;
|
|
--bs-dark-bg-subtle: #1a1d20;
|
|
--bs-primary-border-subtle: #084298;
|
|
--bs-secondary-border-subtle: #41464b;
|
|
--bs-success-border-subtle: #0f5132;
|
|
--bs-info-border-subtle: #087990;
|
|
--bs-warning-border-subtle: #997404;
|
|
--bs-danger-border-subtle: #842029;
|
|
--bs-light-border-subtle: #495057;
|
|
--bs-dark-border-subtle: #343a40;
|
|
--bs-link-color: #7aa1ab;
|
|
--bs-link-hover-color: #8bb9fe;
|
|
--bs-link-color-rgb: 110,168,254;
|
|
--bs-link-hover-color-rgb: 139,185,254;
|
|
--bs-code-color: #e685b5;
|
|
--bs-border-color: #495057;
|
|
--bs-border-color-translucent: rgba(255, 255, 255, 0.15);
|
|
--bs-form-valid-color: #75b798;
|
|
--bs-form-valid-border-color: #75b798;
|
|
--bs-form-invalid-color: #ea868f;
|
|
--bs-form-invalid-border-color: #ea868f;
|
|
}
|
|
|
|
.btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active {
|
|
color: var(--bs-btn-active-color);
|
|
background-color: #3a5962;
|
|
border-color: #3a5962;
|
|
}
|
|
|
|
.btn-outline-primary {
|
|
--bs-btn-color: #94b1b3;
|
|
--bs-btn-border-color: #3a5a62;
|
|
}
|
|
|
|
.form-label {
|
|
margin-top: 0.5em;
|
|
color: var(--bs-emphasis-color);
|
|
}
|
|
.form-check {
|
|
display: block;
|
|
min-height: 2.5rem;
|
|
padding-left: 1.5em;
|
|
margin-left: 0.25rem;
|
|
}
|
|
|
|
.h4, h4 {
|
|
font-size: 1.4rem;
|
|
color: var(--bs-emphasis-color);
|
|
font-weight: 200;
|
|
}
|
|
|
|
tbody, td, tfoot, th, thead, tr {
|
|
/* border-color: #7d7d8a; */
|
|
border-color: #2a2a2a;
|
|
border-style: solid;
|
|
border-width: 0;
|
|
padding: 4px;
|
|
}
|
|
|
|
.tdnowrap {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
width: 68px;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.tdmetrics {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
width: 154px;
|
|
white-space: nowrap;
|
|
font-size: x-small;
|
|
}
|
|
|
|
table.dataTable thead th, table.dataTable thead td, table.dataTable tfoot th, table.dataTable tfoot td {
|
|
text-align: left;
|
|
color: #787b86;
|
|
}
|
|
|
|
table.dataTable thead>tr>th.sorting, table.dataTable thead>tr>th.sorting_asc, table.dataTable thead>tr>th.sorting_desc, table.dataTable thead>tr>th.sorting_asc_disabled, table.dataTable thead>tr>th.sorting_desc_disabled, table.dataTable thead>tr>td.sorting, table.dataTable thead>tr>td.sorting_asc, table.dataTable thead>tr>td.sorting_desc, table.dataTable thead>tr>td.sorting_asc_disabled, table.dataTable thead>tr>td.sorting_desc_disabled {
|
|
cursor: pointer;
|
|
position: relative;
|
|
padding-right: 10px;
|
|
font-size: xx-small;
|
|
}
|
|
|
|
table.dataTable thead>tr>th.sorting:before, table.dataTable thead>tr>th.sorting:after, table.dataTable thead>tr>th.sorting_asc:before, table.dataTable thead>tr>th.sorting_asc:after, table.dataTable thead>tr>th.sorting_desc:before, table.dataTable thead>tr>th.sorting_desc:after, table.dataTable thead>tr>th.sorting_asc_disabled:before, table.dataTable thead>tr>th.sorting_asc_disabled:after, table.dataTable thead>tr>th.sorting_desc_disabled:before, table.dataTable thead>tr>th.sorting_desc_disabled:after, table.dataTable thead>tr>td.sorting:before, table.dataTable thead>tr>td.sorting:after, table.dataTable thead>tr>td.sorting_asc:before, table.dataTable thead>tr>td.sorting_asc:after, table.dataTable thead>tr>td.sorting_desc:before, table.dataTable thead>tr>td.sorting_desc:after, table.dataTable thead>tr>td.sorting_asc_disabled:before, table.dataTable thead>tr>td.sorting_asc_disabled:after, table.dataTable thead>tr>td.sorting_desc_disabled:before, table.dataTable thead>tr>td.sorting_desc_disabled:after {
|
|
position: absolute;
|
|
display: block;
|
|
opacity: 0.525;
|
|
right: 4px;
|
|
line-height: 9px;
|
|
font-size: 0.8em;
|
|
}
|
|
table.dataTable thead>tr>th.sorting_asc:before, table.dataTable thead>tr>th.sorting_desc:after, table.dataTable thead>tr>td.sorting_asc:before, table.dataTable thead>tr>td.sorting_desc:after {
|
|
opacity: 1;
|
|
}
|
|
.tdnote {
|
|
width: 188px;
|
|
font-size: x-small;
|
|
}
|
|
|
|
.tdsmall {
|
|
font-size: x-small;
|
|
}
|
|
|
|
.tdname {
|
|
width: 100px;
|
|
}
|
|
|
|
.form-row {
|
|
display: table-cell;
|
|
}
|
|
|
|
.secondary-bg {
|
|
--bs-bg-opacity: 1;
|
|
background-color: #414749;
|
|
}
|
|
|
|
/* #128faf; */
|
|
|
|
.btn-outline-success {
|
|
--bs-btn-color: #94b1b3;
|
|
--bs-btn-border-color: #8b8b8b;
|
|
--bs-btn-hover-color: #fff;
|
|
--bs-btn-hover-bg: #3996a4;
|
|
--bs-btn-hover-border-color: #198754;
|
|
--bs-btn-focus-shadow-rgb: 25,135,84;
|
|
--bs-btn-active-color: #fff;
|
|
--bs-btn-active-bg: #40929d;
|
|
--bs-btn-active-border-color: #446379;
|
|
--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
|
--bs-btn-disabled-color: #4e7c85;
|
|
--bs-btn-disabled-bg: transparent;
|
|
--bs-btn-disabled-border-color: #839498;
|
|
--bs-gradient: none;
|
|
}
|
|
|
|
#imagePreview {
|
|
/* display: none; */
|
|
position: fixed;
|
|
z-index: 100;
|
|
left: 50%;
|
|
top: 50%;
|
|
transform: translate(-50%, -50%);
|
|
}
|
|
|
|
.color-tag {
|
|
height: 10px;
|
|
width: 10px;
|
|
display: inline-block;
|
|
border-radius: 50%;
|
|
margin-right: 5px;
|
|
vertical-align: middle;
|
|
}
|
|
/* Base style for color-tag */
|
|
|
|
/* Additional class to change the triangle direction when the row is expanded */
|
|
.collapsed .color-tag {
|
|
border-top: none;
|
|
border-bottom: 10px solid #838E65; /* Triangle pointing down when expanded */
|
|
}
|
|
|
|
.input-group { margin-top: 10px; display: none; }
|
|
|
|
.group-header {
|
|
cursor: pointer;
|
|
background-color: #f2f2f2; /* Light gray background */
|
|
color: #b2b2b2; /* Dark text for contrast */
|
|
/* font-weight: bold; */
|
|
}
|
|
|
|
/* Hide all .batchtool elements by default */
|
|
.batchtool {
|
|
display: inline-flex; /* Maintain the desired display type */
|
|
opacity: 0; /* Initially fully transparent */
|
|
visibility: hidden; /* Initially hidden */
|
|
transition: opacity 0.5s, visibility 0s 0.5s; /* Transition for opacity and delay for visibility */
|
|
}
|
|
|
|
/* Show .batchtool elements immediately when hovering over a .group-header row */
|
|
.group-header:hover .batchtool {
|
|
opacity: 1; /* Fully opaque when hovered */
|
|
visibility: visible; /* Visible when hovered */
|
|
transition: opacity 0.5s, visibility 0s; /* Immediate transition for visibility */
|
|
}
|
|
|
|
/* Delay the transition when mouse leaves */
|
|
.group-header .batchtool {
|
|
transition-delay: 0.5s; /* Delay the transition */
|
|
}
|
|
|
|
.group-header .batchheader-profit-info {
|
|
color: #3e999e; /* Highlight profit info */
|
|
vertical-align: super;
|
|
/* font-weight: bold; */
|
|
}
|
|
|
|
.group-header .batchheader-count-info {
|
|
color: #a1a1a1; /* Highlight count info */
|
|
vertical-align: super;
|
|
/* font-weight: bold; */
|
|
}
|
|
|
|
.group-header .batchheader-note-info {
|
|
color: #a1a1a1; /* Highlight count info */
|
|
vertical-align: super;
|
|
/* font-weight: bold; */
|
|
}
|
|
|
|
.group-header .batchheader-symbol-info {
|
|
font-weight: 600;
|
|
vertical-align: super;
|
|
margin-left: 2px;
|
|
margin-right: 2px;
|
|
}
|
|
|
|
.group-header .batchheader-batch-id {
|
|
color: #a1a1a1; /* Highlight period info */
|
|
font-weight: 400;
|
|
vertical-align: super;
|
|
}
|
|
|
|
.group-header .batchheader-period-info {
|
|
color: #a1a1a1; /* Highlight period info */
|
|
vertical-align: super;
|
|
/* font-weight: bold; */
|
|
}
|
|
|
|
.group-header strong {
|
|
color: #3e999e; /* Distinct color for Batch ID */
|
|
}
|
|
|
|
.group-header.collapsed::after {
|
|
content: '▼'; /* Downward arrow for collapsed groups */
|
|
float: right;
|
|
}
|
|
|
|
.group-header::after {
|
|
content: '▲'; /* Upward arrow for expanded groups */
|
|
float: right;
|
|
}
|
|
|
|
|
|
/* .btn-outline-success {
|
|
--bs-btn-color: #316164;
|
|
--bs-btn-border-color: #247e85;
|
|
--bs-btn-hover-color: #fff;
|
|
--bs-btn-hover-bg: #3996a4;
|
|
--bs-btn-hover-border-color: #198754;
|
|
--bs-btn-focus-shadow-rgb: 25,135,84;
|
|
--bs-btn-active-color: #fff;
|
|
--bs-btn-active-bg: #40929d;
|
|
--bs-btn-active-border-color: #446379;
|
|
--bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
|
|
--bs-btn-disabled-color: #697d81;
|
|
--bs-btn-disabled-bg: transparent;
|
|
--bs-btn-disabled-border-color: #839498;
|
|
--bs-gradient: none;
|
|
} */
|
|
|
|
.badge {
|
|
--bs-badge-padding-x: 0.65em;
|
|
--bs-badge-padding-y: 0.35em;
|
|
--bs-badge-font-size: 0.75em;
|
|
--bs-badge-font-weight: 700;
|
|
--bs-badge-color: #fff;
|
|
--bs-badge-border-radius: var(--bs-border-radius);
|
|
display: inline-block;
|
|
padding: var(--bs-badge-padding-y) var(--bs-badge-padding-x);
|
|
font-size: var(--bs-badge-font-size);
|
|
font-weight: var(--bs-badge-font-weight);
|
|
line-height: 1;
|
|
color: var(--bs-body-color);
|
|
text-align: center;
|
|
white-space: nowrap;
|
|
vertical-align: baseline;
|
|
border-radius: var(--bs-badge-border-radius);
|
|
}
|
|
|
|
html {
|
|
font-size: 12px;
|
|
}
|
|
|
|
.table>:not(caption)>*>* {
|
|
padding: 0.2rem 0.2rem 0.01rem 0.2rem;
|
|
}
|
|
|
|
.flex-container {
|
|
/* display: inline-grid; */
|
|
flex-direction: row;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-start;
|
|
align-items: stretch;
|
|
align-content: normal;
|
|
}
|
|
|
|
.flex-items{
|
|
display: block;
|
|
flex-grow: 0;
|
|
flex-shrink: 1;
|
|
flex-basis: auto;
|
|
align-self: auto;
|
|
order: 0;
|
|
margin-inline-start: 23px;
|
|
padding-bottom: 10px;
|
|
}
|
|
|
|
.chartContainer {
|
|
position: relative;
|
|
}
|
|
|
|
.legend {
|
|
position: absolute;
|
|
color: #050505;
|
|
left: 100px;
|
|
top: 100px;
|
|
/* po zapnuti statusHeaderToolbar prepnout na */
|
|
/* top: 195px; */
|
|
z-index: 1;
|
|
font-size: 12px;
|
|
line-height: 18px;
|
|
font-weight: 400;
|
|
}
|
|
|
|
.legendItemName {
|
|
margin-left: 5px;
|
|
display: flex;
|
|
}
|
|
|
|
.legendItemValue {
|
|
margin-left: 5px;
|
|
display: flex;
|
|
}
|
|
|
|
.clearbutton {
|
|
margin-left: 29px;
|
|
}
|
|
|
|
/* na male obrazovce je log pod grafem, zobrazujeme tedy prvni logy nahore */
|
|
@media (max-width : 2000px) {
|
|
.msgContainerInner {
|
|
display: flex;
|
|
overflow: auto;
|
|
height: 480px;
|
|
flex-direction: column-reverse;
|
|
margin-left: 14px;
|
|
width: 100%;
|
|
}
|
|
#msgContainer {
|
|
display: inline-block;
|
|
/* overflow: auto; */
|
|
height: 480px;
|
|
width: 35%;
|
|
}
|
|
}
|
|
/*
|
|
.even {
|
|
display: block;
|
|
}
|
|
|
|
.odd {
|
|
display: block;
|
|
} */
|
|
|
|
@media (min-width: 2001px) {
|
|
.msgContainerInner {
|
|
display: flex;
|
|
overflow: auto;
|
|
height: 480px;
|
|
flex-direction: column-reverse;
|
|
margin-left: 14px;
|
|
width: 130%;
|
|
}
|
|
#msgContainer {
|
|
display: inline-block;
|
|
/* overflow: auto; */
|
|
height: 480px;
|
|
width: 750px;
|
|
}
|
|
}
|
|
|
|
#lowercontainer {
|
|
display: contents;
|
|
/* width: 500px; */
|
|
}
|
|
|
|
#indicatorsButtons {
|
|
display: contents;
|
|
/* width: 500px; */
|
|
}
|
|
|
|
pre {
|
|
display: block;
|
|
/* padding: 9.5px; */
|
|
/* margin: 0 0 10px; */
|
|
font-size: 10px;
|
|
/* line-height: 2.428571; */
|
|
/* color: #333; */
|
|
word-break: break-all;
|
|
word-wrap: break-word;
|
|
/* background-color: #f5f5f5; */
|
|
/* border: 1px solid #ccc; */
|
|
border-radius: 4px;
|
|
overflow-x: clip;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
.pidi {
|
|
/* display: block; */
|
|
font-size: smaller;
|
|
}
|
|
|
|
#trades-data {
|
|
height: 40s0px;
|
|
overflow: auto;
|
|
}
|
|
|
|
#statusHeader {
|
|
margin-left: 0px;
|
|
font-size: normal;
|
|
/* font-weight: bold; */
|
|
display: flex;
|
|
/* background-color: #dfe4e6; */
|
|
/* color: white; */
|
|
padding: 1px;
|
|
padding-left: 5px;
|
|
width: max-content;
|
|
}
|
|
|
|
.statustd {
|
|
width: 95px;
|
|
height: 25px;
|
|
border: 1px solid black;
|
|
text-align: center;
|
|
}
|
|
|
|
#statusHeaderTool {
|
|
display: none;
|
|
margin-left: 0px;
|
|
/* background-color: #dfe4e6; */
|
|
/* color: white; */
|
|
padding: 1px;
|
|
padding-left: 5px;
|
|
width: max-content;
|
|
height: 95px;
|
|
}
|
|
|
|
.headerItem {
|
|
padding-right: 30px;
|
|
color: #33c1aa;
|
|
}
|
|
|
|
/* .highlighted {
|
|
color: var(--bs-emphasis-color);
|
|
background-color: var(--bs-gray-900);
|
|
/* color: var(--bs-dark-text-emphasis); */
|
|
/* } */
|
|
|
|
|
|
.overlayLayer {
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
width: 100%;
|
|
height: 100%;
|
|
display: inline-table;
|
|
justify-content: center;
|
|
align-items: center;
|
|
background-color: rgba(0, 0, 0, 0.5);
|
|
opacity: 0;
|
|
transition: opacity 0.3s;
|
|
/* z-index: 2; */
|
|
}
|
|
|
|
|
|
.actionText {
|
|
color: white;
|
|
}
|
|
|
|
|
|
|
|
|
|
/* #indicatorModal {
|
|
position: absolute;
|
|
top: 10px;
|
|
left: 10px;
|
|
z-index: 1000;
|
|
} */
|
|
|
|
.highlighted {
|
|
color: #989393;
|
|
background-color: #242a31;
|
|
/* color: var(--bs-dark-text-emphasis); */
|
|
}
|
|
|
|
.switcher-item-highlighted {
|
|
position: relative;
|
|
z-index: 1;
|
|
/* cursor: pointer; */
|
|
text-decoration: double;
|
|
display: inline-block;
|
|
padding: 1px 6px;
|
|
/* font-size: 14px; */
|
|
/* color: #262b3e; */
|
|
/* background-color: #818581; */
|
|
background-color: #0202022e;
|
|
margin-right: 8px;
|
|
margin-bottom: 6px;
|
|
/* border: 1px; */
|
|
border-radius: 4px;
|
|
outline: solid 1px;
|
|
outline-color: #73df4d;
|
|
/* outline-width: 1px; */
|
|
border-style: none;
|
|
}
|
|
|
|
/* .switcher {
|
|
display: flex;
|
|
align-items: center;
|
|
margin-left: 54px;
|
|
width: 323px;
|
|
height: 30px;
|
|
margin-top: 8px;
|
|
color: #2196F3;
|
|
} */
|
|
|
|
.switcher {
|
|
display: flex;
|
|
/* align-items: center; */
|
|
/* margin-left: 54px; */
|
|
/* width: 269px; */
|
|
margin-top: 5px;
|
|
margin-bottom: 3px;
|
|
color: #2196F3;
|
|
}
|
|
|
|
/* .switcher-item {
|
|
cursor: pointer;
|
|
text-decoration: none;
|
|
display: inline-block;
|
|
padding: 6px 8px;
|
|
font-size: 14px;
|
|
color: #262b3e;
|
|
background-color: #818581;
|
|
margin-right: 8px;
|
|
border: none;
|
|
border-radius: 4px;
|
|
outline: none;
|
|
} */
|
|
|
|
/* .switcher-item {
|
|
cursor: pointer;
|
|
text-decoration: none;
|
|
display: inline-block;
|
|
padding: 3px 6px;
|
|
font-size: 14px;
|
|
background-color: #0202022e;;
|
|
margin-right: 8px;
|
|
margin-bottom: 6px;
|
|
border: none;
|
|
border-radius: 5px;
|
|
outline: none;
|
|
} */
|
|
|
|
.button-container {
|
|
position: relative;
|
|
display: inline-block;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.switcher-item {
|
|
position: relative;
|
|
z-index: 1;
|
|
/* cursor: pointer; */
|
|
text-decoration: double;
|
|
display: inline-block;
|
|
padding: 1px 6px;
|
|
/* font-size: 14px; */
|
|
/* color: #262b3e; */
|
|
/* background-color: #818581; */
|
|
background-color: #0202022e;
|
|
margin-right: 8px;
|
|
margin-bottom: 6px;
|
|
/* border: 1px; */
|
|
border-radius: 4px;
|
|
outline: solid 1px;
|
|
outline-color: #323232;
|
|
/* outline-width: 1px; */
|
|
border-style: none;
|
|
}
|
|
|
|
.switcher-item:hover + .overlayLayer {
|
|
opacity: 1;
|
|
}
|
|
|
|
.switcher-item:hover {
|
|
background-color: #f2f3f521;
|
|
}
|
|
|
|
.switcher-active-item {
|
|
text-decoration: none;
|
|
cursor: default;
|
|
color: #262b3e;
|
|
}
|
|
|
|
.switcher-active-item,
|
|
.switcher-active-item:hover {
|
|
/* background-color: #e1eff9; */
|
|
background-color: #e1eff94d;;
|
|
}
|
|
|
|
.multiOut {
|
|
height: 20px;
|
|
position: relative;
|
|
/* background-color: rgb(174, 170, 163); */
|
|
padding: 0px 0px 0px 0px;
|
|
margin-right: 6px;
|
|
margin-bottom: -6px;
|
|
/* position: relative; */
|
|
z-index: 1;
|
|
/* cursor: pointer; */
|
|
text-decoration: double;
|
|
display: inline-block;
|
|
/* padding: 1px 6px; */
|
|
/* font-size: 14px; */
|
|
/* color: #262b3e; */
|
|
/* background-color: #818581; */
|
|
background-color: #0202022e;
|
|
margin-right: 8px;
|
|
/* margin-bottom: 6px; */
|
|
/* border: 1px; */
|
|
border-radius: 4px;
|
|
/* outline: solid 1px;
|
|
outline-color: #323232; */
|
|
/* outline-width: 1px; */
|
|
border-style: none;
|
|
outline-width: thin;
|
|
outline-color: #5a5a5a;
|
|
}
|
|
|
|
.multiOut.switcher-item::after {
|
|
content: '';
|
|
display: inline-block;
|
|
margin-left: 5px;
|
|
border-top: 5px solid transparent;
|
|
border-bottom: 5px solid transparent;
|
|
border-left: 5px solid; /* Arrow pointing right for collapsed state */
|
|
}
|
|
|
|
.multiOut.switcher-item[aria-expanded="true"]::after {
|
|
border-top: 5px solid transparent;
|
|
border-bottom: 5px solid transparent;
|
|
border-right: 5px solid; /* Arrow pointing left for expanded state */
|
|
border-left: none;
|
|
}
|
|
|
|
|
|
|
|
.material-symbols-outlined {
|
|
font-variation-settings:
|
|
'FILL' 0,
|
|
'wght' 300,
|
|
'GRAD' 0,
|
|
'opsz' 24
|
|
}
|
|
|
|
.intervalContainer {
|
|
float: left;
|
|
border-width: thick;
|
|
border: beige;
|
|
display: inline-table;
|
|
padding: 10px;
|
|
}
|
|
|
|
/* TestList part generated by ChatGPT */
|
|
.recordItem {
|
|
border: 1px solid #797979;
|
|
padding: 10px;
|
|
margin-bottom: 10px;
|
|
border-radius: 5px;
|
|
}
|
|
|
|
.recordDetails {
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
/* .editButton,
|
|
#saveBtn,
|
|
#cancelBtn,
|
|
#addTagBtn {
|
|
background-color: #4CAF50;
|
|
color: white;
|
|
border: none;
|
|
padding: 5px 10px;
|
|
text-align: center;
|
|
text-decoration: none;
|
|
display: inline-block;
|
|
font-size: 14px;
|
|
margin-top: 5px;
|
|
cursor: pointer;
|
|
}
|
|
|
|
.editButton:hover,
|
|
#saveBtn:hover,
|
|
#cancelBtn:hover,
|
|
#addTagBtn:hover {
|
|
background-color: #45a049;
|
|
}
|
|
|
|
.editButton:active,
|
|
#saveBtn:active,
|
|
#cancelBtn:active,
|
|
#addTagBtn:active {
|
|
background-color: #3e8e41;
|
|
} */
|
|
|
|
#log-container {
|
|
width: 800px; /* Adjust based on the average line length and font size */
|
|
height: auto;
|
|
max-height: 800px; /* Adjust the height as needed */
|
|
overflow-y: scroll; /* Add scroll for overflow */
|
|
border: 1px solid #ccc;
|
|
padding: 5px;
|
|
/* background-color: #f9f9f9; */
|
|
}
|
|
|
|
#log-content {
|
|
font-family: "Courier New", monospace;
|
|
font-size: 14px; /* Adjust font size as needed */
|
|
line-height: 1.5; /* Adjust line spacing as needed */
|
|
}
|
|
|
|
|
|
.recordItem:after {
|
|
content: "";
|
|
display: table;
|
|
clear: both;
|
|
}
|
|
|
|
.recordItem .close {
|
|
visibility: hidden;
|
|
font-weight: bold;
|
|
margin-left: 5px;
|
|
}
|
|
|
|
.recordItem:hover .close {
|
|
visibility: visible;
|
|
}
|
|
|
|
.close {
|
|
color: #888;
|
|
}
|
|
|
|
.tag {
|
|
display: inline-block;
|
|
background-color: #f2f2f2;
|
|
padding: 5px 10px;
|
|
border-radius: 10px;
|
|
margin-right: 5px;
|
|
}
|
|
|
|
#recordName:disabled,
|
|
#addTagBtn:disabled,
|
|
#datepicker:disabled {
|
|
background-color: #f2f2f2;
|
|
}
|
|
|
|
#disk-gauge-container {
|
|
text-align: center;
|
|
width: 400px;
|
|
}
|
|
|
|
|
|
#disk-gauge {
|
|
width: 100%;
|
|
height: 20px;
|
|
background-color: #ddd;
|
|
border-radius: 10px;
|
|
overflow: hidden;
|
|
}
|
|
|
|
#disk-gauge-bar {
|
|
height: 100%;
|
|
background-color: #4285F4;
|
|
width: 0%; /* Initial state */
|
|
border-radius: 10px;
|
|
} |