timetracking/httpdocs/templates/_sections/tt-header.html.twig

{# templates/_sections/tt-header.html.twig #}
{# Erwartet im Kontext: currentDate, todayStr, tomorrowStr, yesterdayStr,
   months, monthsShort, weekdays, weekDays, currentWeekNumber,
   prevWeekUrl, nextWeekUrl #}

{% from '_macros/helpers.html.twig' import smart_date %}

<header class="tt-header">
  {# Minimal-Modus: kompakter Header mit Toggle #}
  <div class="tt-header__minimal-bar">
    <div class="tt-header__minimal-date">
      {{ smart_date(currentDate, todayStr, tomorrowStr, yesterdayStr, months, weekdays) }}
    </div>
    <button type="button" class="tt-header__week-toggle" id="btn-week-toggle" aria-expanded="false" title="{{ 'app.nav.week_view'|trans }}">
      {{ 'app.date.week_short'|trans }} {{ currentWeekNumber }} ▾
    </button>
  </div>

  <div class="tt-header__meta">
    <div class="tt-header__date">
      {{ smart_date(currentDate, todayStr, tomorrowStr, yesterdayStr, months, weekdays) }}
    </div>
    <div class="tt-header__kw">{{ 'app.date.week_label'|trans }} {{ currentWeekNumber }}</div>
  </div>

  <div class="tt-header__collapsible" id="tt-header-collapsible">
  <nav class="week-nav"
       aria-label="{{ 'app.date.week_label'|trans }}"
       data-active-date="{{ currentDate|date('Y-m-d') }}">

    <a href="{{ prevWeekUrl }}"
       class="week-nav__arrow week-nav__arrow--prev"
       title="{{ 'app.nav.prev_week'|trans }}">
      {% include '_atoms/icon-arrow-left.html.twig' %}
    </a>

    <div class="week-nav__days">
      {% for day in weekDays %}
        {% set dayMonthShort = monthsShort[day.date|date('n') - 1] %}
        <a href="{{ path('timetracking_week_date', { date: day.date|date('Y-m-d') }) }}"
           class="week-nav__day{% if day.isActive %} week-nav__day--active{% endif %}{% if day.isToday %} week-nav__day--today{% endif %}"
           data-date="{{ day.date|date('Y-m-d') }}"
           {% if day.isActive %}aria-current="date"{% endif %}>
          <span class="week-nav__day-name">{{ day.short }}</span>
          <span class="week-nav__day-date">{{ day.date|date('d') }}. {{ dayMonthShort }}</span>
        </a>
      {% endfor %}
    </div>

    <button class="week-nav__cal" title="{{ 'app.nav.month_view'|trans }}">
      {% include '_atoms/icon-calendar.html.twig' %}
    </button>

    <a href="{{ nextWeekUrl }}"
       class="week-nav__arrow week-nav__arrow--next"
       title="{{ 'app.nav.next_week'|trans }}">
      {% include '_atoms/icon-arrow-right.html.twig' %}
    </a>

  </nav>
  </div>{# /.tt-header__collapsible #}
</header>