inav-configurator/tabs/programming.html

<div class="tab-configuration tab-programming toolbar_fixed_bottom">
    <div class="content_wrapper" id="programming-main-content">

        <div class="tab_title subtab__header">
            <span class="subtab__header_label subtab__header_label--current" for="logic-wrapper" data-i18n="tabLogicConditions"></span>
            <span class="subtab__header_label" for="functions-wrapper" data-i18n="globalFunctions"></span>
        </div>

        <div id="logic-wrapper" class="subtab__content subtab__content--current">
            
            <div class="gvar__container">
                <div class="gvar__wrapper">
                    <div class="gvar__cell">
                        <h2>GVAR 0</h2>
                        <label class="gvar__value" data-gvar-index="0">0</label>
                    </div>
                </div>
                <div class="gvar__wrapper">
                    <div class="gvar__cell">
                        <h2>GVAR 1</h2>
                        <label class="gvar__value" data-gvar-index="1">0</label>
                    </div>
                </div>
                <div class="gvar__wrapper">
                    <div class="gvar__cell">
                        <h2>GVAR 2</h2>
                        <label class="gvar__value" data-gvar-index="2">0</label>
                    </div>
                </div>
                <div class="gvar__wrapper">
                    <div class="gvar__cell">
                        <h2>GVAR 3</h2>
                        <label class="gvar__value" data-gvar-index="3">0</label>
                    </div>
                </div>
            </div>
            
            <table class="mixer-table logic__table">
                <thead>
                    <tr>
                        <th style="width: 50px" data-i18n="logicId"></th>
                        <th style="width: 80px" data-i18n="logicEnabled"></th>
                        <th style="width: 120px" data-i18n="logicOperation"></th>
                        <th data-i18n="logicOperandA"></th>
                        <th data-i18n="logicOperandB"></th>
                        <th data-i18n="logicActivator"></th>
                        <th style="width: 40px" data-i18n="logicFlags"></th>
                        <th style="width: 50px" data-i18n="logicStatus"></th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>

        <div id="functions-wrapper" class="subtab__content">
            <table class="mixer-table function__table">
                <thead>
                    <tr>
                        <th style="width: 50px" data-i18n="functionId"></th>
                        <th style="width: 80px" data-i18n="functionEnabled"></th>
                        <th style="width: 120px" data-i18n="functionLogicId"></th>
                        <th data-i18n="functionAction"></th>
                        <th data-i18n="functionOperand"></th>
                        <th data-i18n="functionFlags"></th>
                        <th data-i18n="functionStatus"></th>
                    </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>

    </div>
    <div class="content_toolbar">
        <div class="btn save_btn">
            <a id="save-button" class="save" href="#" data-i18n="save"></a>
        </div>
    </div>
</div>