feat: Add primary tabs for the three different modes

This commit is contained in:
2025-04-13 17:13:09 +02:00
parent 7e473955d9
commit ee0ba6acf8
5 changed files with 120 additions and 2 deletions

View File

@@ -21,7 +21,44 @@
<div class="content">
<h1 data-i18n-key="app-name" class="title is-1">Käfigrechner</h1>
<div class="container-form">
<div class="tabs is-centered is-boxed is-toggle" id="primary-tabs">
<ul>
<li class="is-active" data-tab-id="1">
<a>
<span class="icon is-small">
<i class="fas fa-number" aria-hidden="true"></i>
</span>
How many rats does this cage fit?
</a>
</li>
<li data-tab-id="2">
<a>
<span class="icon is-small">
<i class="fas fa-question" aria-hidden="true"></i>
</span>
What cage should I get?
</a>
</li>
<li data-tab-id="3">
<a>
<span class="icon is-small">
<i class="fas fa-check" aria-hidden="true"></i>
</span>
Check existing cage
</a>
</li>
</ul>
</div>
</div>
<div id="tab-content">
<div class="" data-content-id="1">
<p>Here you can check how many rats could fit in your cage.</p>
</div>
<div class="" data-content-id="2">
<p>Here is a list of cages you can get.</p>
</div>
<div class="is-active" data-content-id="3">
<div class="card" id="container-cages">
<div class="card-content" id="card-ManualMeasurements">
<h2 class="title is-4"><label data-i18n-key="cage-measurements"
@@ -41,7 +78,8 @@
<div class="columns">
<div class="column">
<label for="numFullFloors" class="label" data-i18n-key="full-floors">Vollebenen</label>
<label for="numFullFloors" class="label"
data-i18n-key="full-floors">Vollebenen</label>
<span data-tooltip="Als Vollebenen zählen alle Ebenen die größer als 0.5m² sind, inklusive des Käfigbodens.">
<svg class="text-grey-dark" width="18" height="18" viewBox="0 0 18 18" fill="none"
stroke="currentColor">