<nav class="filtersForm daterange">
    {~

        $USE_RANGE    = false;
        $USE_INTERVAL = false;

        if('/event' == $CURRENT_PATH || '/logbook' == $CURRENT_PATH) {
            $USE_RANGE = true;
        } else {
            $USE_INTERVAL = true;
        }

        if('/watchlist' == $CURRENT_PATH) {
            $USE_RANGE    = false;
            $USE_INTERVAL = false;
        }
    ~}

    <check if="{{ @USE_INTERVAL }}">

            <div class="control has-icons-left">
                <span class="dateselector">
                    <a href="javascript:void(0);" data-type="d" data-value="0"      class="blocked">MAX</a>
                    <a href="javascript:void(0);" data-type="d" data-value="2160"   class="blocked">3M</a>
                    <a href="javascript:void(0);" data-type="d" data-value="720"    class="blocked">1M</a>
                    <a href="javascript:void(0);" data-type="d" data-value="168"    class="blocked">1W</a>
                    <a href="javascript:void(0);" data-type="d" data-value="72"     class="blocked">3D</a>
                    <a href="javascript:void(0);" data-type="d" data-value="24"     class="active">1D</a>
                    <a href="javascript:void(0);" data-type="d" data-value="1"      class="blocked">1H</a>
                </span>

                <span class="icon">
                    <include href="images/icons/stopwatch.svg" />
                </span>

                <input type="hidden" name="date_from" />
                <input type="hidden" name="date_to" />
                <input type="hidden" name="offset" value="{{ @OFFSET }}"/>
            </div>

    </check>

    <check if="{{ @USE_RANGE }}">
        <input type="hidden" name="date_from" />
        <input type="hidden" name="date_to" />
        <input type="hidden" name="offset" value="{{ @OFFSET ?? 0 }}"/>

        <div class="field">
            <p class="control has-icons-left">
                <input type="datetime-local" class="input" name="date_from_local" step="1">
                <span class="icon">
                    <include href="images/icons/calendar.svg" />
                </span>
            </p>
        </div>

        <div class="field">
            <p class="control has-icons-left">
                <input type="datetime-local" class="input" name="date_to_local" step="1">
                <span class="icon">
                    <include href="images/icons/calendar.svg" />
                </span>
            </p>
        </div>
    </check>
</nav>
