Mercurial > hg > websites > naclstats / changeset

--- a/index.html	Mon Jan 13 13:37:23 2020 -0700
+++ b/index.html	Mon Feb 17 00:42:56 2020 -0700
@@ -21,21 +21,12 @@
 			<h4>
 				SYSTEM HEALTH
 			</h4>
-			<ul class="list">
-				<li>
-					<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-30s&to=now&panelId=8" width="148" height="148" frameborder="0"></iframe>
-				</li>
-				<li>
-					<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=9" width="148" height="148" frameborder="0"></iframe>
-				</li>
-				<li>
-					<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=10" width="512" height="148" frameborder="0"></iframe>
-				</li>
-				<li>
-					<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=11" width="512" height="148" frameborder="0"></iframe>
-				</li>
-			</ul>
-		</section>
+			<div class="flex-container">
+					<div class="flex-graphs"><iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-30s&to=now&panelId=8" width="148" height="148" frameborder="0"></iframe></div>
+					<div class="flex-graphs"><iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=9" width="148" height="148" frameborder="0"></iframe></div>
+					<div class="flex-graphs"><iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=10" width="512" height="148" frameborder="0"></iframe></div>
+					<div class="flex-graphs"><iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=11" width="512" height="148" frameborder="0"></iframe></div>
+			</div>
 	</div>
 
 	<div class="linkbox">
@@ -43,52 +34,45 @@
 			<h4>
 					TRANSIT LATENCY
 			</h4>
-			<ul class="list">
-				<li>
-					<h4> <a href="latency/cogent.html"> Cogent </a> </h4>
-					<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=24" width="512" height="148" frameborder="0"></iframe>
-				</li>
-				<li>
-					<h4> <a href="latency/comcast.html"> Comcast </a> </h4>
-					<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=26" width="512" height="148" frameborder="0"></iframe>
-				</li>
-				<li>
-			</ul>
-			<ul class="list">
-				<li>
+				<div class="flex-container">
+					<div class="flex-start">
+						<h4> <a href="latency/cogent.html"> Cogent </a> </h4>
+						<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=24" width="512" height="148" frameborder="0"></iframe>
+					</div>
+					<div class="flex-graphs">
+						<h4> <a href="latency/comcast.html"> Comcast </a> </h4>
+						<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=26" width="512" height="148" frameborder="0"></iframe>
+					</div>
+					<div class="flex-graphs">
 						<h4> <a href="latency/NTT.html"> NTT </a> </h4>
 						<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=30" width="512" height="148" frameborder="0"></iframe>
-					</li>
-				<li>
-					<h4> <a href="latency/xo.html"> XO </a> </h4>
-					<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=2" width="512" height="148" frameborder="0"></iframe>
-				</li>
-			</ul>
+					</div>
+					<div class="flex-end">						
+						<h4> <a href="latency/xo.html"> XO </a> </h4>
+						<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=2" width="512" height="148" frameborder="0"></iframe>
+					</div>
+				</div>
 			<h4>
 				EXCHANGE LATENCY
 			</h4>
-			<ul class="list">
-				<li>
+				<div class="flex-container">
+					<div class="flex-start">
 						<h4> <a href="latency/any2.html"> Any2 </a> </h4>
 						<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=13" width="512" height="148" frameborder="0"></iframe>
-	
-				</li>
-				<li>
-					<h4> <a href="latency/SIX.html"> SIX </a> </h4>
-					<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=34" width="512" height="148" frameborder="0"></iframe>
-				</li>
-				<li>
-					<h4> <a href="latency/SLIX.html"> SLIX </a> </h4>
-					<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=28" width="512" height="148" frameborder="0"></iframe>
-				</li>
-			</ul>
-			<ul class="list">
-				<li>
+					</div class="flex-graphs">
+					<div class="flex-graphs">
+						<h4> <a href="latency/SIX.html"> SIX </a> </h4>
+						<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=34" width="512" height="148" frameborder="0"></iframe>
+					</div>
+					<div class="flex-graphs">
+						<h4> <a href="latency/SLIX.html"> SLIX </a> </h4>
+						<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=28" width="512" height="148" frameborder="0"></iframe>
+					</div>
+					<div class="flex-end">						
 						<h4> <a href="latency/HE.html"> HE </a> </h4>
 						<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=63" width="512" height="148" frameborder="0"></iframe>
-					</li>
-				<li>
-			</ul>
+					</div>
+				</div>
 		</section>
 	</div>
 
@@ -97,40 +81,36 @@
 			<h4>
 					ENDPOINT LATENCY
 			</h4>
-			<ul class="list">
-				<li>
+			<div class="flex-container">
+				<div class="flex-start">
 					<h4> <a href="latency/colind.html"> Colind </a> </h4>
 					<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=38" width="512" height="148" frameborder="0"></iframe>
-				</li>
-				<li>
+				</div>
+				<div class="flex-graphs">
 						<h4> <a href="latency/google.html"> Google DNS </a> </h4>
 						<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=42" width="512" height="148" frameborder="0"></iframe>
-				</li>
-				<li>
+				</div>
+				<div class="flex-graphs">
 						<h4> <a href="latency/dal05.html"> DAL05 (Softlayer) </a> </h4>
 						<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=46" width="512" height="148" frameborder="0"></iframe>
-				</li>
-			</ul>
-			<ul class="list">
-				<li>
+				</div>
+				<div class="flex-graphs">
 						<h4> <a href="latency/nfola.html"> NFO (LA) </a> </h4>
 						<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=51" width="512" height="148" frameborder="0"></iframe>
-				</li>
-				<li>
+				</div>
+				<div class="flex-graphs">
 						<h4> <a href="latency/nfosj.html"> NFO (SJ) </a> </h4>
 						<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=52" width="512" height="148" frameborder="0"></iframe>
-				</li>
-				<li>
+				</div>
+				<div class="flex-graphs">
 						<h4> <a href="latency/c7slc.html"> C7 (SLC) </a> </h4>
 						<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=56" width="512" height="148" frameborder="0"></iframe>
-				</li>
-			</ul>
-			<ul class="list">
-				<li>
+				</div>
+				<div class="flex-end">
 						<h4> <a href="latency/zarth.html"> Zarth (CHI) </a> </h4>
 						<iframe src="https://grafana.nacl.glitchvid.com/d-solo/39mqm44Zz/render-template-dashboard?orgId=2&refresh=5m&var-interval=5m&from=now-24h&to=now&panelId=60" width="512" height="148" frameborder="0"></iframe>
-				</li>
-			</ul>
+				</div>
+			</div>
 		</section>
 	</div>
 

--- a/styles.css	Mon Jan 13 13:37:23 2020 -0700
+++ b/styles.css	Mon Feb 17 00:42:56 2020 -0700
@@ -187,4 +187,27 @@
 	font-weight: 700;
 }
 
+.flex-container {
+	display: flex;
+	flex-direction: row;
+	flex-wrap: wrap;
+	justify-content: center;
+	font-family: Roboto,sans-serif;
+	font-size: 1.25em;
+	font-weight: 700;
+	margin-top: 0.25em;
+}
+
+div.flex-start {
+	align-self: flex-start;
+}
+
+div.flex-graphs {
+	align-self: center;
+}
+
+div.flex-end {
+	align-self: flex-end;
+}
+
 /* That's all she wrote. */
\ No newline at end of file