diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.html b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.html index 0985cc7f..a6cc4eaf 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.html +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.html @@ -161,22 +161,27 @@ - + + + diff --git a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.scss b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.scss index b32390bd..775b2fd1 100644 --- a/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.scss +++ b/projects/ucap-webmessenger-app/src/app/layouts/messenger/dialogs/message/message-detail.dialog.component.scss @@ -141,38 +141,42 @@ } .attachFile { border-top: 1px solid #dddddd; - li { - display: flex; - flex-flow: row; - line-height: 2em; - flex: 1 1 auto; - .file-name { - display: inline-flex; - flex-flow: row; - flex: 1 1 auto; - border: 1px solid red; - white-space: nowrap; - word-wrap: normal; - overflow: hidden; - margin-right: 10px; - span:last-child { - overflow: hidden; - text-overflow: ellipsis; - display: block; - width: calc(100% - 40px); - } - } - .file-size { + .attachFileList { + height: 80px; + li { display: flex; - margin-left: auto; - align-self: flex-end; - flex: 0 0 auto; - } - a { - display: inline-block; - width: 20px; - height: 100%; - margin-left: 10px; + flex-flow: row; + line-height: 2em; + flex: 1 1 auto; + margin-right: 10px; + .file-name { + display: inline-flex; + flex-flow: row; + flex: 1 1 auto; + border: 1px solid red; + white-space: nowrap; + word-wrap: normal; + overflow: hidden; + margin-right: 10px; + span:last-child { + overflow: hidden; + text-overflow: ellipsis; + display: block; + width: calc(100% - 40px); + } + } + .file-size { + display: flex; + margin-left: auto; + align-self: flex-end; + flex: 0 0 auto; + } + a { + display: inline-block; + width: 20px; + height: 100%; + margin-left: 10px; + } } } }