mirror of https://gitee.com/bigwinds/arangodb
Further improvements of dashboard style
This commit is contained in:
Michael Hackstein
parent
c88729ba76
commit
5bcc334c45
|
|
@ -2,13 +2,17 @@
|
|||
<% var largeChart = function(name) { %>
|
||||
<div class="dashboard-large-chart dashboard-chart" id="<%= name %>Container">
|
||||
<div id="<%= name %>" class="dashboard-interior-chart"></div>
|
||||
<div class="dashboard-legend" id="<%= name %>Legend"></div>
|
||||
<div class="dashboard-legend">
|
||||
<div class="dashboard-legend-inner" id="<%= name %>Legend"></div>
|
||||
</div>
|
||||
</div>
|
||||
<% } %>
|
||||
<% var smallChart = function(name) { %>
|
||||
<div class="dashboard-small-chart dashboard-chart" id="<%= name %>Container">
|
||||
<div id="<%= name %>" class="dashboard-interior-chart"></div>
|
||||
<div class="dashboard-legend" id="<%= name %>Legend"></div>
|
||||
<div class="dashboard-legend">
|
||||
<div class="dashboard-legend-inner" id="<%= name %>Legend"></div>
|
||||
</div>
|
||||
</div>
|
||||
<% } %>
|
||||
<% var tendency = function(title, name) { %>
|
||||
|
|
@ -28,20 +32,20 @@
|
|||
<a class="arangoHeader">Request Statistics</a>
|
||||
</div>
|
||||
<div class="contentDiv">
|
||||
<div class="dashboard-title-bar">Total Time in seconds</div>
|
||||
<div class="dashboard-row">
|
||||
<div class="dashboard-title-bar">Total Time in seconds</div>
|
||||
<% largeChart("totalTimeChart") %>
|
||||
<% smallChart("totalTimeDistribution") %>
|
||||
</div>
|
||||
<div class="dashboard-title-bar">Data Transfer in Bytes</div>
|
||||
<div class="dashboard-row">
|
||||
<div class="dashboard-title-bar">Data Transfer in Bytes</div>
|
||||
<% largeChart("dataTransferChart") %>
|
||||
<% smallChart("dataTransferDistribution") %>
|
||||
</div>
|
||||
<div class="dashboard-title-bar">Requests</div>
|
||||
<div class="dashboard-row">
|
||||
<div class="dashboard-title-bar">Requests</div>
|
||||
<% largeChart("requestsChart") %>
|
||||
<div class="dashboard-small-chart">
|
||||
<div class="dashboard-tendency-chart">
|
||||
<% tendency("Async Requests", "asyncRequests"); %>
|
||||
<% tendency("Client Connections", "clientConnections"); %>
|
||||
</div>
|
||||
|
|
@ -51,26 +55,33 @@
|
|||
<a class="arangoHeader">System Resources</a>
|
||||
</div>
|
||||
<div class="dashboard-row">
|
||||
<div class="dashboard-small-chart dashboard-half-height-chart">
|
||||
<div class="dashboard-tendency-chart dashboard-half-height-chart">
|
||||
<% tendency("Number of threads", "numberOfThreads"); %>
|
||||
</div>
|
||||
<div class="dashboard-small-chart dashboard-half-height-chart">
|
||||
<div class="dashboard-tendency-chart dashboard-half-height-chart">
|
||||
<div class="dashboard-title-bar">Resident Size</div>
|
||||
<div id="residentSizeChart"></div>
|
||||
</div>
|
||||
<div class="dashboard-small-chart dashboard-half-height-chart">
|
||||
<div class="dashboard-tendency-chart dashboard-half-height-chart">
|
||||
<% tendency("Virtual Size in GB", "virualSize"); %>
|
||||
</div>
|
||||
</div>
|
||||
<div class="dashboard-row">
|
||||
<div class="dashboard-medium-chart dashboard-chart" id="<%= name %>Container">
|
||||
<div class="dashboard-title-bar">Major Page Faults</div>
|
||||
<div id="pageFaultsChart" class="dashboard-interior-chart"></div>
|
||||
<div class="dashboard-title-bar">
|
||||
<div class="dashboard-half-title-bar">Major Page Faults</div>
|
||||
<div class="dashboard-half-title-bar">System User Time in seconds</div>
|
||||
</div>
|
||||
<div class="dashboard-medium-chart dashboard-chart" id="<%= name %>Container">
|
||||
<div id="pageFaultsChart" class="dashboard-interior-chart"></div>
|
||||
<div class="dashboard-legend">
|
||||
<div class="dashboard-legend-inner" id="pageFaultsChartLegend"></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="dashboard-medium-chart dashboard-chart" id="<%= name %>Container">
|
||||
<div class="dashboard-title-bar">System User Time in seconds</div>
|
||||
<div id="systemUserTimeChart" class="dashboard-interior-chart"></div>
|
||||
<div class="dashboard-legend" id="systemUserTimeChartLegend"></div>
|
||||
<div class="dashboard-legend">
|
||||
<div class="dashboard-legend-inner" id="systemUserTimeChartLegend"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1 +1,2 @@
|
|||
$tile-width: 240px;
|
||||
$legend-width: 200px;
|
||||
|
|
|
|||
|
|
@ -1,4 +1,5 @@
|
|||
$dashboard-height: 250px;
|
||||
$dashboard-padding: 28px;
|
||||
|
||||
%dashboard-chart-box {
|
||||
@extend %pull-left;
|
||||
|
|
@ -13,41 +14,56 @@ $dashboard-height: 250px;
|
|||
|
||||
.dashboard-interior-chart {
|
||||
@extend %pull-left;
|
||||
height: $dashboard-height - 30px;
|
||||
height: $dashboard-height - $dashboard-padding;
|
||||
}
|
||||
|
||||
.dashboard-large-chart {
|
||||
@extend %dashboard-chart-box;
|
||||
@extend %pull-left;
|
||||
height: $dashboard-height;
|
||||
padding-top: $dashboard-padding;
|
||||
}
|
||||
|
||||
.dashboard-medium-chart {
|
||||
@extend %dashboard-chart-box;
|
||||
@extend %pull-left;
|
||||
height: $dashboard-height;
|
||||
padding-top: $dashboard-padding;
|
||||
}
|
||||
|
||||
.dashboard-small-chart {
|
||||
@extend %dashboard-chart-box;
|
||||
@extend %pull-left;
|
||||
height: $dashboard-height;
|
||||
padding-top: $dashboard-padding;
|
||||
}
|
||||
|
||||
.dashboard-tendency-chart {
|
||||
@extend %dashboard-chart-box;
|
||||
@extend %pull-left;
|
||||
height: $dashboard-height + $dashboard-padding;
|
||||
}
|
||||
|
||||
.dashboard-legend {
|
||||
@extend %pull-left;
|
||||
width: 100px;
|
||||
height: $dashboard-height;
|
||||
width: $legend-width;
|
||||
|
||||
.dashboard-legend-inner {
|
||||
padding-top: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.dashboard-half-height-chart {
|
||||
@extend %clear-float;
|
||||
height: $dashboard-height / 2;
|
||||
height: ($dashboard-height + $dashboard-padding) / 2;
|
||||
}
|
||||
|
||||
.dashboard-title-bar {
|
||||
background-color: $c-bar-bg;
|
||||
border: {
|
||||
bottom: 0;
|
||||
bottom: 1px;
|
||||
bottom-color: $c-black;
|
||||
left: 1px;
|
||||
left-color: $c-black;
|
||||
right: 1px;
|
||||
|
|
@ -63,13 +79,24 @@ $dashboard-height: 250px;
|
|||
margin-left: -1px;
|
||||
margin-right: -1px;
|
||||
text-align: center;
|
||||
|
||||
.dashboard-half-title-bar {
|
||||
@extend %pull-left;
|
||||
border-left: 1px solid $c-black;
|
||||
margin-left: -1px;
|
||||
width: 50%;
|
||||
|
||||
&:first-child {
|
||||
border-left: 0;
|
||||
margin-left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.dashboard-subtitle-bar {
|
||||
@extend %pull-left;
|
||||
@extend %dashboard-chart-box;
|
||||
border-bottom: 1px solid $c-black;
|
||||
border-top: 1px solid $c-black;
|
||||
font-size: 16px;
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
|
|
@ -80,7 +107,7 @@ $dashboard-height: 250px;
|
|||
.dashboard-tendency {
|
||||
@extend %pull-left;
|
||||
@extend %dashboard-chart-box;
|
||||
height: $dashboard-height / 2 - 36px - 36px;
|
||||
height: ($dashboard-height + $dashboard-padding) / 2 - 36px - 36px - 2px;
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -37,6 +37,7 @@ div.resizecontainer {
|
|||
@for $i from 1 through 11 {
|
||||
$min: $tile-width * $i;
|
||||
$content-size: $min - 12px;
|
||||
|
||||
@media (min-width: $min) and (max-width: $min + $tile-width - 1) {
|
||||
|
||||
div.resizecontainer {
|
||||
|
|
@ -54,7 +55,7 @@ div.resizecontainer {
|
|||
width: $int-width;
|
||||
|
||||
.dashboard-interior-chart {
|
||||
width: $int-width - 106px;
|
||||
width: $int-width - $legend-width;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -63,7 +64,7 @@ div.resizecontainer {
|
|||
width: $int-width;
|
||||
|
||||
.dashboard-interior-chart {
|
||||
width: $int-width - 106px;
|
||||
width: $int-width - $legend-width;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -72,9 +73,19 @@ div.resizecontainer {
|
|||
width: $int-width;
|
||||
|
||||
.dashboard-interior-chart {
|
||||
width: $int-width - 106px;
|
||||
width: $int-width - $legend-width;
|
||||
}
|
||||
}
|
||||
|
||||
.dashboard-tendency-chart {
|
||||
$int-width: ($content-size / 3);
|
||||
width: $int-width;
|
||||
|
||||
.dashboard-interior-chart {
|
||||
width: $int-width - $legend-width;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -1369,7 +1369,7 @@ textarea,
|
|||
.fa-plus-square-o:before {
|
||||
content: "\f196"; }
|
||||
|
||||
ul.link-dropdown-menu, ul.user-dropdown-menu, ul.gv-dropdown-menu, div.navlogo, ul.navlist li, div.footer-left, div.footer-left p, a.headerButton, a.button-gui, div .tile, div .bigtile, div .tile a span.add-Icon, div .bigtile a span.add-Icon, div.centralContent, .contentDiv li, div.dropdownInner ul, .search-field, .fixedDropdown .notificationItemContent, .fixedDropdown .notificationItem i, .innerDropdownInnerUL, .dashboard-large-chart, .dashboard-medium-chart, .dashboard-small-chart, .dashboard-subtitle-bar, .dashboard-tendency, .dashboard-interior-chart, .dashboard-legend, .dashboardModal, .pagination-line li a {
|
||||
ul.link-dropdown-menu, ul.user-dropdown-menu, ul.gv-dropdown-menu, div.navlogo, ul.navlist li, div.footer-left, div.footer-left p, a.headerButton, a.button-gui, div .tile, div .bigtile, div .tile a span.add-Icon, div .bigtile a span.add-Icon, div.centralContent, .contentDiv li, div.dropdownInner ul, .search-field, .fixedDropdown .notificationItemContent, .fixedDropdown .notificationItem i, .innerDropdownInnerUL, .dashboard-large-chart, .dashboard-medium-chart, .dashboard-small-chart, .dashboard-tendency-chart, .dashboard-subtitle-bar, .dashboard-tendency, .dashboard-interior-chart, .dashboard-legend, .dashboard-title-bar .dashboard-half-title-bar, .dashboardModal, .pagination-line li a {
|
||||
float: left; }
|
||||
|
||||
div.navmenu, div.footer-right, div.footer-right p, ul.headerButtonList li, div .tile div.iconSet span, div .bigtile div.iconSet span, div.headerBar > div.headerButtonBar, .fixedDropdown button, .query-button, .arango-tab li, .show-save-state, div.gv_colour_list, .docsThirdCol {
|
||||
|
|
@ -2086,17 +2086,22 @@ div.resizecontainer {
|
|||
.dashboard-large-chart {
|
||||
width: 152px; }
|
||||
.dashboard-large-chart .dashboard-interior-chart {
|
||||
width: 46px; }
|
||||
width: -48px; }
|
||||
|
||||
.dashboard-medium-chart {
|
||||
width: 114px; }
|
||||
.dashboard-medium-chart .dashboard-interior-chart {
|
||||
width: 8px; }
|
||||
width: -86px; }
|
||||
|
||||
.dashboard-small-chart {
|
||||
width: 76px; }
|
||||
.dashboard-small-chart .dashboard-interior-chart {
|
||||
width: -30px; } }
|
||||
width: -124px; }
|
||||
|
||||
.dashboard-tendency-chart {
|
||||
width: 76px; }
|
||||
.dashboard-tendency-chart .dashboard-interior-chart {
|
||||
width: -124px; } }
|
||||
@media (min-width: 480px) and (max-width: 719px) {
|
||||
div.resizecontainer {
|
||||
width: 468px; }
|
||||
|
|
@ -2109,17 +2114,22 @@ div.resizecontainer {
|
|||
.dashboard-large-chart {
|
||||
width: 312px; }
|
||||
.dashboard-large-chart .dashboard-interior-chart {
|
||||
width: 206px; }
|
||||
width: 112px; }
|
||||
|
||||
.dashboard-medium-chart {
|
||||
width: 234px; }
|
||||
.dashboard-medium-chart .dashboard-interior-chart {
|
||||
width: 128px; }
|
||||
width: 34px; }
|
||||
|
||||
.dashboard-small-chart {
|
||||
width: 156px; }
|
||||
.dashboard-small-chart .dashboard-interior-chart {
|
||||
width: 50px; } }
|
||||
width: -44px; }
|
||||
|
||||
.dashboard-tendency-chart {
|
||||
width: 156px; }
|
||||
.dashboard-tendency-chart .dashboard-interior-chart {
|
||||
width: -44px; } }
|
||||
@media (min-width: 720px) and (max-width: 959px) {
|
||||
div.resizecontainer {
|
||||
width: 708px; }
|
||||
|
|
@ -2132,17 +2142,22 @@ div.resizecontainer {
|
|||
.dashboard-large-chart {
|
||||
width: 472px; }
|
||||
.dashboard-large-chart .dashboard-interior-chart {
|
||||
width: 366px; }
|
||||
width: 272px; }
|
||||
|
||||
.dashboard-medium-chart {
|
||||
width: 354px; }
|
||||
.dashboard-medium-chart .dashboard-interior-chart {
|
||||
width: 248px; }
|
||||
width: 154px; }
|
||||
|
||||
.dashboard-small-chart {
|
||||
width: 236px; }
|
||||
.dashboard-small-chart .dashboard-interior-chart {
|
||||
width: 130px; } }
|
||||
width: 36px; }
|
||||
|
||||
.dashboard-tendency-chart {
|
||||
width: 236px; }
|
||||
.dashboard-tendency-chart .dashboard-interior-chart {
|
||||
width: 36px; } }
|
||||
@media (min-width: 960px) and (max-width: 1199px) {
|
||||
div.resizecontainer {
|
||||
width: 948px; }
|
||||
|
|
@ -2155,17 +2170,22 @@ div.resizecontainer {
|
|||
.dashboard-large-chart {
|
||||
width: 632px; }
|
||||
.dashboard-large-chart .dashboard-interior-chart {
|
||||
width: 526px; }
|
||||
width: 432px; }
|
||||
|
||||
.dashboard-medium-chart {
|
||||
width: 474px; }
|
||||
.dashboard-medium-chart .dashboard-interior-chart {
|
||||
width: 368px; }
|
||||
width: 274px; }
|
||||
|
||||
.dashboard-small-chart {
|
||||
width: 316px; }
|
||||
.dashboard-small-chart .dashboard-interior-chart {
|
||||
width: 210px; } }
|
||||
width: 116px; }
|
||||
|
||||
.dashboard-tendency-chart {
|
||||
width: 316px; }
|
||||
.dashboard-tendency-chart .dashboard-interior-chart {
|
||||
width: 116px; } }
|
||||
@media (min-width: 1200px) and (max-width: 1439px) {
|
||||
div.resizecontainer {
|
||||
width: 1188px; }
|
||||
|
|
@ -2178,17 +2198,22 @@ div.resizecontainer {
|
|||
.dashboard-large-chart {
|
||||
width: 792px; }
|
||||
.dashboard-large-chart .dashboard-interior-chart {
|
||||
width: 686px; }
|
||||
width: 592px; }
|
||||
|
||||
.dashboard-medium-chart {
|
||||
width: 594px; }
|
||||
.dashboard-medium-chart .dashboard-interior-chart {
|
||||
width: 488px; }
|
||||
width: 394px; }
|
||||
|
||||
.dashboard-small-chart {
|
||||
width: 396px; }
|
||||
.dashboard-small-chart .dashboard-interior-chart {
|
||||
width: 290px; } }
|
||||
width: 196px; }
|
||||
|
||||
.dashboard-tendency-chart {
|
||||
width: 396px; }
|
||||
.dashboard-tendency-chart .dashboard-interior-chart {
|
||||
width: 196px; } }
|
||||
@media (min-width: 1440px) and (max-width: 1679px) {
|
||||
div.resizecontainer {
|
||||
width: 1428px; }
|
||||
|
|
@ -2201,17 +2226,22 @@ div.resizecontainer {
|
|||
.dashboard-large-chart {
|
||||
width: 952px; }
|
||||
.dashboard-large-chart .dashboard-interior-chart {
|
||||
width: 846px; }
|
||||
width: 752px; }
|
||||
|
||||
.dashboard-medium-chart {
|
||||
width: 714px; }
|
||||
.dashboard-medium-chart .dashboard-interior-chart {
|
||||
width: 608px; }
|
||||
width: 514px; }
|
||||
|
||||
.dashboard-small-chart {
|
||||
width: 476px; }
|
||||
.dashboard-small-chart .dashboard-interior-chart {
|
||||
width: 370px; } }
|
||||
width: 276px; }
|
||||
|
||||
.dashboard-tendency-chart {
|
||||
width: 476px; }
|
||||
.dashboard-tendency-chart .dashboard-interior-chart {
|
||||
width: 276px; } }
|
||||
@media (min-width: 1680px) and (max-width: 1919px) {
|
||||
div.resizecontainer {
|
||||
width: 1668px; }
|
||||
|
|
@ -2224,17 +2254,22 @@ div.resizecontainer {
|
|||
.dashboard-large-chart {
|
||||
width: 1112px; }
|
||||
.dashboard-large-chart .dashboard-interior-chart {
|
||||
width: 1006px; }
|
||||
width: 912px; }
|
||||
|
||||
.dashboard-medium-chart {
|
||||
width: 834px; }
|
||||
.dashboard-medium-chart .dashboard-interior-chart {
|
||||
width: 728px; }
|
||||
width: 634px; }
|
||||
|
||||
.dashboard-small-chart {
|
||||
width: 556px; }
|
||||
.dashboard-small-chart .dashboard-interior-chart {
|
||||
width: 450px; } }
|
||||
width: 356px; }
|
||||
|
||||
.dashboard-tendency-chart {
|
||||
width: 556px; }
|
||||
.dashboard-tendency-chart .dashboard-interior-chart {
|
||||
width: 356px; } }
|
||||
@media (min-width: 1920px) and (max-width: 2159px) {
|
||||
div.resizecontainer {
|
||||
width: 1908px; }
|
||||
|
|
@ -2247,17 +2282,22 @@ div.resizecontainer {
|
|||
.dashboard-large-chart {
|
||||
width: 1272px; }
|
||||
.dashboard-large-chart .dashboard-interior-chart {
|
||||
width: 1166px; }
|
||||
width: 1072px; }
|
||||
|
||||
.dashboard-medium-chart {
|
||||
width: 954px; }
|
||||
.dashboard-medium-chart .dashboard-interior-chart {
|
||||
width: 848px; }
|
||||
width: 754px; }
|
||||
|
||||
.dashboard-small-chart {
|
||||
width: 636px; }
|
||||
.dashboard-small-chart .dashboard-interior-chart {
|
||||
width: 530px; } }
|
||||
width: 436px; }
|
||||
|
||||
.dashboard-tendency-chart {
|
||||
width: 636px; }
|
||||
.dashboard-tendency-chart .dashboard-interior-chart {
|
||||
width: 436px; } }
|
||||
@media (min-width: 2160px) and (max-width: 2399px) {
|
||||
div.resizecontainer {
|
||||
width: 2148px; }
|
||||
|
|
@ -2270,17 +2310,22 @@ div.resizecontainer {
|
|||
.dashboard-large-chart {
|
||||
width: 1432px; }
|
||||
.dashboard-large-chart .dashboard-interior-chart {
|
||||
width: 1326px; }
|
||||
width: 1232px; }
|
||||
|
||||
.dashboard-medium-chart {
|
||||
width: 1074px; }
|
||||
.dashboard-medium-chart .dashboard-interior-chart {
|
||||
width: 968px; }
|
||||
width: 874px; }
|
||||
|
||||
.dashboard-small-chart {
|
||||
width: 716px; }
|
||||
.dashboard-small-chart .dashboard-interior-chart {
|
||||
width: 610px; } }
|
||||
width: 516px; }
|
||||
|
||||
.dashboard-tendency-chart {
|
||||
width: 716px; }
|
||||
.dashboard-tendency-chart .dashboard-interior-chart {
|
||||
width: 516px; } }
|
||||
@media (min-width: 2400px) and (max-width: 2639px) {
|
||||
div.resizecontainer {
|
||||
width: 2388px; }
|
||||
|
|
@ -2293,17 +2338,22 @@ div.resizecontainer {
|
|||
.dashboard-large-chart {
|
||||
width: 1592px; }
|
||||
.dashboard-large-chart .dashboard-interior-chart {
|
||||
width: 1486px; }
|
||||
width: 1392px; }
|
||||
|
||||
.dashboard-medium-chart {
|
||||
width: 1194px; }
|
||||
.dashboard-medium-chart .dashboard-interior-chart {
|
||||
width: 1088px; }
|
||||
width: 994px; }
|
||||
|
||||
.dashboard-small-chart {
|
||||
width: 796px; }
|
||||
.dashboard-small-chart .dashboard-interior-chart {
|
||||
width: 690px; } }
|
||||
width: 596px; }
|
||||
|
||||
.dashboard-tendency-chart {
|
||||
width: 796px; }
|
||||
.dashboard-tendency-chart .dashboard-interior-chart {
|
||||
width: 596px; } }
|
||||
@media (min-width: 2640px) and (max-width: 2879px) {
|
||||
div.resizecontainer {
|
||||
width: 2628px; }
|
||||
|
|
@ -2316,17 +2366,22 @@ div.resizecontainer {
|
|||
.dashboard-large-chart {
|
||||
width: 1752px; }
|
||||
.dashboard-large-chart .dashboard-interior-chart {
|
||||
width: 1646px; }
|
||||
width: 1552px; }
|
||||
|
||||
.dashboard-medium-chart {
|
||||
width: 1314px; }
|
||||
.dashboard-medium-chart .dashboard-interior-chart {
|
||||
width: 1208px; }
|
||||
width: 1114px; }
|
||||
|
||||
.dashboard-small-chart {
|
||||
width: 876px; }
|
||||
.dashboard-small-chart .dashboard-interior-chart {
|
||||
width: 770px; } }
|
||||
width: 676px; }
|
||||
|
||||
.dashboard-tendency-chart {
|
||||
width: 876px; }
|
||||
.dashboard-tendency-chart .dashboard-interior-chart {
|
||||
width: 676px; } }
|
||||
div.centralRow {
|
||||
margin-top: 65px;
|
||||
margin-bottom: 65px; }
|
||||
|
|
@ -2930,34 +2985,44 @@ pre.gv-object-view {
|
|||
text-overflow: ellipsis;
|
||||
white-space: nowrap; }
|
||||
|
||||
.dashboard-large-chart, .dashboard-medium-chart, .dashboard-small-chart, .dashboard-subtitle-bar, .dashboard-tendency {
|
||||
.dashboard-large-chart, .dashboard-medium-chart, .dashboard-small-chart, .dashboard-tendency-chart, .dashboard-subtitle-bar, .dashboard-tendency {
|
||||
border-left: 1px solid black;
|
||||
margin-left: -1px; }
|
||||
.dashboard-large-chart:first-child, .dashboard-medium-chart:first-child, .dashboard-small-chart:first-child, .dashboard-subtitle-bar:first-child, .dashboard-tendency:first-child {
|
||||
.dashboard-large-chart:first-child, .dashboard-medium-chart:first-child, .dashboard-small-chart:first-child, .dashboard-tendency-chart:first-child, .dashboard-subtitle-bar:first-child, .dashboard-tendency:first-child {
|
||||
border-left: 0;
|
||||
margin-left: 0; }
|
||||
|
||||
.dashboard-interior-chart {
|
||||
height: 220px; }
|
||||
height: 222px; }
|
||||
|
||||
.dashboard-large-chart {
|
||||
height: 250px; }
|
||||
height: 250px;
|
||||
padding-top: 28px; }
|
||||
|
||||
.dashboard-medium-chart {
|
||||
height: 250px; }
|
||||
height: 250px;
|
||||
padding-top: 28px; }
|
||||
|
||||
.dashboard-small-chart {
|
||||
height: 250px; }
|
||||
height: 250px;
|
||||
padding-top: 28px; }
|
||||
|
||||
.dashboard-tendency-chart {
|
||||
height: 278px; }
|
||||
|
||||
.dashboard-legend {
|
||||
width: 100px; }
|
||||
height: 250px;
|
||||
width: 200px; }
|
||||
.dashboard-legend .dashboard-legend-inner {
|
||||
padding-top: 20px; }
|
||||
|
||||
.dashboard-half-height-chart {
|
||||
height: 125px; }
|
||||
height: 139px; }
|
||||
|
||||
.dashboard-title-bar {
|
||||
background-color: #686766;
|
||||
border-bottom: 0;
|
||||
border-bottom: 1px;
|
||||
border-bottom-color: black;
|
||||
border-left: 1px;
|
||||
border-left-color: black;
|
||||
border-right: 1px;
|
||||
|
|
@ -2972,10 +3037,16 @@ pre.gv-object-view {
|
|||
margin-left: -1px;
|
||||
margin-right: -1px;
|
||||
text-align: center; }
|
||||
.dashboard-title-bar .dashboard-half-title-bar {
|
||||
border-left: 1px solid black;
|
||||
margin-left: -1px;
|
||||
width: 50%; }
|
||||
.dashboard-title-bar .dashboard-half-title-bar:first-child {
|
||||
border-left: 0;
|
||||
margin-left: 0; }
|
||||
|
||||
.dashboard-subtitle-bar {
|
||||
border-bottom: 1px solid black;
|
||||
border-top: 1px solid black;
|
||||
font-size: 16px;
|
||||
height: 36px;
|
||||
line-height: 36px;
|
||||
|
|
@ -2983,7 +3054,7 @@ pre.gv-object-view {
|
|||
width: 50%; }
|
||||
|
||||
.dashboard-tendency {
|
||||
height: 53px;
|
||||
height: 65px;
|
||||
width: 50%; }
|
||||
|
||||
.dashboard-row {
|
||||
|
|
|
|||
Loading…
Reference in New Issue