{# tabs.html #}
<!-- daisyui tabs https://daisyui.com/components/tab/ -->

{% macro navbar_active(atab) %}
<div class="navbar fixed top-0 z-40 bg-base-100">
  <div class="flex-1">
    <div class="tabs">

      <button class={% if atab|int == 1 %} "tab tab-lifted tab-active"> {% else %} "tooltip tooltip-right tab tab-lifted" data-tip="Load a text file"> {% endif %}
        <span style="font-size: 25px; color: Tomato;">
          <i id="tab1" class="fa fa-file-alt"></i>
        </span>
          <!-- <button id="filebtn"><i class="fa fa-file-alt"></i>Normal</button> -->
      </button>

      <button class={% if atab|int == 2 %} "tab tab-lifted tab-active"> {% else %} "tooltip tooltip-right tab tab-lifted" data-tip="Translate and edit when necesssary"> {% endif %}
        <span style="font-size: 25px; color: Tomato;">
          <i id="tab2" class="fas fa-globe"></i>
                <!-- fas fa-language -->
        </span>
      </button>

      <button class={% if atab|int == 3 %} "tab tab-lifted tab-active"> {% else %} "tooltip tooltip-right tab tab-lifted" data-tip="qq-group:316287378"> {% endif %}
        <span style="font-size: 25px; color: Tomato;">
          <i id="tab3" class="fa fa-info"></i>
        </span>
      </button>

      <!-- <a class={% if atab|int == 5 %} "tab tab-lifted tab-active"> {% else %} "tooltip tooltip-right tab tab-lifted" data-tip="for logging messages"> {% endif %} -->
        <!-- <span style="font-size: 25px; color: Tomato;"> -->
          <!-- <i id="tablog" class="fas fa-file-signature"></i> -->
        <!-- </span> -->
      <!-- </a> -->

      <button class={% if atab|int == 4 %} "tab tab-lifted tab-active"> {% else %} "tooltip tooltip-right tab tab-lifted" data-tip="Click to quit, no question asked"> {% endif %}
        <span style="font-size: 25px; color: Tomato;">
          <i id="tab4" class="fa fa-power-off"></i>
        </span>
      </button>

        <!-- <div id="dummy"> -->
                         <!-- <span style="font-size: 25px; color: Tomato;"> -->
          <!-- <button> -->
                <!-- <i class="fas fa-file-signature"></i> -->
          <!-- </button> -->
              <!-- </span> -->
        <!-- </div> -->
    </div>
  </div>
</div>
{% endmacro %}