Merge branch 'main' into renovate/all-minor-patch

renovate.json

@@ -22,10 +22,6 @@
       "matchPackagePatterns": ["eslint", "prettier", "ruff", "pretty_assertions", "pre-commit", "mypy", "sourcery", "@types/.*", "types-.*"],
       "groupName": "linting",
       "automerge": true
-    },
-    {
-      "matchPackagePatterns": ["image", "imageproc"],
-      "groupName": "image-workaround"
     }
   ]
 }

requirements-dev.txt

@@ -1,5 +1,5 @@
 mypy~=1.9.0
-pre-commit~=3.6.0
+pre-commit~=3.7.0
 ruff~=0.3.1
 types-Pillow~=10.2.0.20240111
 types-PyYAML~=6.0.12.10

webclient/components/AppFooter.vue

@@ -37,7 +37,7 @@ const navigation = computed(() => [
 </script>
 
 <template>
-  <footer data-cy="main-footer" class="bg-zinc-100 mt-10">
+  <footer data-cy="main-footer" class="bg-zinc-100 mt-10 print:!hidden">
     <div class="mx-auto max-w-7xl overflow-hidden px-6 py-20 sm:py-14 lg:px-8">
       <nav class="-mb-6 columns-2 text-center sm:columns-3 sm:justify-center sm:space-x-12 md:flex" aria-label="Footer">
         <div v-for="item in navigation" :key="item.name" class="pb-6 text-sm leading-6">

webclient/components/AppNavHeader.vue

@@ -6,13 +6,13 @@ import PreferencesPopup from "../components/PreferencesPopup.vue";
   <header class="bg-zinc-50 fixed top-0 z-20 w-full shadow-md shadow-black/5 dark:bg-zinc-100 dark:shadow-black/20">
     <nav class="mx-auto max-w-4xl">
       <div class="mx-5 my-2.5 flex place-content-between content-between justify-between gap-x-10 lg:mx-10">
-        <RouterLink class="my-auto hidden lg:block" to="/">
+        <RouterLink class="my-auto hidden lg:block print:!block" to="/">
           <img alt="Navigatum Logo" class="pt-2" width="201" height="32" src="../assets/logos/navigatum.svg" />
         </RouterLink>
-        <div class="my-auto max-w-lg flex-grow lg:col-span-3">
+        <div class="my-auto max-w-lg flex-grow lg:col-span-3 print:!hidden">
           <slot />
         </div>
-        <div class="relative my-auto flex-shrink-0 xl:absolute xl:right-5 xl:top-3">
+        <div class="relative my-auto flex-shrink-0 xl:absolute xl:right-5 xl:top-3 print:!hidden">
           <PreferencesPopup />
         </div>
       </div>

webclient/components/DetailsBuildingOverviewSection.vue

@@ -16,7 +16,7 @@ const appURL = import.meta.env.VITE_APP_URL;
 </script>
 
 <template>
-  <section v-if="props.buildings">
+  <section v-if="props.buildings" class="print:!hidden">
     <h2 class="text-zinc-800 pb-3 text-lg font-semibold">{{ t("title") }}</h2>
     <!--  <a class="no-underline" href="#">Übersichtskarte <ArrowRightIcon class="w-4 h-4" /> -->
     <div class="text-zinc-600 grid grid-cols-1 gap-3 md:grid-cols-2 xl:grid-cols-3">

webclient/components/DetailsInteractiveMap.vue

@@ -101,6 +101,11 @@ function initMap(containerId: string) {
     // slower, but prettier and therefore worth it for our use case
     antialias: true,
 
+    // without this true, printing the webpage is not possible
+    // with this true the performance is halfed though...
+    // => we are deliberetely not supporing printing of this part of the webpage
+    preserveDrawingBuffer: false,
+
     // preview of the following style is available at
     // https://nav.tum.de/maps/
     style: `${import.meta.env.VITE_APP_URL}/maps/styles/osm-liberty/style.json`,
@@ -259,7 +264,7 @@ function setOverlayImage(imgUrl: string | null, coords: Coordinates | undefined)
 <template>
   <div
     id="interactive-map-container"
-    class="mb-2.5 aspect-4/3"
+    class="mb-2.5 aspect-4/3 print:!hidden"
     :class="{ hidden: state.map.selected !== MapSelections.interactive, errormessage: !webglSupport }"
   >
     <div>
@@ -335,22 +340,24 @@ function setOverlayImage(imgUrl: string | null, coords: Coordinates | undefined)
   padding: 0;
 
   &.marker-pin {
-    background-image: url(@/assets/map/marker_pin.webp);
+    background-image: url(/assets/map/marker_pin.webp);
     width: 25px;
     height: 36px;
     top: -33px;
     left: -12px;
   }
 
   &.marker-shadow {
-    background-image: url(@/assets/map/marker_pin-shadow.webp);
+    background-image: url(/assets/map/marker_pin-shadow.webp);
     width: 38px;
     height: 24px;
     top: -20px;
     left: -12px;
   }
 }
-
+.maplibregl-control-container {
+  @apply print:!hidden;
+}
 .maplibregl-ctrl-group.floor-ctrl {
   max-width: 100%;
   display: none;

webclient/components/DetailsPropertyTable.vue

@@ -23,7 +23,11 @@ const { t } = useI18n({ useScope: "local" });
     <div>
       <ul v-if="state.data?.props.links" class="flex flex-col gap-1.5">
         <li v-for="link in state.data.props.links" :key="link.text">
-          <Btn size="text-md gap-2.5 px-3 py-1.5 rounded leading-snug" variant="secondary" :to="link.url">
+          <Btn
+            size="text-md gap-2.5 px-3 py-1.5 rounded leading-snug print:!text-tumBlue-500"
+            variant="secondary"
+            :to="link.url"
+          >
             <ArrowTopRightOnSquareIcon class="my-auto h-5 min-h-5 w-5 min-w-5 pb-0.5" /> {{ link.text }}
           </Btn>
         </li>

webclient/components/DetailsRoomOverviewSection.vue

@@ -48,7 +48,7 @@ const { list, containerProps, wrapperProps } = useVirtualList<ChildEntry>(filter
 <template>
   <div
     v-if="props.rooms?.usages"
-    class="bg-white border-zinc-300 flex flex-col gap-3 rounded border p-4 dark:bg-zinc-100"
+    class="bg-white border-zinc-300 flex flex-col gap-3 rounded border p-4 dark:bg-zinc-100 print:!hidden"
   >
     <p class="text-zinc-800 text-lg font-semibold">{{ t("title") }}</p>
     <div class="flex flex-col gap-2">

webclient/components/RoomfinderImageLocation.vue

@@ -98,7 +98,7 @@ onMounted(draw);
 
 <template>
   <div
-    class="mx-auto"
+    class="mx-auto print:!max-w-40"
     :class="{
       'max-w-sm': map.height > map.width,
       'max-w-2xl': map.height <= map.width,

webclient/package.json

@@ -26,27 +26,27 @@
     "vue3-carousel": "0.3.1"
   },
   "devDependencies": {
-    "@intlify/unplugin-vue-i18n": "3.0.1",
+    "@intlify/unplugin-vue-i18n": "4.0.0",
     "@rushstack/eslint-patch": "1.8.0",
     "@types/node": "^20.11.27",
     "@types/swagger-ui": "^3.52.4",
     "@vitejs/plugin-vue": "5.0.4",
     "@vue/eslint-config-prettier": "9.0.0",
     "@vue/eslint-config-typescript": "13.0.0",
     "@vue/tsconfig": "0.5.1",
-    "autoprefixer": "10.4.18",
+    "autoprefixer": "10.4.19",
     "eslint": "8.57.0",
-    "eslint-plugin-vue": "9.23.0",
+    "eslint-plugin-vue": "9.24.0",
     "isomorphic-fetch": "3.0.0",
     "npm-run-all2": "6.1.2",
-    "postcss": "8.4.37",
+    "postcss": "8.4.38",
     "prettier": "3.2.5",
     "prettier-plugin-tailwindcss": "0.5.12",
     "sass": "1.72.0",
     "stylelint-scss": "6.2.1",
     "tailwindcss": "3.4.1",
-    "typescript": "5.4.2",
-    "vite": "5.2.2",
+    "typescript": "5.4.3",
+    "vite": "5.2.3",
     "vite-plugin-vue-devtools": "7.0.20",
     "vue-i18n": "9.10.2",
     "vue-tsc": "2.0.7"

webclient/pages/view/[id].vue

@@ -114,7 +114,7 @@ onMounted(() => {
     <button
       v-if="state.image.shown_image"
       type="button"
-      class="focusable !-mx-5 block lg:hidden"
+      class="focusable !-mx-5 block lg:hidden print:!hidden"
       @click="state.showImageSlideshow(true)"
     >
       <img :alt="t('image_alt')" :src="`${appURL}/cdn/header/${state.image.shown_image.name}`" class="block w-full" />
@@ -184,7 +184,7 @@ onMounted(() => {
             <DetailsRoomfinderMap ref="roomfinderMap" />
           </TabPanel>
         </TabPanels>
-        <TabList class="bg-zinc-100 flex space-x-1 rounded-md p-1">
+        <TabList class="bg-zinc-100 flex space-x-1 rounded-md p-1 print:!hidden">
           <Tab v-slot="{ selected }" as="template" @click="interactiveMap?.loadInteractiveMap(true)">
             <button
               type="button"