Skip to content

Commit

Permalink
Merge pull request #18 from mattcolegate/master
Browse files Browse the repository at this point in the history 
Mirror AppMetrics Dashboard Layout
  • Loading branch information
@tobespc
tobespc authored Feb 9, 2017
2 parents 997cb84 + 616cc88 commit f4ba48d
Show file tree
Hide file tree
Showing 11 changed files with 639 additions and 507 deletions.
153 changes: 90 additions & 63 deletions public/css/style.css
View file
Original file line number Diff line number Diff line change
@@ -1,89 +1,118 @@
@viewport {
width: 320;
width: 320;
}

html {
background-color: #3b4b54;
background-color: #3b4b54;
}

body {
font: 12px Arial;
fill: white;
background-color: #3b4b54;
font: 12px Arial;
fill: white;
}

h1 {
font: 26px Arial;
font-weight: bold;
text-align: center;
color: white;
.container-fluid {
background-color: #3b4b54;
}

p {
font: 18px;
color: white;
h1 {
font: 26px Arial;
font-weight: bold;
text-align: center;
color: white;
}

svg {
margin: 3px;
background-color: #3f505a;
margin: 3px;
border: 1px solid #dfe6eb;
}

#envDiv {
background-color: #3f505a;
.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6 {
padding-right: 1px;
padding-left: 1px;
padding-top: 0px;
padding-bottom: 0px
}

.cpuChart path,
.memChart path,
.httpThroughPutChart path,
.httpChart path {
stroke: #6decd7;
stroke-width: 2;
fill: none;
stroke: #00b4a0;
stroke-width: 2;
fill: none;
}

path.line1 {
stroke: #00b4a0;
stroke-width: 2;
fill: none;
}

path.line2,
path.processLine {
stroke: #95d13c;
stroke-width: 2;
fill: none;
}

path.line3,
path.httpline {
stroke: #5aaafa;
stroke-width: 2;
fill: none;
}

.axis path,
.axis line {
fill: none;
stroke: grey;
stroke-width: 1;
shape-rendering: crispEdges;
g.xAxis path,
g.xAxis line,
g.yAxis path,
g.yAxis line {
fill: none;
stroke: white;
stroke-width: 1;
shape-rendering: crispEdges;
}

g.tick line {
stroke: white;
}

.axis2 path,
.axis2 line {
fill: none;
stroke: grey;
stroke-width: 1;
shape-rendering: crispEdges;
fill: none;
stroke: white;
stroke-width: 1;
shape-rendering: crispEdges;
}

.legend {
font: 12px Arial;
font-weight: bold;
text-anchor: left;
.lineLabel,
.lineLabel2,
.avglatestlabel,
.minlatestlabel {
font: 14px Arial;
text-anchor: left;
}

.grid .tick {
stroke: lightgrey;
stroke-opacity: 0.7;
shape-rendering: crispEdges;
.colourbox1 {
fill: #00b4a0;
stroke: #dbe6e9;
stroke-width: 1px;
}

.grid path {
stroke-width: 0;
.colourbox2 {
fill: #95d13c;
stroke: #dbe6e9;
stroke-width: 1px;
}

div.tooltip {
position: absolute;
text-align: center;
padding: 3px;
font: 12px sans-serif;
background: #b0f4e8;
border: 0px;
border-radius: 8px;
pointer-events: none;
.colourbox3 {
fill: #5aaafa;
stroke: #dbe6e9;
stroke-width: 1px;
}

.container {
Expand All @@ -96,29 +125,27 @@
text-align: center;
}


g.arc {
fill: #6decd7;
fill: #6decd7;
}

g.pointer {
fill: #959f9f;
stroke: #000000;
fill: #959f9f;
stroke: #000000;
}

g.label text {
text-anchor: middle;
text-align: center;
font-size: 12px;
text-anchor: middle;
text-align: center;
font-size: 12px;
}

.urlChart rect {
fill: #6decd7;
.httpTop5Chart .bar {
fill: #5aaafa;
}

th, td {
padding: 5px;
border-bottom: 1px solid #696969;
color: white;
.titlebox {
fill: #949394;
stroke: #dbe6e9;
stroke-width: 1px;
}

122 changes: 82 additions & 40 deletions public/css/style2.css
View file
Original file line number Diff line number Diff line change
@@ -1,42 +1,68 @@
@viewport {
width: 320;
width: 320;
}

html {
background-color: white;
}

body {
font: 14px Arial;
fill: #3b4b54;
font: 12px Arial;
fill: #3b4b54;
}

.container-fluid {
background-color: white;
}

h1 {
font: 26px Arial;
font-weight: bold;
text-align: center;
color: #3b4b54;
font: 26px Arial;
font-weight: bold;
text-align: center;
color: #3b4b54;
}

svg {
margin: 2px;
background-color: #f7f7f7;
margin: 3px;
border: 1px solid #dfe6eb;
}

#envDiv {
background-color: #f7f7f7;

.col-md-2,
.col-md-3,
.col-md-4,
.col-md-5,
.col-md-6 {
padding-right: 1px;
padding-left: 1px;
padding-top: 0px;
padding-bottom: 0px
}

.cpuChart path,
.memChart path {
stroke: #6eedd8;
.memChart path,
.httpThroughPutChart path,
.httpChart path {
stroke: #00b4a0;
stroke-width: 2;
fill: none;
}

path.line1 {
stroke: #00b4a0;
stroke-width: 2;
fill: none;
}

path.line2,
path.processLine {
stroke: #734098;
stroke-width: 2;
fill: none;
}

.httpChart path,
.httpThroughPutChart path {
stroke: #7cc7ff;
path.line3,
path.httpline {
stroke: #5aaafa;
stroke-width: 2;
fill: none;
}
Expand All @@ -45,10 +71,10 @@
g.xAxis line,
g.yAxis path,
g.yAxis line {
fill: none;
stroke: #42535c;
stroke-width: 1;
shape-rendering: crispEdges;
fill: none;
stroke: #42535c;
stroke-width: 1;
shape-rendering: crispEdges;
}

g.tick line {
Expand All @@ -64,10 +90,29 @@
}

.lineLabel,
.processlatestlabel {
font: 12px Arial;
font-weight: bold;
text-anchor: left;
.lineLabel2,
.avglatestlabel,
.minlatestlabel {
font: 14px Arial;
text-anchor: left;
}

.colourbox1 {
fill: #00b4a0;
stroke: #dbe6e9;
stroke-width: 1px;
}

.colourbox2 {
fill: #734098;
stroke: #dbe6e9;
stroke-width: 1px;
}

.colourbox3 {
fill: #5aaafa;
stroke: #dbe6e9;
stroke-width: 1px;
}

.container {
Expand All @@ -81,29 +126,26 @@
}

g.arc {
fill: #6decd7;
fill: #6decd7;
}

g.pointer {
fill: #959f9f;
stroke: #000000;
fill: #959f9f;
stroke: #000000;
}

g.label text {
text-anchor: middle;
text-align: center;
font-size: 12px;
text-anchor: middle;
text-align: center;
font-size: 12px;
}

.httpTop5Chart rect {
fill: #5aaafa;
.httpTop5Chart .bar {
fill: #5aaafa;
}

table, th, td {
background-color: #f7f7f7;
}
th, td {
padding: 5px;
border-bottom: 1px solid #ddd;
.titlebox {
fill: #eff3f5;
stroke: #dbe6e9;
stroke-width: 1px;
}

Loading

0 comments on commit f4ba48d

Please sign in to comment.