web-apps/apps/spreadsheeteditor/main/app/template/StatusBar.template

<div class="statusbar">
    <div id="status-tabs-scroll" class="status-group">
        <button id="status-btn-tabfirst" type="button" class="btn small btn-toolbar" data-hint="0" data-hint-direction="top" data-hint-offset="small" data-hint-title="F"><i class="icon toolbar__icon btn-firstitem">&nbsp;</i></button>
        <button id="status-btn-tabback" type="button" class="btn small btn-toolbar" data-hint="0" data-hint-direction="top" data-hint-offset="small" data-hint-title="B"><i class="icon toolbar__icon btn-previtem">&nbsp;</i></button>
        <button id="status-btn-tabnext" type="button" class="btn small btn-toolbar" data-hint="0" data-hint-direction="top" data-hint-offset="small" data-hint-title="N"><i class="icon toolbar__icon btn-nextitem">&nbsp;</i></button>
        <button id="status-btn-tablast" type="button" class="btn small btn-toolbar" data-hint="0" data-hint-direction="top" data-hint-offset="small" data-hint-title="L"><i class="icon toolbar__icon btn-lastitem">&nbsp;</i></button>
    </div>
    <div id="status-addtabs-box" class="status-group">
        <button id="status-btn-addtab" type="button" class="btn small btn-toolbar" data-hint="0" data-hint-direction="top" data-hint-offset="small" data-hint-title="P"><i class="icon toolbar__icon btn-zoomup">&nbsp;</i></button>
        <div class="cnt-tabslist">
            <button id="status-btn-tabslist" type="button" class="btn small btn-toolbar dropdown-toggle" data-toggle="dropdown" data-hint="0" data-hint-direction="top" data-hint-offset="small" data-hint-title="S"><i class="icon toolbar__icon btn-sheet-list">&nbsp;</i></button>
        </div>
    </div>
    <div id="status-zoom-box" class="status-group">
        <div class="separator short"></div>
        <button id="status-btn-zoomdown" type="button" class="btn small btn-toolbar"><i class="icon toolbar__icon btn-zoomdown">&nbsp;</i></button>
        <div class="cnt-zoom">
            <div class="dropdown-toggle" data-toggle="dropdown" data-hint="0" data-hint-direction="top">
                <label id="status-label-zoom" class="status-label">Zoom 100%</label>
            </div>
        </div>
        <button id="status-btn-zoomup" type="button" class="btn small btn-toolbar" style="margin-right:40px;"><i class="icon toolbar__icon btn-zoomup">&nbsp;</i></button>
    </div>
    <div id="status-math-box" class="status-group">
        <div class="separator short"></div>
        <label id="status-math-average">AVERAGE: 10</label>
        <label id="status-math-count">COUNT: 3</label>
        <label id="status-math-min">MIN: 1</label>
        <label id="status-math-max">MAX: 5</label>
        <label id="status-math-sum">SUM: 5</label>
    </div>
    <div id="status-filtered-box" class="status-group">
        <div class="separator short"></div>
        <label id="status-filtered-records"></label>
    </div>
    <div id="status-sheets-bar-box">
        <div id="status-sheets-bar" class="status-group">
        </div>
    </div>
    <div id="status-number-of-sheet">
        <label id="label-sheets" class="status-label"></label>
    </div>
    <div id="status-action">
        <div class="separator short"></div>
        <label id="label-action" class="status-label"></label>
    </div>
</div>