264 lines
5.2 KiB
SCSS
264 lines
5.2 KiB
SCSS
|
///
|
||
|
/// This program is free software; you can redistribute it and/or
|
||
|
/// modify it under the terms of the GNU General Public License
|
||
|
/// as published by the Free Software Foundation; under version 2
|
||
|
/// of the License (non-upgradable).
|
||
|
///
|
||
|
/// This program is distributed in the hope that it will be useful,
|
||
|
/// but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||
|
/// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||
|
/// GNU General Public License for more details.
|
||
|
///
|
||
|
/// You should have received a copy of the GNU General Public License
|
||
|
/// along with this program; if not, write to the Free Software
|
||
|
/// Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
|
||
|
///
|
||
|
/// Copyright (c) 2015-2019 Open Assessment Technologies SA
|
||
|
///
|
||
|
|
||
|
|
||
|
@import "inc/bootstrap";
|
||
|
|
||
|
|
||
|
.diagnostics-content-area {
|
||
|
max-width: 768px;
|
||
|
margin: 40px auto 40px auto;
|
||
|
}
|
||
|
|
||
|
.diagnostics-main-area {
|
||
|
margin: 40px auto 0 auto;
|
||
|
background: $canvas;
|
||
|
@include simple-border();
|
||
|
padding: 20px;
|
||
|
|
||
|
h1, h2, h3 {
|
||
|
font-style: normal;
|
||
|
font-family: $headingFont;
|
||
|
}
|
||
|
|
||
|
h1 {
|
||
|
margin-bottom: 20px;
|
||
|
@include font-size(20);
|
||
|
}
|
||
|
|
||
|
h2 {
|
||
|
margin: 0;
|
||
|
@include font-size(14);
|
||
|
}
|
||
|
|
||
|
h3 {
|
||
|
margin-top: 10px;
|
||
|
margin-bottom: 5px;
|
||
|
@include font-size(12);
|
||
|
}
|
||
|
|
||
|
.status, .details {
|
||
|
h2 {
|
||
|
margin: 1rem 0;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.legend {
|
||
|
font-style: italic;
|
||
|
font-weight: normal;
|
||
|
font-family: $headingFont;
|
||
|
@include font-size(11);
|
||
|
}
|
||
|
|
||
|
.customMsg {
|
||
|
margin-top: 10px;
|
||
|
}
|
||
|
|
||
|
.quality-bar {
|
||
|
height: 15px;
|
||
|
@include linear-gradient(#CE1431 #D57915 #D5A215 #D5CB15 #36B111);
|
||
|
// @include linear-gradient(#36B111 #D5A215 #CE1431 );
|
||
|
opacity: .8;
|
||
|
@include border-radius(2);
|
||
|
margin: 5px 0 10px;
|
||
|
position: relative;
|
||
|
}
|
||
|
|
||
|
.quality-indicator {
|
||
|
position: absolute;
|
||
|
border-width: 10px 8px;
|
||
|
border-style: solid;
|
||
|
border-color: $darkBar transparent transparent;
|
||
|
top: -1px;
|
||
|
height: 25px;
|
||
|
width: 0;
|
||
|
|
||
|
&[title]:before {
|
||
|
@include font-size(11);
|
||
|
content: attr(title);
|
||
|
position: absolute;
|
||
|
top: -36px;
|
||
|
left: -12px;
|
||
|
text-align: center;
|
||
|
width: 24px;
|
||
|
height: 24px;
|
||
|
line-height: 24px;
|
||
|
display: inline-block;
|
||
|
background-color: $info;
|
||
|
color: white(.9);
|
||
|
@include border-radius(12);
|
||
|
}
|
||
|
|
||
|
&.wide[title]:before {
|
||
|
left: -16px;
|
||
|
width: 32px;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
[data-result], .bandwidth-box {
|
||
|
display: none;
|
||
|
}
|
||
|
|
||
|
[data-action=bandwidth-launcher] {
|
||
|
margin: 5px 0 10px;
|
||
|
}
|
||
|
|
||
|
li {
|
||
|
padding-bottom: 10px;
|
||
|
}
|
||
|
|
||
|
.intro {
|
||
|
margin-bottom: 20px;
|
||
|
|
||
|
label {
|
||
|
display: inline-block;
|
||
|
width: 150px;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
|
||
|
|
||
|
table.datatable {
|
||
|
[class^="icon-"] {
|
||
|
padding: 0;
|
||
|
}
|
||
|
|
||
|
td {
|
||
|
font-size: 90%;
|
||
|
font-weight: normal;
|
||
|
}
|
||
|
|
||
|
.progress {
|
||
|
.state:not(:first-child):before {
|
||
|
content: ' - ';
|
||
|
}
|
||
|
.item-time:before {
|
||
|
content: ' (';
|
||
|
}
|
||
|
.item-time .total:before {
|
||
|
content: ' / ';
|
||
|
}
|
||
|
.item-time:after {
|
||
|
content: ')';
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.details {
|
||
|
table.matrix {
|
||
|
@include simple-border();
|
||
|
margin-top: 5px;
|
||
|
|
||
|
td:first-child {
|
||
|
min-width: 30%;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.diagnostic-scope {
|
||
|
h1 {
|
||
|
font-family: $headingFont;
|
||
|
@include font-size(22);
|
||
|
font-weight: normal;
|
||
|
}
|
||
|
h2 {
|
||
|
font-family: $headingFont;
|
||
|
@include font-size(18);
|
||
|
margin: 30px 0 10px;
|
||
|
}
|
||
|
|
||
|
form.daterange {
|
||
|
label {
|
||
|
padding : 0;
|
||
|
}
|
||
|
input {
|
||
|
margin: 0 10px;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
table.datatable {
|
||
|
[class^="icon-"] {
|
||
|
padding: 0;
|
||
|
}
|
||
|
|
||
|
td {
|
||
|
font-size: 90%;
|
||
|
font-weight: normal;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.content {
|
||
|
margin: auto;
|
||
|
}
|
||
|
|
||
|
.diagnostic-index, .diagnostic-runner {
|
||
|
.content {
|
||
|
width: 100%;
|
||
|
}
|
||
|
.message {
|
||
|
padding: 8px;
|
||
|
text-align: center;
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.panel {
|
||
|
.action-bar {
|
||
|
background: whiten($info, .1);
|
||
|
padding: 3px;
|
||
|
overflow: hidden;
|
||
|
color: whiten($info, .9);
|
||
|
|
||
|
.btn-info {
|
||
|
overflow: hidden;
|
||
|
background: transparent;
|
||
|
border: 1px white(.3) solid;
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.diagnostics-main-area {
|
||
|
margin-top: 0px;
|
||
|
max-width: 800px;
|
||
|
}
|
||
|
|
||
|
.detailed-value {
|
||
|
display: flex;
|
||
|
justify-content: space-between;
|
||
|
&.errors {
|
||
|
color: $warning;
|
||
|
}
|
||
|
|
||
|
.details {
|
||
|
font-size: 2rem;
|
||
|
cursor: pointer;
|
||
|
color: whiten($info, .2);
|
||
|
|
||
|
&:hover {
|
||
|
color: blacken($info, .8);
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
|
||
|
.action-bar {
|
||
|
.tool-exitButton, [data-control="exitButton"] {
|
||
|
float:right;
|
||
|
}
|
||
|
}
|