UI engine

Overview

Page layout specifies by table structure. Variant of table slicing was selected, to provide the possibility to create more complex layouts, i.e. 2 rows (1st with 2 columns, 2nd with one). Layout table typical look

<table id="tblLayoutHolder" style="width: 100%; height: 100%">
  <tr>
    <td style="width: 100%;" colspan="2" class="column">
    </td>
  </tr>
  <tr>
    <td style="width: 25%;" class="column">
    </td>
    <td style="width: 75%;" class="column">
    </td>
  </tr>
</table>

Layout with 2 rows: 1st with one column, 2nd with 2 (25% and 75% width)

All widgets should be inserted inside td tag, marked with class="column".

Implemented layouts

User can select one of six layouts:

To change layout click Manage -> Change Page Layout