feat: Add primary tabs for the three different modes
This commit is contained in:
		@@ -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">
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user