Merge pull request #197 from epam/EPMUII-9032-Vertical-align-meta-dat…

…a-popup [EPMUII-9032]. Vertical align meta data popup
epam · Jan 24, 2024 · 96861ae · 96861ae
2 parents 0a4f060 + 763d1ae
commit 96861ae
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 5 deletions.
diff --git a/src/ui/Button/Button.module.css b/src/ui/Button/Button.module.css
@@ -235,4 +235,4 @@ button:hover,
 
 .button_select_file svg {
   margin-right: 10px;
-}
+}
diff --git a/src/ui/Modals/ModalInfo.jsx b/src/ui/Modals/ModalInfo.jsx
@@ -125,8 +125,8 @@ const ModalInfo = (props) => {
     return getVolInfo(volumeSet, volume);
   }, [volumeSet, volumeIndex]);
 
-  const slicesInfo = dicomInfo.m_sliceInfo || [];
-  const tagsList = slicesInfo[currentSlice].m_tags || [];
+  const slicesInfo = dicomInfo?.m_sliceInfo || [];
+  const tagsList = slicesInfo[currentSlice]?.m_tags || [];
 
   return (
     <Modal isOpen={stateVis} close={onHide}>

diff --git a/src/ui/Modals/ModalInfo.module.css b/src/ui/Modals/ModalInfo.module.css
@@ -81,6 +81,9 @@
   width: 100%;
   border-collapse: collapse;
   border: 1px solid var(--light);
+  display: block;
+  overflow-y: scroll;
+  height: 50vh;
 }
 
 .thead {
@@ -106,4 +109,18 @@
   font-size: 14px;
   border: 1px dashed var(--light);
   word-break: break-word;
+  width: 172px;
+}
+
+::-webkit-scrollbar
+{
+  width: 10px;
+  background-color: #F5F5F5;
+}
+
+::-webkit-scrollbar-thumb
+{
+  border-radius: 10px;
+  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
+  background-color: #dc5e47;
 }
diff --git a/src/ui/Modals/Modals.module.css b/src/ui/Modals/Modals.module.css
@@ -36,7 +36,7 @@
   z-index: 1004;
   position: absolute;
   width: 93%;
-  top: 15vh;
+  top: 9vh;
   left: 49%;
   margin: 0 5px;
   transform: translateX(-50%);
@@ -187,7 +187,6 @@
 @media screen and (min-width: 768px) {
   .modal {
     width: 600px;
-    top: calc(50vh - 180px);
   }
 
   .cards {