JSFiddle - React, Tailwind, and code Playground

by Sascha

HTML

<div class="no-data">
  <div class="report-title">Top 10 Errors</div>
  <div class="report-sub-title">
    2019-10-08 01:33:13 - 09:30:25 [Duration: 7:57:12]
  </div>
  <div class="content">
  Machine has not reported any errors in the given time range.
  </div>
</div>

CSS

.no-data {
  width: 100%;
  height: 100px;
  text-align: center;
}

.no-data .report-title {
  color: #333333;
  font-size: 14px;
  font-family: Verdana, sans-serif;
  margin-bottom: 5px;
}

.no-data .report-sub-title {
  font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, Helvetica, sans-serif;
  font-size: 12px;
  color: #666666;
}

.no-data .content {
  font: 15px Verdana, sans-serif;
  white-space: nowrap;
  color: rgb(51, 51, 51);
  font-weight: bold;
  margin-top: 30px;
}