<div v-if="ready" class="stop__details" v-responsive>
    <section>
        <strong>Linie:</strong>
        <ul class="stop__lines list-unstyled list-inline">
            <li v-for="line in lines" class="list-inline-item mb-2">
                <line-symbol :line="line"></line-symbol>
            </li>
        </ul>

        <strong>Trasy:</strong>
        <ul class="stop__tracks list-underlined">
            <li v-for="{ track, order } in tracks" class="track">
                <div class="track__line">
                    <line-symbol :line="track.line"></line-symbol>
                </div>
                <div class="track__description">
                    {{ track.description }}
                </div>
                <span class="badge badge-pill badge-light track__order">
                    #{{ order }}
                </span>
            </li>
        </ul>
    </section>
</div>
<div v-else class="text-center">
    <ui-icon icon="spinner"/>
</div>
