templates.disaster.jade Maven / Gradle / Ivy
doctype html
html
head
title
meta(http-equiv="Content-Type", content="text/html; charset=utf-8")
meta(name="viewport", content="width=320, target-densitydpi=device-dpi")
style(type='text/css').
body { margin: 0; padding: 0 }
body, * { font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; -webkit-text-size-adjust: 90% }
@media (max-width: 800px) {
#background { background: #fff !important; padding: 0 !important }
}
pre { font-size: 12px; line-height: 18px; overflow: auto; white-space: pre; }
code, pre, code *, pre * { font-family: Menlo, Monaco, Consolas, "Courier New", monospace; }
body(style="margin: 0; padding: 0")
div#background(style="background: #eee; padding: 20px")
div(style="background: #fff; padding: 20px; width: 540px; max-width: 100%; color: #444; border-radius: 5px; margin: 0 auto")
//- Header
div(style="padding-bottom: 20px")
div(style="border-top: 10px solid #{ color }; padding: 20px; background: #eee; border-radius: 4px; text-align: center")
h1(style="font-weight: normal; margin: 0 0 12px; line-height: 1.3") New Disaster(s) Detected
//- Active Disasters
div(style="padding-bottom: 20px")
div(style="padding-bottom: 12px; margin: 15px 0; border-bottom: 1px solid #eee")
h3(style="margin: 0; font-size: 20px; line-height: 1") Active Disasters
table(style="border: 0; border-collapse: collapse; background: #eee")
tr
th(style="border: 0; border-collapse: collapse; padding: 12px; color: #444; border-bottom: 1px solid #ccc; text-align: left") Type
th(style="border: 0; border-collapse: collapse; padding: 12px; color: #444; border-bottom: 1px solid #ccc; text-align: left") Active
each disaster, i in disasterTypes
tr
td(style="border: 0; border-collapse: collapse; padding: 12px; color: #444")= disaster.type
td(style="border: 0; border-collapse: collapse; padding: 12px; color: #444")= disaster.active
//- Recent Data
div(style="padding-bottom: 20px")
div(style="padding-bottom: 12px; margin: 15px 0; border-bottom: 1px solid #eee")
h3(style="margin: 0; font-size: 20px; line-height: 1") Disaster Stats
table(style="border: 0; border-collapse: collapse; background: #eee")
tr
th(style="border: 0; border-collapse: collapse; padding: 12px; color: #444; border-bottom: 1px solid #ccc; text-align: left") Time
th(style="border: 0; border-collapse: collapse; padding: 12px; color: #444; border-bottom: 1px solid #ccc; text-align: left") Active Tasks
th(style="border: 0; border-collapse: collapse; padding: 12px; color: #444; border-bottom: 1px solid #ccc; text-align: left") Peding Tasks
th(style="border: 0; border-collapse: collapse; padding: 12px; color: #444; border-bottom: 1px solid #ccc; text-align: left") Late Tasks
th(style="border: 0; border-collapse: collapse; padding: 12px; color: #444; border-bottom: 1px solid #ccc; text-align: left") Lost Tasks
th(style="border: 0; border-collapse: collapse; padding: 12px; color: #444; border-bottom: 1px solid #ccc; text-align: left") Avg Lag (ms)
th(style="border: 0; border-collapse: collapse; padding: 12px; color: #444; border-bottom: 1px solid #ccc; text-align: left") Lost Slaves
each stat, i in stats
tr
td(style="border: 0; border-collapse: collapse; padding: 12px; color: #444")= stat.time
td(style="border: 0; border-collapse: collapse; padding: 12px; color: #444")= stat.numActiveTasks
td(style="border: 0; border-collapse: collapse; padding: 12px; color: #444")= stat.numPendingTasks
td(style="border: 0; border-collapse: collapse; padding: 12px; color: #444")= stat.numLateTasks
td(style="border: 0; border-collapse: collapse; padding: 12px; color: #444")= stat.numLostTasks
td(style="border: 0; border-collapse: collapse; padding: 12px; color: #444")= stat.avgTaskLagMillis
td(style="border: 0; border-collapse: collapse; padding: 12px; color: #444")= stat.numLostSlaves