From cdd7d14d4c7db425d1a68f26e89e577d4eb07964 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Matej=20Glasn=C3=A1k?= <matej.glasnak@blume.sk>
Date: Wed, 14 Jan 2026 02:11:44 +0100
Subject: [PATCH] fix(modals): update card height styles to include max-height
 for better responsiveness

---
 .../tm@modal/blocker/z-blocker-modal.vue      |  2 +-
 .../blocker/z-delete-blocker-modal.vue        |  4 +++-
 .../z-complete-master-task-modal.vue          |  4 +++-
 .../z-delete-master-task-modal.vue            |  4 +++-
 .../z-delete-team-member-modal.vue            |  4 +++-
 .../master-task/z-master-task-modal.vue       |  4 ++--
 .../tm@modal/task-cell/z-show-menu-modal.vue  |  4 +++-
 .../_components/a-task-spent-time.vue         |  4 +++-
 .../_components/a-task-timeblocks.vue         |  6 ++++--
 .../tm@modal/task/z-complete-task-modal.vue   |  4 +++-
 .../tm@modal/task/z-delete-task-modal.vue     |  4 +++-
 .../task/z-delete-timeblock-modal.vue         |  4 +++-
 .../tm@modal/task/z-remove-employee-modal.vue |  4 +++-
 .../task/z-remove-timeblock-modal.vue         |  4 +++-
 .../tm@modal/task/z-task-add-time-modal.vue   |  4 +++-
 .../plugins/tm@modal/task/z-task-modal.vue    |  4 ++--
 .../task/z-unable-to-complete-task-modal.vue  |  4 +++-
 .../z-unable-to-edit-office-task-modal.vue    |  4 +++-
 .../tm@modal/team/z-delete-team-modal.vue     |  4 +++-
 .../plugins/tm@modal/team/z-team-modal.vue    | 21 +++++++++++++++++--
 20 files changed, 73 insertions(+), 24 deletions(-)

diff --git a/app/src/plugins/tm@modal/blocker/z-blocker-modal.vue b/app/src/plugins/tm@modal/blocker/z-blocker-modal.vue
index 209bc51..b72592c 100644
--- a/app/src/plugins/tm@modal/blocker/z-blocker-modal.vue
+++ b/app/src/plugins/tm@modal/blocker/z-blocker-modal.vue
@@ -8,7 +8,7 @@
   >
     <W-loadable :content="blocker" class="h-100">
       <v-card
-        style="position: relative; height: 100%"
+        style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
         class="d-flex flex-column"
       >
         <div class="d-flex justify-space-between align-center modal-header">
diff --git a/app/src/plugins/tm@modal/blocker/z-delete-blocker-modal.vue b/app/src/plugins/tm@modal/blocker/z-delete-blocker-modal.vue
index f0b82c1..7926794 100644
--- a/app/src/plugins/tm@modal/blocker/z-delete-blocker-modal.vue
+++ b/app/src/plugins/tm@modal/blocker/z-delete-blocker-modal.vue
@@ -6,7 +6,9 @@
     persistent
     :retain-focus="false"
   >
-    <v-card style="position: relative; height: 100%">
+    <v-card
+      style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
+    >
       <div class="d-flex justify-space-between align-center">
         <h1>
           Ste si istý, že chcete zmazať <b>{{ blocker.name }}</b
diff --git a/app/src/plugins/tm@modal/master-task/z-complete-master-task-modal.vue b/app/src/plugins/tm@modal/master-task/z-complete-master-task-modal.vue
index c4ab61b..ec000c4 100644
--- a/app/src/plugins/tm@modal/master-task/z-complete-master-task-modal.vue
+++ b/app/src/plugins/tm@modal/master-task/z-complete-master-task-modal.vue
@@ -6,7 +6,9 @@
     persistent
     :retain-focus="false"
   >
-    <v-card style="position: relative; height: 100%">
+    <v-card
+      style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
+    >
       <div class="d-flex justify-space-between align-center">
         <h1>
           Ste si istý, že chcete
diff --git a/app/src/plugins/tm@modal/master-task/z-delete-master-task-modal.vue b/app/src/plugins/tm@modal/master-task/z-delete-master-task-modal.vue
index 262118e..557e44f 100644
--- a/app/src/plugins/tm@modal/master-task/z-delete-master-task-modal.vue
+++ b/app/src/plugins/tm@modal/master-task/z-delete-master-task-modal.vue
@@ -6,7 +6,9 @@
     persistent
     :retain-focus="false"
   >
-    <v-card style="position: relative; height: 100%">
+    <v-card
+      style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
+    >
       <div class="d-flex justify-space-between align-center">
         <h1>
           Ste si istý, že chcete zmazať <b>{{ mastertask.name }}</b
diff --git a/app/src/plugins/tm@modal/master-task/z-delete-team-member-modal.vue b/app/src/plugins/tm@modal/master-task/z-delete-team-member-modal.vue
index 67299a7..0c33a5b 100644
--- a/app/src/plugins/tm@modal/master-task/z-delete-team-member-modal.vue
+++ b/app/src/plugins/tm@modal/master-task/z-delete-team-member-modal.vue
@@ -6,7 +6,9 @@
     persistent
     :retain-focus="false"
   >
-    <v-card style="position: relative; height: 100%">
+    <v-card
+      style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
+    >
       <div class="d-flex justify-space-between align-center">
         <h1 class="text-h5">Chcete túto osobu odstrániť z tímu?</h1>
         <div class="d-flex align-start">
diff --git a/app/src/plugins/tm@modal/master-task/z-master-task-modal.vue b/app/src/plugins/tm@modal/master-task/z-master-task-modal.vue
index dd29aab..a26f9ab 100644
--- a/app/src/plugins/tm@modal/master-task/z-master-task-modal.vue
+++ b/app/src/plugins/tm@modal/master-task/z-master-task-modal.vue
@@ -9,7 +9,7 @@
     <W-loadable :content="mastertask" class="h-100">
       <v-card
         v-if="editMode"
-        style="position: relative; height: 100%"
+        style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
         class="d-flex flex-column scrolling"
       >
         <div class="d-flex justify-space-between align-center modal-header">
@@ -248,7 +248,7 @@
 
       <v-card
         v-else
-        style="position: relative; height: 100%"
+        style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
         class="d-flex flex-column scrolling"
       >
         <div class="d-flex justify-space-between align-center">
diff --git a/app/src/plugins/tm@modal/task-cell/z-show-menu-modal.vue b/app/src/plugins/tm@modal/task-cell/z-show-menu-modal.vue
index 0d3e148..a7d0809 100644
--- a/app/src/plugins/tm@modal/task-cell/z-show-menu-modal.vue
+++ b/app/src/plugins/tm@modal/task-cell/z-show-menu-modal.vue
@@ -6,7 +6,9 @@
     persistent
     :retain-focus="false"
   >
-    <v-card style="position: relative; height: 100%">
+    <v-card
+      style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
+    >
       <div class="d-flex justify-space-between align-center">
         <h1>Vytvoriť</h1>
         <div class="d-flex align-start">
diff --git a/app/src/plugins/tm@modal/task/_components/_components/a-task-spent-time.vue b/app/src/plugins/tm@modal/task/_components/_components/a-task-spent-time.vue
index 49a2594..14eb41c 100644
--- a/app/src/plugins/tm@modal/task/_components/_components/a-task-spent-time.vue
+++ b/app/src/plugins/tm@modal/task/_components/_components/a-task-spent-time.vue
@@ -58,7 +58,9 @@
     persistent
     :retain-focus="false"
   >
-    <v-card style="position: relative; height: 100%">
+    <v-card
+      style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
+    >
       <div class="d-flex justify-space-between align-center">
         <h1>Pridať odpracovaný čas</h1>
 
diff --git a/app/src/plugins/tm@modal/task/_components/_components/a-task-timeblocks.vue b/app/src/plugins/tm@modal/task/_components/_components/a-task-timeblocks.vue
index 6571850..1c5962c 100644
--- a/app/src/plugins/tm@modal/task/_components/_components/a-task-timeblocks.vue
+++ b/app/src/plugins/tm@modal/task/_components/_components/a-task-timeblocks.vue
@@ -98,7 +98,7 @@
     :retain-focus="false"
   >
     <v-card
-      style="position: relative; height: 100%"
+      style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
       class="add-timeblock-modal"
     >
       <div class="d-flex justify-space-between align-center pa-4">
@@ -140,7 +140,9 @@
     persistent
     :retain-focus="false"
   >
-    <v-card style="position: relative; height: 100%">
+    <v-card
+      style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
+    >
       <div class="d-flex justify-space-between align-center">
         <h1 class="text-red">
           Ste si istý, že chcete pridať timeblock po deadline <br />
diff --git a/app/src/plugins/tm@modal/task/z-complete-task-modal.vue b/app/src/plugins/tm@modal/task/z-complete-task-modal.vue
index e9ac129..244f7b7 100644
--- a/app/src/plugins/tm@modal/task/z-complete-task-modal.vue
+++ b/app/src/plugins/tm@modal/task/z-complete-task-modal.vue
@@ -6,7 +6,9 @@
     persistent
     :retain-focus="false"
   >
-    <v-card style="position: relative; height: 100%">
+    <v-card
+      style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
+    >
       <div class="d-flex justify-space-between align-center">
         <h1>
           Ste si istý, že chcete
diff --git a/app/src/plugins/tm@modal/task/z-delete-task-modal.vue b/app/src/plugins/tm@modal/task/z-delete-task-modal.vue
index 639b15a..20e115b 100644
--- a/app/src/plugins/tm@modal/task/z-delete-task-modal.vue
+++ b/app/src/plugins/tm@modal/task/z-delete-task-modal.vue
@@ -6,7 +6,9 @@
     persistent
     :retain-focus="false"
   >
-    <v-card style="position: relative; height: 100%">
+    <v-card
+      style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
+    >
       <div class="d-flex justify-space-between align-center">
         <h1>
           Ste si istý, že chcete zmazať sub task z mastertasku
diff --git a/app/src/plugins/tm@modal/task/z-delete-timeblock-modal.vue b/app/src/plugins/tm@modal/task/z-delete-timeblock-modal.vue
index 0040045..972035e 100644
--- a/app/src/plugins/tm@modal/task/z-delete-timeblock-modal.vue
+++ b/app/src/plugins/tm@modal/task/z-delete-timeblock-modal.vue
@@ -6,7 +6,9 @@
     persistent
     :retain-focus="false"
   >
-    <v-card style="position: relative; height: 100%">
+    <v-card
+      style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
+    >
       <div class="d-flex justify-space-between align-center">
         <h4 class="mt-3">Vyberte časový úsek, ktorý chcete odstrániť</h4>
 
diff --git a/app/src/plugins/tm@modal/task/z-remove-employee-modal.vue b/app/src/plugins/tm@modal/task/z-remove-employee-modal.vue
index 2a16a46..c5980a8 100644
--- a/app/src/plugins/tm@modal/task/z-remove-employee-modal.vue
+++ b/app/src/plugins/tm@modal/task/z-remove-employee-modal.vue
@@ -6,7 +6,9 @@
     persistent
     :retain-focus="false"
   >
-    <v-card style="position: relative; height: 100%">
+    <v-card
+      style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
+    >
       <div class="d-flex justify-space-between align-center">
         <h1>
           Naozaj chcete odstrániť tohto zamestnanca a všetky jeho timeblocks?
diff --git a/app/src/plugins/tm@modal/task/z-remove-timeblock-modal.vue b/app/src/plugins/tm@modal/task/z-remove-timeblock-modal.vue
index a65775c..e014d60 100644
--- a/app/src/plugins/tm@modal/task/z-remove-timeblock-modal.vue
+++ b/app/src/plugins/tm@modal/task/z-remove-timeblock-modal.vue
@@ -6,7 +6,9 @@
     persistent
     :retain-focus="false"
   >
-    <v-card style="position: relative; height: 100%">
+    <v-card
+      style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
+    >
       <div class="d-flex justify-space-between align-center">
         <h1>Naozaj chcete odstrániť tento timeblock?</h1>
 
diff --git a/app/src/plugins/tm@modal/task/z-task-add-time-modal.vue b/app/src/plugins/tm@modal/task/z-task-add-time-modal.vue
index 9dc4560..9f4299f 100644
--- a/app/src/plugins/tm@modal/task/z-task-add-time-modal.vue
+++ b/app/src/plugins/tm@modal/task/z-task-add-time-modal.vue
@@ -6,7 +6,9 @@
     persistent
     :retain-focus="false"
   >
-    <v-card style="position: relative; height: 100%">
+    <v-card
+      style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
+    >
       <div class="d-flex justify-space-between align-center">
         <h1>Pridať odpracovaný čas</h1>
 
diff --git a/app/src/plugins/tm@modal/task/z-task-modal.vue b/app/src/plugins/tm@modal/task/z-task-modal.vue
index 5994626..c7f6699 100644
--- a/app/src/plugins/tm@modal/task/z-task-modal.vue
+++ b/app/src/plugins/tm@modal/task/z-task-modal.vue
@@ -17,7 +17,7 @@
         v-if="editMode"
         height="100%"
         class="d-flex flex-column scrolling"
-        style="position: relative; height: 100%"
+        style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
       >
         <div class="d-flex justify-space-between align-center modal-header">
           <h1>{{ subtask?.id ? 'Upraviť sub task' : 'Vytvoriť sub task' }}</h1>
@@ -196,7 +196,7 @@
         v-else
         height="100%"
         class="d-flex flex-column scrolling"
-        style="position: relative; height: 100%"
+        style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
       >
         <div class="d-flex justify-space-between align-center">
           <div>
diff --git a/app/src/plugins/tm@modal/task/z-unable-to-complete-task-modal.vue b/app/src/plugins/tm@modal/task/z-unable-to-complete-task-modal.vue
index 8f1c639..3cf3fd3 100644
--- a/app/src/plugins/tm@modal/task/z-unable-to-complete-task-modal.vue
+++ b/app/src/plugins/tm@modal/task/z-unable-to-complete-task-modal.vue
@@ -6,7 +6,9 @@
     persistent
     :retain-focus="false"
   >
-    <v-card style="position: relative; height: 100%">
+    <v-card
+      style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
+    >
       <div class="d-flex justify-space-between align-center">
         <h1>Sub Task má nedokončené úlohy</h1>
 
diff --git a/app/src/plugins/tm@modal/task/z-unable-to-edit-office-task-modal.vue b/app/src/plugins/tm@modal/task/z-unable-to-edit-office-task-modal.vue
index 6dedb2b..b339a54 100644
--- a/app/src/plugins/tm@modal/task/z-unable-to-edit-office-task-modal.vue
+++ b/app/src/plugins/tm@modal/task/z-unable-to-edit-office-task-modal.vue
@@ -6,7 +6,9 @@
     persistent
     :retain-focus="false"
   >
-    <v-card style="position: relative; height: 100%">
+    <v-card
+      style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
+    >
       <div class="d-flex justify-space-between align-center">
         <h1 v-if="mode === 'edit'">
           Sub Task zosynchronizovaný z Office365 sa nedá upravovat. Upravte ho
diff --git a/app/src/plugins/tm@modal/team/z-delete-team-modal.vue b/app/src/plugins/tm@modal/team/z-delete-team-modal.vue
index 25bcaf8..b02ab6a 100644
--- a/app/src/plugins/tm@modal/team/z-delete-team-modal.vue
+++ b/app/src/plugins/tm@modal/team/z-delete-team-modal.vue
@@ -6,7 +6,9 @@
     persistent
     :retain-focus="false"
   >
-    <v-card style="position: relative; height: 100%">
+    <v-card
+      style="position: relative; height: 100%; max-height: calc(100vh - 48px)"
+    >
       <div class="d-flex justify-space-between align-center">
         <h1>
           Ste si istý, že chcete zmazať tím <b>{{ team.name }}</b
diff --git a/app/src/plugins/tm@modal/team/z-team-modal.vue b/app/src/plugins/tm@modal/team/z-team-modal.vue
index ea75af0..a7fb8e6 100644
--- a/app/src/plugins/tm@modal/team/z-team-modal.vue
+++ b/app/src/plugins/tm@modal/team/z-team-modal.vue
@@ -9,7 +9,11 @@
     <W-loadable :content="team" class="h-100">
       <v-card
         class="d-flex flex-column"
-        style="position: relative; height: 100%"
+        style="
+          position: relative;
+          height: 100%;
+          max-height: calc(100vh - 48px);
+        "
       >
         <div class="d-flex justify-space-between align-center modal-header">
           <h1>{{ team.id ? 'Upraviť tím' : 'Vytvoriť tím' }}</h1>
@@ -19,7 +23,10 @@
           </div>
         </div>
 
-        <v-card-actions class="d-flex flex-column modal-content">
+        <v-card-actions
+          ref="modalContent"
+          class="d-flex flex-column modal-content"
+        >
           <v-text-field
             v-model="team.name"
             class="modal-input"
@@ -153,6 +160,16 @@ export default {
       this.team.employees.push(employee);
       this.employeeSelect = null;
       this.$refs.autocomplete.search = '';
+
+      // Scroll to bottom after adding employee
+      this.$nextTick(() => {
+        if (this.$refs.modalContent) {
+          this.$refs.modalContent.$el.scrollTo({
+            top: this.$refs.modalContent.$el.scrollHeight,
+            behavior: 'smooth',
+          });
+        }
+      });
     },
   },