Responsive-Test

Simple 3-2-1 responsive column layout

HTML

<div class="css-table">
  <div class="css-tr">
    <span class="css-td"><button class="admin-table-button" id="set-time-button" style="width:100%;height:100%">Set Time</button></span>
    <p class="button-description">Syncs the time on the TS282 to the system time of this device</p>
  </div>
  <div class="css-tr">
    <span class="css-td"><button class="admin-table-button" id="night-mode-button" style="width:100%;height:100%">Night Mode</button></span>
    <p class="button-description">Toggle alternate color shceme for easy viewing in low-light conditions</p>
  </div>
</div>

CSS

.css-td {
  display: table-cell;
  padding: .5em 5px;
}

.css-table {
  display: table
}

.css-tr {
  display: table-row
}

.button-description {
  padding-left: 25px;
  margin-top: 0px;
}

.admin-table-button {
  margin-top: 30px;
}

JavaScript

set_time = function() {
  $('#set-time-button').click(function() {
    var seconds = new Date().getTime() / 1000;
    console.log(seconds)
      //Ajax Request to send cmd to cli_manager
  });
};