Grafana Organizr custom HTML

<style>

.grid-container {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  grid-gap: 10px;
  padding: 0px;
}

.grid-container > div {
  text-align: center;
  padding: 0px 0;
}

.grid-smallstats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  grid-gap: 10px;
  padding-top: 10px;
  padding-bottom: 10px;

}

.grid-smallstats > div {
  text-align: center;
  padding: 0px 0;
}

/* ------------------- Gauge ------------------- */

.gauge {
  grid-row: span 5;
  grid-column: span 2
}

@media (max-width: 650px) {
  .gauge {
    min-height: 300px;
    grid-column: span 2
  }
}

/* ------------------- Gauge ------------------- */

/* ------------------- Big text ------------------- */

.bigtext {
  grid-row: span 3;
  grid-column: span 2
}

/* ------------------- Big text ------------------- */

/* ------------------- Small text ------------------- */

.smalltext {
  grid-row: span 2;
  grid-column: span 2
}

/* ------------------- Small text ------------------- */

/* ------------------- Short text ------------------- */

.shorttext {
  grid-row: span 2;
  grid-column: span 1
}

/* ------------------- Short text ------------------- */

/* ------------------- Thin text ------------------- */

.thintext {
  grid-row: span 1;
  grid-column: span 2
}

/* ------------------- Thin text ------------------- */

/* ------------------- Thin short text ------------------- */

.thintextshort {
  grid-row: span 1;
  grid-column: span 1
}

/* ------------------- Thin short text ------------------- */

/* ------------------- iframe ------------------- */

.iframe {
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  border: none;
}

/* ------------------- iframe ------------------- */

/* ------------------- Small stats ------------------- */
  
.stats {
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 75px;
  border: none;
}

/* ------------------- Small stats ------------------- */
  
</style>

<!-- ----------------- Top section ------------------ -->

<div class="grid-container">
  <div class="gauge"><iframe class="iframe" src="http://grafana_url:port/grafana_link&panelId=49"></iframe></div>
  <div class="gauge"><iframe class="iframe" src="http://grafana_url:port/grafana_link&panelId=51"></iframe></div>
  <div class="bigtext"><iframe class="iframe" src="http://grafana_url:port/grafana_link&panelId=53"></iframe></div>  
  <div class="bigtext"><iframe class="iframe" src="http://grafana_url:port/grafana_link&panelId=60"></iframe></div>
  <div class="bigtext"><iframe class="iframe" src="http://grafana_url:port/grafana_link&panelId=61"></iframe></div>
  <div class="smalltext"><iframe class="iframe" src="http://grafana_url:port/grafana_link&panelId=17"></iframe></div>
  <div class="smalltext"><iframe class="iframe" src="http://grafana_url:port/grafana_link&panelId=47"></iframe></div>
  <div class="shorttext"><iframe class="iframe" src="http://grafana_url:port/grafana_link&panelId=14"></iframe></div>
  <div class="shorttext"><iframe class="iframe" src="http://grafana_url:port/grafana_link&panelId=13"></iframe></div>
</div>

<!-- ----------------- Top section ------------------ -->

<!-- ----------------- Bottom section ------------------ -->

<div class="grid-smallstats">
  <div class="thintext"><iframe class="stats" src="http://grafana_url:port/grafana_link&panelId=21"></iframe></div> 
  <div class="thintextshort"><iframe class="stats" src="http://grafana_url:port/grafana_link&panelId=20"></iframe></div>
  <div class="thintextshort"><iframe class="stats" src="http://grafana_url:port/grafana_link&panelId=19"></iframe></div>
  <div class="thintextshort"><iframe class="stats" src="http://grafana_url:port/grafana_link&panelId=22"></iframe></div>
  <div class="thintextshort"><iframe class="stats" src="http://grafana_url:port/grafana_link&panelId=23"></iframe></div>
  <div class="thintextshort"><iframe class="stats" src="http://grafana_url:port/grafana_link&panelId=24"></iframe></div>
  <div class="thintextshort"><iframe class="stats" src="http://grafana_url:port/grafana_link&panelId=25"></iframe></div>
  <div class="thintextshort"></div>
  <div class="thintextshort"></div>
</div>

<!-- ----------------- Bottom section ------------------ -->