Teenuste vaade
Templiit 20
Example
Markup
<div class="container-body-vp container">
<div class="horizontal-tab-container-vp w-100">
<nav>
<div class="nav nav-tabs nav-fill" id="nav-tab-horizontal" role="tablist">
<a class="nav-item nav-link active" id="nav-home-tab" data-toggle="tab" href="#nav-home" role="tab"
aria-controls="nav-home" aria-selected="true">Sündmuse ülevaade</a>
<a class="nav-item nav-link" id="nav-events-tab" data-toggle="tab" href="#nav-events" role="tab"
aria-controls="nav-events" aria-selected="false">Päevakava</a>
<a class="nav-item nav-link" id="nav-register-tab" data-toggle="tab" href="#nav-register" role="tab"
aria-controls="nav-register" aria-selected="false">Registreerimine</a>
<a class="nav-item nav-link" id="nav-materials-tab" data-toggle="tab" href="#nav-materials" role="tab"
aria-controls="nav-materials" aria-selected="false">Materjalid</a>
<a class="nav-item nav-link" id="nav-feedback-tab" data-toggle="tab" href="#nav-feedback" role="tab"
aria-controls="nav-feedback" aria-selected="false">Tagasiside</a>
</div>
</nav>
<div id="content-horizontal" class="tab-content" role="tablist">
<div id="nav-home" class="card tab-pane fade show active" role="tabpanel" aria-labelledby="nav-home-tab">
<div class="card-header" role="tab" id="heading-4">
<h5 class="mb-0">
<a class="collapsed btn-link" data-toggle="collapse" href="#collapse-4" aria-expanded="false"
aria-controls="collapse-4">
Sündmuse ülevaade
</a>
</h5>
</div>
<div id="collapse-4" class="collapse" role="tabpanel" data-parent="#content-horizontal"
aria-labelledby="heading-4">
<div class="card-body">
<div class="row row-large-gutters-vp">
<div class="col-lg-6 col-xl-8 mb-3">
<h3>Mehitamata õhusõidukid</h3>
<div class="row no-gutters flex-row no-hover">
<div class="col-xl-6 pr-3 mb-2">
<img src="/static/images/card_bg.jpg" alt="" class="w-100">
</div>
<div class="card-body col-xl-6 py-0">
<p class="card-text">
Mehitamata õhusõiduk on õhusõiduk, mille pardal ei ole pilooti ning mille juhtimine toimub
tehniliste abivahendite
vahendusel või eelnevalt programmeeritud lennuna ilma piloodi juhtimiseta autonoomselt.
</p>
<div class="list-group list-group-vp">
<a href="#" class="list-group-item list-group-item-action">Kasutustingimused</a>
<a href="#" class="list-group-item list-group-item-action">Privaatsussätted</a>
</div>
</div>
</div> </div>
<div class="col-lg-6 col-xl-4 mb-3">
<h3>Kontakt</h3>
<p class="font-weight-bold text-secondary mb-2">
Olga Petrjaševa
</p>
<ul class="list-unstyled list-vp text-secondary">
<li class="mb-1">
<svg class="c-icon ">
<use href="/spritemap.svg#sprite-icon_phone"></use>
</svg> <a href="#" class="text-dark font-weight-normal">+372 735 0222</a>
</li>
<li>
<svg class="c-icon ">
<use href="/spritemap.svg#sprite-icon_email"></use>
</svg> <a href="#" class="text-dark font-weight-normal">hm@hm.ee</a>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div id="nav-events" class="card tab-pane" role="tabpanel" aria-labelledby="nav-events-tab">
<div class="card-header" role="tab" id="heading-5">
<h5 class="mb-0">
<a class="collapsed btn-link" data-toggle="collapse" href="#collapse-5" aria-expanded="false"
aria-controls="collapse-5">
Päevakava
</a>
</h5>
</div>
<div id="collapse-5" class="collapse" role="tabpanel" data-parent="#content-horizontal"
aria-labelledby="heading-5">
<div class="card-body">
[ ... ]
</div>
</div>
</div>
<div id="nav-register" class="card tab-pane fade" role="tabpanel" aria-labelledby="nav-register-tab">
<div class="card-header" role="tab" id="heading-3">
<h5 class="mb-0">
<a class="collapsed btn-link" data-toggle="collapse" href="#collapse-6" aria-expanded="false"
aria-controls="collapse-3">
Registreerimine
</a>
</h5>
</div>
<div id="collapse-3" class="collapse" role="tabpanel" data-parent="#content-horizontal"
aria-labelledby="heading-3">
<div class="card-body">
<div class="card-body">
[ ... ]
</div>
</div>
</div>
<div id="nav-materials" class="card tab-pane" role="tabpanel" aria-labelledby="nav-materials-tab">
<div class="card-header" role="tab" id="heading-5">
<h5 class="mb-0">
<a class="collapsed btn-link" data-toggle="collapse" href="#collapse-5" aria-expanded="false"
aria-controls="collapse-5">
Materjalid
</a>
</h5>
</div>
<div id="collapse-5" class="collapse" role="tabpanel" data-parent="#content-horizontal"
aria-labelledby="heading-5">
<div class="card-body">
[ ... ]
</div>
</div>
</div>
<div id="nav-profile" class="card tab-pane" role="tabpanel" aria-labelledby="nav-profile-tab">
<div class="card-header" role="tab" id="heading-5">
<h5 class="mb-0">
<a class="collapsed btn-link" data-toggle="collapse" href="#collapse-5" aria-expanded="false"
aria-controls="collapse-5">
Õppekulude hüvitamine
</a>
</h5>
</div>
<div id="collapse-5" class="collapse" role="tabpanel" data-parent="#content-horizontal"
aria-labelledby="heading-5">
<div class="card-body">
[ ... ]
</div>
</div>
</div>
</div>
</div>
</div>
</div>