132 lines
3.4 KiB
Plaintext
132 lines
3.4 KiB
Plaintext
---
|
|
|
|
import Layout from "#layouts/Layout.astro";
|
|
|
|
---
|
|
|
|
<Layout title="Welcher Energieausweis">
|
|
|
|
<h1 class="text-3xl">Welcher Energieausweis?</h1>
|
|
|
|
<div class="mt-12 m-auto w-[90%] relative">
|
|
|
|
<div id="OEA_widget">
|
|
<input id="recode" type="hidden" value="widgetvorlage">
|
|
|
|
<div id="OEA_input">
|
|
|
|
<div class="OEA_zeile1">
|
|
<div class="OEA_item1">
|
|
<div class="OEA_title1">Gebäudetyp</div>
|
|
<select class="OEA_auswahl1" id="OEA_changeTyp">
|
|
<option value="" selected disabled>bitte auswählen</option>
|
|
<option value="Einfamilienhaus">Einfamilienhaus</option>
|
|
<option value="Zweifamilienhaus">Zweifamilienhaus</option>
|
|
<option value="Mehrfamilienhaus">Mehrfamilienhaus</option>
|
|
<option value="Gewerbegebäude">Gewerbegebäude</option>
|
|
<option value="Mischgebäude">Mischgebäude</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="OEA_item2">
|
|
<div class="OEA_title1">Anlass</div>
|
|
<select class="OEA_auswahl1" id="OEA_changeAnlass">
|
|
<option value="" selected disabled>bitte auswählen</option>
|
|
<option value="Vermietung/Verkauf">Vermietung/Verkauf</option>
|
|
<option value="Modernisierung">Modernisierung</option>
|
|
<option value="Neubau">Neubau</option>
|
|
<option value="Erweiterung">Erweiterung</option>
|
|
<option value="Aushangpflicht">Aushangpflicht</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
|
|
<div class="OEA_zeile2">
|
|
<div class="OEA_item3">
|
|
<div class="OEA_title2">Baujahr</div>
|
|
<select class="OEA_auswahl2" id="changeBaujahr">
|
|
<option value="" selected disabled>bitte auswählen</option>
|
|
<option value="1">vor 1978</option>
|
|
<option value="0">nach 1977</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="OEA_item4">
|
|
<div class="OEA_title2">Wohneinheiten</div>
|
|
<select class="OEA_auswahl2" id="changeEinheiten">
|
|
<option value="" selected disabled>bitte auswählen</option>
|
|
<option value="1">bis 4 Wohneinheiten</option>
|
|
<option value="0">mehr als 4 Wohneinheiten</option>
|
|
</select>
|
|
</div>
|
|
|
|
<div class="OEA_item5">
|
|
<div class="OEA_title2">Sanierungsstatus</div>
|
|
<select class="OEA_auswahl2" id="changeStatus">
|
|
<option value="" selected disabled>bitte auswählen</option>
|
|
<option value="0">saniert</option>
|
|
<option value="1">unsaniert</option>
|
|
</select>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="OEA_item6 result">
|
|
<div id="OEA_result">
|
|
<p id="OEA_result_text"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
|
|
<style lang="scss">
|
|
|
|
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
#OEA_widget {
|
|
@apply bg-light-grey p-4 rounded-xl shadow-xl;
|
|
|
|
#OEA_input { @apply space-y-2;
|
|
|
|
|
|
.OEA_zeile1, .OEA_zeile2 {
|
|
@apply flex flex-row space-x-2;
|
|
|
|
.OEA_item1, .OEA_item2, .OEA_item3, .OEA_item4, .OEA_item5 {
|
|
@apply w-full;
|
|
|
|
.OEA_title1, .OEA_title2 {
|
|
@apply font-bold text-lg text-white p-2 rounded w-full;
|
|
}
|
|
}
|
|
}
|
|
|
|
.OEA_title1 {
|
|
@apply bg-secondary;
|
|
}
|
|
|
|
.OEA_title2 {
|
|
@apply bg-primary;
|
|
}
|
|
|
|
.OEA_auswahl1, .OEA_auswahl2 {
|
|
@apply w-full p-2 rounded focus:outline-none focus:ring-2 focus:ring-blue-500;
|
|
}
|
|
|
|
#OEA_result {
|
|
@apply rounded-lg text-gray-700;
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
.empfehlungen a {
|
|
@apply text-blue-600 underline hover:text-blue-800 font-semibold;
|
|
}
|
|
|
|
</style>
|