feat:#5 added datetime input for search and fixed nav bar

frontend/src/view/FreeRooms.vue

@@ -0,0 +1,35 @@
+<script setup lang="ts">
+import { Ref, ref } from "vue";
+import DynamicPage from "@/view/DynamicPage.vue";
+
+const selected: Ref<{ name: string }> = ref({ name: "" });
+
+const dates = ref();
+</script>
+
+<template>
+  <DynamicPage
+    :hide-content="selected.name === ''"
+    :headline="$t('freeRooms.freeRooms')"
+    :sub-title="$t('freeRooms.detail')"
+    icon="pi pi-search"
+  >
+    <template #selection>
+      <Calendar
+        v-model="dates"
+        class="flex-1 m-0"
+        :placeholder="$t('roomFinderPage.dropDownSelect')"
+        :empty-message="$t('roomFinderPage.noRoomsAvailable')"
+        :auto-filter-focus="true"
+        selection-mode="range"
+        :manual-input="false"
+        :show-time="true"
+        :show-seconds="true"
+      />
+      <Button icon="pi pi-search" />
+    </template>
+    <template #content>
+      <Button>Button</Button>
+    </template>
+  </DynamicPage>
+</template>