From 9890f6aade4a6d3c7dadf068653362ef82a2baba Mon Sep 17 00:00:00 2001
From: adisposkofh <ma1434@technikum-wien.at>
Date: Mon, 20 Apr 2026 16:58:43 +0200
Subject: [PATCH 1/4] fixed issue: context menu appearing on vue datepicker
 single click in mobile

---
 public/js/apps/Cis.js                         | 12 +++++
 public/js/apps/Dashboard/Fhc.js               |  9 +---
 .../js/components/Cis/Raumsuche/Raumsuche.js  | 50 ++++++++++---------
 3 files changed, 39 insertions(+), 32 deletions(-)

diff --git a/public/js/apps/Cis.js b/public/js/apps/Cis.js
index c88a47a35..39fde01a2 100644
--- a/public/js/apps/Cis.js
+++ b/public/js/apps/Cis.js
@@ -136,6 +136,18 @@ const app = Vue.createApp({
             }
         };
     },
+	computed: {
+		isMobile() {
+			const smallScreen = window.matchMedia("(max-width: 767px)").matches;
+			const touchCapable = ("ontouchstart" in window) || navigator.maxTouchPoints > 0;
+			return smallScreen;// && touchCapable;
+		},
+	},
+	provide() {
+		return {
+			isMobile: this.isMobile
+		}
+	},
     methods: {
         searchfunction: function(searchsettings) {
         	return this.$api.call(ApiSearchbar.searchCis(searchsettings));
diff --git a/public/js/apps/Dashboard/Fhc.js b/public/js/apps/Dashboard/Fhc.js
index 140c76402..c9c81cddb 100644
--- a/public/js/apps/Dashboard/Fhc.js
+++ b/public/js/apps/Dashboard/Fhc.js
@@ -233,18 +233,11 @@ const app = Vue.createApp({
 		renderers: null,
 	}),
 	components: {},
-	computed: {
-		isMobile() {
-			const smallScreen = window.matchMedia("(max-width: 767px)").matches;
-			const touchCapable = ("ontouchstart" in window) || navigator.maxTouchPoints > 0;
-			return smallScreen;// && touchCapable;
-		}	
-	},
+	inject: ["isMobile"],
 	provide() {
 		return { // provide injectable & watchable language property
 			language: Vue.computed(() => this.$p.user_language),
 			renderers: Vue.computed(() => this.renderers),
-			isMobile: this.isMobile
 		}	
 	},
 	methods: {
diff --git a/public/js/components/Cis/Raumsuche/Raumsuche.js b/public/js/components/Cis/Raumsuche/Raumsuche.js
index 365da4911..bb8bf1e85 100644
--- a/public/js/components/Cis/Raumsuche/Raumsuche.js
+++ b/public/js/components/Cis/Raumsuche/Raumsuche.js
@@ -3,14 +3,12 @@ import VueDatePicker from '../../vueDatepicker.js.php';
 import ApiOrt from '../../../api/factory/ort.js'
 export const Raumsuche =  {
 	name: "Raumsuche",
-	props: {
-		
-	},
 	components: {
 		VueDatePicker,
 		CoreFilterCmpt,
 		InputNumber: primevue.inputnumber,
 	},
+	inject: ["isMobile"],
 	data() {
 		return {
 			phrasenPromise: null,
@@ -73,6 +71,11 @@ export const Raumsuche =  {
 			}
 			]};
 	},
+	computed: {
+		isDarkMode(){
+			return this.$theme.theme_name.value == 'dark';
+		}
+	},
 	methods: {
 		tableResolve(resolve) {
 			this.tableBuiltResolve = resolve
@@ -178,11 +181,6 @@ export const Raumsuche =  {
 			
 		}
 	},
-	computed: {
-		isDarkMode(){
-			return this.$theme.theme_name.value == 'dark';
-		}
-	},
 	created() {
 		this.phrasenPromise = this.$p.loadCategory(['rauminfo', 'global'])
 		this.phrasenPromise.then(()=> {this.phrasenResolved = true})
@@ -196,39 +194,43 @@ export const Raumsuche =  {
 	<div class="row">
 		<div class="col-12 col-lg-2">
 			<VueDatePicker
-				:dark="isDarkMode"
+				@contextmenu="(e) => {if (isMobile) {e.preventDefault();}}"
 				v-model="datum"
+				:dark="isDarkMode"
 				:clearable="false"
-				date-picker
 				:enable-time-picker="false"
 				:format="dateFormat"
 				:text-input="datepickerTextInputOptions"
 				:min-date="new Date()"
-				auto-apply>
-			</VueDatePicker>
-		</div>
-		<div class="col-12 col-lg-1">
-			<VueDatePicker
-				:dark="isDarkMode"
-				v-model="von"
-				:clearable="false"
-				time-picker
-				:format="timeFormat"
-				:text-input="timepickerTextInputOptions"
-				:is-24="true"
+				date-picker
 				auto-apply
 				>
 			</VueDatePicker>
 		</div>
 		<div class="col-12 col-lg-1">
 			<VueDatePicker
+				@contextmenu="(e) => {if (isMobile) {e.preventDefault();}}"
+				v-model="von"
 				:dark="isDarkMode"
-				v-model="bis"
 				:clearable="false"
-				time-picker
 				:format="timeFormat"
 				:text-input="timepickerTextInputOptions"
 				:is-24="true"
+				time-picker
+				auto-apply
+				>
+			</VueDatePicker>
+		</div>
+		<div class="col-12 col-lg-1">
+			<VueDatePicker
+				@contextmenu="(e) => {if (isMobile) {e.preventDefault();}}"
+				v-model="bis"
+				:dark="isDarkMode"
+				:clearable="false"
+				:format="timeFormat"
+				:text-input="timepickerTextInputOptions"
+				:is-24="true"
+				time-picker
 				auto-apply>
 			</VueDatePicker>
 		</div>

From 6792002c198e5c87e82d6d2fb837e97e61ea27e2 Mon Sep 17 00:00:00 2001
From: adisposkofh <ma1434@technikum-wien.at>
Date: Mon, 20 Apr 2026 17:03:05 +0200
Subject: [PATCH 2/4] added spacing between room search inputs, mostly visible
 in mobile

---
 public/js/components/Cis/Raumsuche/Raumsuche.js | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/public/js/components/Cis/Raumsuche/Raumsuche.js b/public/js/components/Cis/Raumsuche/Raumsuche.js
index bb8bf1e85..09809e39e 100644
--- a/public/js/components/Cis/Raumsuche/Raumsuche.js
+++ b/public/js/components/Cis/Raumsuche/Raumsuche.js
@@ -192,7 +192,7 @@ export const Raumsuche =  {
 	<h1 class="h3">{{$p.t('rauminfo/roomSearch')}}</h1>
 	<hr>
 	<div class="row">
-		<div class="col-12 col-lg-2">
+		<div class="col-12 col-lg-2 pb-2">
 			<VueDatePicker
 				@contextmenu="(e) => {if (isMobile) {e.preventDefault();}}"
 				v-model="datum"
@@ -207,7 +207,7 @@ export const Raumsuche =  {
 				>
 			</VueDatePicker>
 		</div>
-		<div class="col-12 col-lg-1">
+		<div class="col-12 col-lg-1 pb-2">
 			<VueDatePicker
 				@contextmenu="(e) => {if (isMobile) {e.preventDefault();}}"
 				v-model="von"
@@ -221,7 +221,7 @@ export const Raumsuche =  {
 				>
 			</VueDatePicker>
 		</div>
-		<div class="col-12 col-lg-1">
+		<div class="col-12 col-lg-1 pb-2">
 			<VueDatePicker
 				@contextmenu="(e) => {if (isMobile) {e.preventDefault();}}"
 				v-model="bis"
@@ -235,7 +235,7 @@ export const Raumsuche =  {
 			</VueDatePicker>
 		</div>
 		
-		<div class="col-12 col-lg-3">
+		<div class="col-12 col-lg-3 pb-2">
 			<select ref="raumtyp" id="raumtypSelect" v-model="selectedType" class="form-select" 
 			:aria-label="$p.t('global/studiensemester_auswaehlen')" @change="setRoute($event.target.value)">
 				<option :key="defaultType" selected :value="defaultType">{{defaultType.beschreibung}}</option>
@@ -244,14 +244,14 @@ export const Raumsuche =  {
 		</div>
 		
 
-		<div class="col-12 col-lg-3">
+		<div class="col-12 col-lg-3 pb-2">
 			<InputNumber v-model="anzahl" 
 			:prefix="$p.t('rauminfo/minCapacity') + ': '" 
 			inputId="anzahlInput" :min="1" :max="1000" 
 			:style="{'width': '100%'}"
 			/>
 		</div>
-		<div class="col-12 col-lg-2">
+		<div class="col-12 col-lg-2 pb-2">
 			<button class="btn btn-primary border-0" @click="search">{{ $p.t('rauminfo/roomSearch') }} <i class="fa fa-magnifying-glass"></i></button>
 		</div>
 	</div>

From e5015f348bd07477d7112ebd2529a4cb170a7bc0 Mon Sep 17 00:00:00 2001
From: adisposkofh <ma1434@technikum-wien.at>
Date: Mon, 20 Apr 2026 17:07:49 +0200
Subject: [PATCH 3/4] reworked roomsearch inputs spacing

---
 public/js/components/Cis/Raumsuche/Raumsuche.js | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/public/js/components/Cis/Raumsuche/Raumsuche.js b/public/js/components/Cis/Raumsuche/Raumsuche.js
index 09809e39e..4790272a6 100644
--- a/public/js/components/Cis/Raumsuche/Raumsuche.js
+++ b/public/js/components/Cis/Raumsuche/Raumsuche.js
@@ -192,7 +192,7 @@ export const Raumsuche =  {
 	<h1 class="h3">{{$p.t('rauminfo/roomSearch')}}</h1>
 	<hr>
 	<div class="row">
-		<div class="col-12 col-lg-2 pb-2">
+		<div :class="{'pb-1': isMobile}" class="col-12 col-lg-2">
 			<VueDatePicker
 				@contextmenu="(e) => {if (isMobile) {e.preventDefault();}}"
 				v-model="datum"
@@ -207,7 +207,7 @@ export const Raumsuche =  {
 				>
 			</VueDatePicker>
 		</div>
-		<div class="col-12 col-lg-1 pb-2">
+		<div :class="{'pb-1': isMobile}" class="col-12 col-lg-1">
 			<VueDatePicker
 				@contextmenu="(e) => {if (isMobile) {e.preventDefault();}}"
 				v-model="von"
@@ -221,7 +221,7 @@ export const Raumsuche =  {
 				>
 			</VueDatePicker>
 		</div>
-		<div class="col-12 col-lg-1 pb-2">
+		<div :class="{'pb-1': isMobile}" class="col-12 col-lg-1">
 			<VueDatePicker
 				@contextmenu="(e) => {if (isMobile) {e.preventDefault();}}"
 				v-model="bis"
@@ -235,7 +235,7 @@ export const Raumsuche =  {
 			</VueDatePicker>
 		</div>
 		
-		<div class="col-12 col-lg-3 pb-2">
+		<div :class="{'pb-1': isMobile}" class="col-12 col-lg-3">
 			<select ref="raumtyp" id="raumtypSelect" v-model="selectedType" class="form-select" 
 			:aria-label="$p.t('global/studiensemester_auswaehlen')" @change="setRoute($event.target.value)">
 				<option :key="defaultType" selected :value="defaultType">{{defaultType.beschreibung}}</option>
@@ -244,14 +244,14 @@ export const Raumsuche =  {
 		</div>
 		
 
-		<div class="col-12 col-lg-3 pb-2">
+		<div :class="{'pb-2': isMobile}" class="col-12 col-lg-3">
 			<InputNumber v-model="anzahl" 
 			:prefix="$p.t('rauminfo/minCapacity') + ': '" 
 			inputId="anzahlInput" :min="1" :max="1000" 
 			:style="{'width': '100%'}"
 			/>
 		</div>
-		<div class="col-12 col-lg-2 pb-2">
+		<div class="col-12 col-lg-2">
 			<button class="btn btn-primary border-0" @click="search">{{ $p.t('rauminfo/roomSearch') }} <i class="fa fa-magnifying-glass"></i></button>
 		</div>
 	</div>

From 956b2017576cc7cde388f67e7f51b174f93aa65e Mon Sep 17 00:00:00 2001
From: adisposkofh <ma1434@technikum-wien.at>
Date: Tue, 21 Apr 2026 11:25:48 +0200
Subject: [PATCH 4/4] minor fix

---
 public/js/apps/Dashboard/Fhc.js | 9 ++++++++-
 1 file changed, 8 insertions(+), 1 deletion(-)

diff --git a/public/js/apps/Dashboard/Fhc.js b/public/js/apps/Dashboard/Fhc.js
index c9c81cddb..9c55b5f17 100644
--- a/public/js/apps/Dashboard/Fhc.js
+++ b/public/js/apps/Dashboard/Fhc.js
@@ -233,11 +233,18 @@ const app = Vue.createApp({
 		renderers: null,
 	}),
 	components: {},
-	inject: ["isMobile"],
+	computed: {
+		isMobile() {
+			const smallScreen = window.matchMedia("(max-width: 767px)").matches;
+			const touchCapable = ("ontouchstart" in window) || navigator.maxTouchPoints > 0;
+			return smallScreen;// && touchCapable;
+		},
+	},
 	provide() {
 		return { // provide injectable & watchable language property
 			language: Vue.computed(() => this.$p.user_language),
 			renderers: Vue.computed(() => this.renderers),
+			isMobile: this.isMobile,
 		}	
 	},
 	methods: {