From c28c7f40f4972930190ac9ebb7f8dcb63ee6d64a Mon Sep 17 00:00:00 2001
From: Petrut-Daniel Coman <uhisu@student.kit.edu>
Date: Wed, 23 Oct 2024 13:13:00 +0200
Subject: [PATCH 1/2] fixed styling for popups

---
 src/components/main/popup/PopUp.vue                      | 1 +
 src/components/main/popup/PopUpEditParameterValueMap.vue | 1 +
 src/components/main/popup/PopUpExportSkill.vue           | 4 ++--
 src/components/main/popup/PopUpImportSkill.vue           | 6 ++----
 src/components/main/popup/PopUpSelectProfile.vue         | 6 ++++--
 5 files changed, 10 insertions(+), 8 deletions(-)

diff --git a/src/components/main/popup/PopUp.vue b/src/components/main/popup/PopUp.vue
index 9719655f..34c46062 100644
--- a/src/components/main/popup/PopUp.vue
+++ b/src/components/main/popup/PopUp.vue
@@ -115,6 +115,7 @@ export default {
   min-width: 500px;
   min-height: 500px;
   max-height: 80%;
+  max-width: 80%;
   background-color: var(--background-color);
   border: 2px solid #74a2cf;
   border-radius: 10px;
diff --git a/src/components/main/popup/PopUpEditParameterValueMap.vue b/src/components/main/popup/PopUpEditParameterValueMap.vue
index 57c15bcf..40e590c1 100644
--- a/src/components/main/popup/PopUpEditParameterValueMap.vue
+++ b/src/components/main/popup/PopUpEditParameterValueMap.vue
@@ -140,6 +140,7 @@ export default {
 
 #table-wrapper {
   padding: 25px 10px;
+  max-height: 60vh;
   display: flex;
   flex-flow: column nowrap;
   align-items: stretch;
diff --git a/src/components/main/popup/PopUpExportSkill.vue b/src/components/main/popup/PopUpExportSkill.vue
index 14674710..544423e2 100644
--- a/src/components/main/popup/PopUpExportSkill.vue
+++ b/src/components/main/popup/PopUpExportSkill.vue
@@ -285,7 +285,7 @@ export default {
 #form-container {
   min-width: 400px;
   min-height: 275px;
-  max-height: 80%;
+  max-height: 80vh;
   overflow-y: auto;
   flex-shrink: 0;
   padding: 42px;
@@ -382,7 +382,7 @@ export default {
   flex-flow: column nowrap;
   align-items: center;
   gap: 15px;
-  max-height: 350px;
+  max-height: 45vh;
 }
 
 .modal-action {
diff --git a/src/components/main/popup/PopUpImportSkill.vue b/src/components/main/popup/PopUpImportSkill.vue
index 535b11e8..fa0a1eed 100644
--- a/src/components/main/popup/PopUpImportSkill.vue
+++ b/src/components/main/popup/PopUpImportSkill.vue
@@ -100,9 +100,6 @@ export default {
 
 <template>
   <div id="pop-up-import-skills">
-    <h2 id="title">
-      Import Skills
-    </h2>
     <div id="form-container">
       <div id="names-preview">
         <span v-for="name in currentFileNames" :key="name" class="file-entry">
@@ -138,7 +135,6 @@ export default {
         :disabled="currentFiles.length === 0"
         @click="importSkills"
       >
-        >>>>>>> main
         Import
       </button>
     </div>
@@ -154,6 +150,8 @@ export default {
   display: flex;
   flex-direction: column;
   gap: 5px;
+  max-height: 45vh;
+  overflow: auto;
 }
 
 .file-entry {
diff --git a/src/components/main/popup/PopUpSelectProfile.vue b/src/components/main/popup/PopUpSelectProfile.vue
index 6f29ae65..4669c90c 100644
--- a/src/components/main/popup/PopUpSelectProfile.vue
+++ b/src/components/main/popup/PopUpSelectProfile.vue
@@ -103,10 +103,12 @@ export default {
 #tree-view {
   min-width: 500px;
   min-height: 300px;
+  max-height: 40vh;
+  overflow: auto;
   padding: 42px;
   display: flex;
-  align-items: center;
-  justify-content: center;
+  align-items: safe center;
+  justify-content: safe center;
 }
 
 .modal-action {
-- 
GitLab


From 244abbf76a7ad3ccc8eaa80b556926659f68a35a Mon Sep 17 00:00:00 2001
From: Petrut-Daniel Coman <uhisu@student.kit.edu>
Date: Wed, 23 Oct 2024 14:18:05 +0200
Subject: [PATCH 2/2] more fix more good yeees

---
 src/components/main/popup/PopUp.vue           |  1 -
 .../main/popup/PopUpEditParameterValueMap.vue | 55 ++++++++-----------
 .../main/popup/PopUpExportSkill.vue           | 10 ++--
 .../main/popup/PopUpImportSkill.vue           |  9 ++-
 .../main/popup/PopUpSelectProfile.vue         |  5 +-
 5 files changed, 37 insertions(+), 43 deletions(-)

diff --git a/src/components/main/popup/PopUp.vue b/src/components/main/popup/PopUp.vue
index 34c46062..7c54bb48 100644
--- a/src/components/main/popup/PopUp.vue
+++ b/src/components/main/popup/PopUp.vue
@@ -122,7 +122,6 @@ export default {
   text-align: center;
   padding: 20px 40px;
   display: flex;
-  overflow-y: auto;
   flex-direction: column;
   justify-content: space-between;
   align-items: stretch;
diff --git a/src/components/main/popup/PopUpEditParameterValueMap.vue b/src/components/main/popup/PopUpEditParameterValueMap.vue
index 40e590c1..c4af38a9 100644
--- a/src/components/main/popup/PopUpEditParameterValueMap.vue
+++ b/src/components/main/popup/PopUpEditParameterValueMap.vue
@@ -94,57 +94,48 @@ export default {
 
 <template>
   <div id="edit-parameter-value-map">
-    <div id="container">
-      <div id="table-wrapper">
-        <div v-if="grid" id="content">
-          <TableComponent
-            :grid="grid"
-            :show-add-row-btn="!isNativeSkill"
-            show-add-column-btn
-            @on-add-row="addParameter"
-            @on-add-column="addProfile"
-            @on-delete-entry="deleteParameter"
-          />
-        </div>
-      </div>
-      <div class="modal-action">
-        <button class="modal-basic-button" @click="close">
-          close
-        </button>
+    <div id="table-wrapper">
+      <div v-if="grid" id="content">
+        <TableComponent
+          :grid="grid"
+          :show-add-row-btn="!isNativeSkill"
+          show-add-column-btn
+          @on-add-row="addParameter"
+          @on-add-column="addProfile"
+          @on-delete-entry="deleteParameter"
+        />
       </div>
     </div>
+    <div class="modal-action">
+      <button class="modal-basic-button" @click="close">
+        close
+      </button>
+    </div>
   </div>
 </template>
 
 <style scoped>
-#title {
-  color: var(--primary-text-color);
-}
-
 #edit-parameter-value-map {
   width: 100%;
   height: 100%;
-}
-
-#container {
-  min-height: 400px;
+  overflow: hidden;
   display: flex;
-  flex-flow: column nowrap;
-  justify-content: space-between;
+  flex-direction: column;
 }
 
 #content {
-  max-height: 800px;
-  overflow-y: auto;
+  display: flex;
+  flex-direction: column;
+  overflow: auto;
 }
 
 #table-wrapper {
   padding: 25px 10px;
-  max-height: 60vh;
   display: flex;
+  overflow: auto;
   flex-flow: column nowrap;
-  align-items: stretch;
-  justify-content: center;
+  align-items: safe stretch;
+  justify-content: safe center;
 }
 
 #tabs {
diff --git a/src/components/main/popup/PopUpExportSkill.vue b/src/components/main/popup/PopUpExportSkill.vue
index 544423e2..ef386561 100644
--- a/src/components/main/popup/PopUpExportSkill.vue
+++ b/src/components/main/popup/PopUpExportSkill.vue
@@ -267,6 +267,9 @@ export default {
 }
 
 #pop-up-export-skills {
+  width: 100%;
+  height: 100%;
+  overflow: hidden;
   display: flex;
   flex-direction: column;
 }
@@ -283,14 +286,11 @@ export default {
 }
 
 #form-container {
+  display: flex;
   min-width: 400px;
-  min-height: 275px;
-  max-height: 80vh;
-  overflow-y: auto;
-  flex-shrink: 0;
+  overflow: auto;
   padding: 42px;
   margin: 10px 0;
-  display: flex;
   align-items: safe center;
   justify-content: safe center;
   flex-direction: column;
diff --git a/src/components/main/popup/PopUpImportSkill.vue b/src/components/main/popup/PopUpImportSkill.vue
index fa0a1eed..89dec3fa 100644
--- a/src/components/main/popup/PopUpImportSkill.vue
+++ b/src/components/main/popup/PopUpImportSkill.vue
@@ -142,15 +142,18 @@ export default {
 </template>
 
 <style scoped>
-#title {
-  color: var(--primary-text-color);
+#pop-up-import-skills {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
 }
 
 #names-preview {
   display: flex;
   flex-direction: column;
   gap: 5px;
-  max-height: 45vh;
   overflow: auto;
 }
 
diff --git a/src/components/main/popup/PopUpSelectProfile.vue b/src/components/main/popup/PopUpSelectProfile.vue
index 4669c90c..2c329325 100644
--- a/src/components/main/popup/PopUpSelectProfile.vue
+++ b/src/components/main/popup/PopUpSelectProfile.vue
@@ -58,6 +58,9 @@ export default {
 #pop-up-select-profile {
   width: 100%;
   height: 100%;
+  overflow: hidden;
+  display: flex;
+  flex-direction: column;
 }
 
 .legend {
@@ -102,8 +105,6 @@ export default {
 
 #tree-view {
   min-width: 500px;
-  min-height: 300px;
-  max-height: 40vh;
   overflow: auto;
   padding: 42px;
   display: flex;
-- 
GitLab