diff --git a/src/ui/Button/Button.module.css b/src/ui/Button/Button.module.css index 9da35b8..9b8900d 100644 --- 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; -} \ No newline at end of file +} diff --git a/src/ui/Modals/ModalInfo.jsx b/src/ui/Modals/ModalInfo.jsx index 9f52cd1..2535641 100644 --- 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 ( diff --git a/src/ui/Modals/ModalInfo.module.css b/src/ui/Modals/ModalInfo.module.css index 5f84299..c4f0d74 100644 --- 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 index 007e2af..70d9c9f 100644 --- 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 {