131 lines
2.0 KiB
CSS
131 lines
2.0 KiB
CSS
* { box-sizing: border-box; }
|
|
|
|
body {
|
|
font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
|
|
font-size: 16px;
|
|
}
|
|
|
|
#app {
|
|
width: 950px;
|
|
margin: 0 auto;
|
|
}
|
|
|
|
/*
|
|
* Table
|
|
*/
|
|
|
|
.table-row {
|
|
width: 950px;
|
|
height: 40px;
|
|
}
|
|
.table-cell {
|
|
float: left;
|
|
width: 120px;
|
|
line-height: 40px;
|
|
text-align: right;
|
|
font-family: monospace;
|
|
}
|
|
.table-cell.attn {
|
|
font-weight: 600;
|
|
color: red;
|
|
}
|
|
.table-cell.col-name {
|
|
width: 350px;
|
|
text-align: left;
|
|
font-weight: 600;
|
|
font-family: inherit;
|
|
}
|
|
.table-header .table-cell {
|
|
font-weight: 600;
|
|
border-bottom: #666 1px solid;
|
|
font-family: inherit;
|
|
}
|
|
|
|
|
|
/*
|
|
* Line chart
|
|
*/
|
|
|
|
.linechart {
|
|
float: left;
|
|
width: 950px;
|
|
height: 120px;
|
|
margin-right: 15px;
|
|
}
|
|
.linechart svg {
|
|
width: 100%;
|
|
height: 100%;
|
|
/*background-color: #abc;*/
|
|
}
|
|
.linechart .line {
|
|
stroke-width: 1px;
|
|
fill: transparent;
|
|
}
|
|
.linechart .line.processed {
|
|
stroke: #46f;
|
|
}
|
|
.linechart .line.errors {
|
|
stroke: #f64;
|
|
}
|
|
.linechart .dot.processed {
|
|
fill: #46f;
|
|
}
|
|
.linechart .dot.errors {
|
|
fill: #f64;
|
|
}
|
|
.axis {
|
|
stroke: #888;
|
|
}
|
|
.axis.light {
|
|
stroke: #ddd;
|
|
}
|
|
.arrow {
|
|
stroke: #888;
|
|
fill: #888;
|
|
}
|
|
|
|
|
|
/*
|
|
* Box plot
|
|
*/
|
|
|
|
.boxplot {
|
|
float: left;
|
|
width: 950px;
|
|
height: 170px;
|
|
margin-bottom: 40px;
|
|
}
|
|
.boxplot svg {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
.boxplot .tick {
|
|
stroke-width: 1px;
|
|
stroke: #aaa;
|
|
}
|
|
.boxplot .whisker {
|
|
stroke-width: 1px;
|
|
stroke: #ccc;
|
|
stroke-dasharray: 3, 1;
|
|
}
|
|
.boxplot .iqr {
|
|
stroke-width: 1px;
|
|
fill: #f0f0f0;
|
|
stroke: #888;
|
|
}
|
|
.boxplot .median {
|
|
stroke-width: 2px;
|
|
stroke: #444;
|
|
}
|
|
|
|
.daemon {
|
|
width: 100%;
|
|
}
|
|
|
|
.axis-label {
|
|
stroke: #444;
|
|
font-weight: 100;
|
|
font-family: monospace;
|
|
font-size: 10px;
|
|
}
|