Save Button -> Top Right

public/js/components/Stv/Studentenverwaltung/Details.js

@@ -24,7 +24,7 @@ export default {
 		}
 	},
 	template: `
-	<div class="stv-details h-100 pb-3">
+	<div class="stv-details h-100 pb-3 d-flex flex-column">
 		<div v-if="hasNoStudent" class="justify-content-center d-flex h-100 align-items-center">Bitte StudentIn auswählen!</div>
 		<template v-else>		
 			<ul class="nav nav-tabs">
@@ -32,9 +32,11 @@ export default {
 					<a class="nav-link" :class="{active: comp == component}" :aria-current="comp == component ? 'page' : ''" href="#" @click="component=comp">{{title}}</a>
 				</li>
 			</ul>
-			<keep-alive>
-				<component :is="component" :student="student"></component>
-			</keep-alive>
+			<div style="flex: 1 1 0%; height: 0%" class="border-bottom border-start border-end overflow-auto p-3">
+				<keep-alive>
+					<component :is="component" :student="student"></component>
+				</keep-alive>
+			</div>
 		</template>
 	</div>`
 };

public/js/components/Stv/Studentenverwaltung/Details/Details.js

@@ -191,7 +191,10 @@ export default {
 	},
 	//TODO(chris): Geburtszeit? Anzahl der Kinder?
 	template: `
-	<div ref="form" class="stv-details-details h-100 pb-3">
+	<div ref="form" class="stv-details-details">
+		<div class="position-sticky top-0">
+			<button type="button" class="btn btn-primary position-absolute top-0 end-0" @click="save" :disabled="!changedLength">Speichern</button>
+		</div>
 		<fieldset class="overflow-hidden">
 			<legend>Person</legend>
 			<template v-if="data">
@@ -371,9 +374,6 @@ export default {
 				Loading...
 			</div>
 		</fieldset>
-		<div>
-			<button type="button" class="btn btn-primary" @click="save" :disabled="!changedLength">Speichern</button>
-		</div>
 		<pv-toast ref="responseToast" style="z-index:9999"></pv-toast>
 	</div>`
 };