<div class="stop"> <span class="stop__name">{{ stop.name }}</span> <span class="stop__description badge badge-dark" v-if="stop.variant">{{ stop.variant }}</span> <slot/> <div class="stop__actions flex-space-left"> <slot name="actions"> <button class="btn btn-action" ref="action-info" @click="details = !details"> <fa :icon="['fal', details ? 'chevron-circle-up' : 'info-circle']"/> </button> <button class="btn btn-action" ref="action-map"> <fa :icon="['fal', 'map-marked-alt']"/> </button> </slot> </div> <fold :visible="details" class="stop__details" lazy> <stop-details :stop="stop"></stop-details> </fold> </div>