.messages-wrapper { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; overflow: hidden; -webkit-box-flex: 1; -ms-flex: 1 1 100%; flex: 1 1 100%; width: 100%; } .messages-card { overflow: hidden; } .messages-wrapper, .messages-sidebox { -webkit-transition: all 0.2s; transition: all 0.2s; } .messages-sidebox { -ms-flex-preferred-size: 100%; flex-basis: 100%; -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; } .messages-wrapper .messages-sidebox, .messages-card .messages-sidebox { position: fixed; left: calc(-14rem - 1px); z-index: 10; -ms-flex-preferred-size: auto; flex-basis: auto; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; width: 14rem; } [dir=rtl] .messages-wrapper .messages-sidebox, [dir=rtl] .messages-card .messages-sidebox { right: calc(-14rem - 1px); left: auto; } .layout-sidenav-100vh .messages-wrapper .messages-sidebox { height: 100vh; } .messages-wrapper .messages-sidebox { background: #f3f3f3; } .messages-card .messages-sidebox { position: absolute; bottom: 0; } .messages-scroll { position: absolute; top: 0; bottom: 0; height: 100%; } .messages-scroll.messages-content { position: absolute; right: 0; left: 0; width: 100%; } .messages-list .list-group-item { z-index: auto !important; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; flex-wrap: wrap; padding-top: 0.375rem; padding-bottom: 0.375rem; width: 100%; border-right: 0; border-left: 0; border-radius: 0; } .messages-list .list-group-item:first-child { border-top: 0; } .messages-list .list-group-item:last-child { border-bottom: 0; } .messages-list .list-group-item > * { padding-top: 0.375rem; padding-bottom: 0.375rem; } .message-checkbox .custom-control { display: block !important; margin: 0; margin-top: -1px; } .message-sender { min-width: 10rem; } .message-subject { width: 100%; } .message-date { white-space: nowrap; } .message-attachment { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; } .message-attachment > .media-body { min-width: 0; } .message-attachment-file, .message-attachment-img { display: block; -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; -ms-flex-negative: 0; flex-shrink: 0; width: 4rem; height: 4rem; } .message-attachment-file { display: inline-block; text-align: center; line-height: 4rem; } .message-attachment-img { background-color: transparent; background-position: center center; background-size: cover; } .message-attachment-filename { display: block; overflow: hidden; width: 100%; text-overflow: ellipsis; white-space: nowrap; } .default-style .messages-wrapper .messages-sidebox { z-index: 1081; } .default-style .messages-sidebox-open .messages-sidebox { left: 0; } .default-style .messages-card .messages-sidebox { background: #fff; -webkit-box-shadow: 0 0 0 1px rgba(24, 28, 33, 0.06); box-shadow: 0 0 0 1px rgba(24, 28, 33, 0.06); } @media (min-width: 576px) { .default-style .messages-list .list-group-item { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .default-style .message-subject { width: auto; } .default-style .message-date { margin-left: auto; } } @media (min-width: 768px) { .default-style .messages-sidebox { -ms-flex-preferred-size: 14rem; flex-basis: 14rem; } .default-style .messages-wrapper .messages-sidebox { -ms-flex-preferred-size: auto; flex-basis: auto; } } @media (min-width: 992px) { .default-style .messages-wrapper, .default-style .messages-sidebox { -webkit-transition: none !important; transition: none !important; } .default-style .messages-wrapper { padding-left: 14rem; } .default-style .messages-sidebox { z-index: auto !important; } .default-style .messages-wrapper .messages-sidebox { position: absolute; left: 0; z-index: auto; } .default-style .messages-wrapper .messages-sidebox { height: 100% !important; } .default-style .messages-card .messages-sidebox { position: static; right: auto; left: auto; -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; height: auto; } } .default-style[dir=rtl] .messages-sidebox-open .messages-sidebox { right: 0; left: auto; } @media (min-width: 576px) { .default-style[dir=rtl] .message-date { margin-right: auto; margin-left: 0; } } @media (min-width: 992px) { .default-style[dir=rtl] .messages-wrapper { padding-right: 14rem; padding-left: 0; } .default-style[dir=rtl] .messages-wrapper .messages-sidebox { right: 0; left: auto; } } .material-style .messages-wrapper .messages-sidebox { z-index: 1081; } .material-style .messages-sidebox-open .messages-sidebox { left: 0; } .material-style .messages-card .messages-sidebox { background: #fff; -webkit-box-shadow: 0 0 0 1px rgba(24, 28, 33, 0.06); box-shadow: 0 0 0 1px rgba(24, 28, 33, 0.06); } @media (min-width: 576px) { .material-style .messages-list .list-group-item { -ms-flex-wrap: nowrap; flex-wrap: nowrap; } .material-style .message-subject { width: auto; } .material-style .message-date { margin-left: auto; } } @media (min-width: 768px) { .material-style .messages-sidebox { -ms-flex-preferred-size: 14rem; flex-basis: 14rem; } .material-style .messages-wrapper .messages-sidebox { -ms-flex-preferred-size: auto; flex-basis: auto; } } @media (min-width: 992px) { .material-style .messages-wrapper, .material-style .messages-sidebox { -webkit-transition: none !important; transition: none !important; } .material-style .messages-wrapper { padding-left: 14rem; } .material-style .messages-sidebox { z-index: auto !important; } .material-style .messages-wrapper .messages-sidebox { position: absolute; left: 0; z-index: auto; } .material-style .messages-wrapper .messages-sidebox { height: 100% !important; } .material-style .messages-card .messages-sidebox { position: static; right: auto; left: auto; -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; height: auto; } } .material-style[dir=rtl] .messages-sidebox-open .messages-sidebox { right: 0; left: auto; } @media (min-width: 576px) { .material-style[dir=rtl] .message-date { margin-right: auto; margin-left: 0; } } @media (min-width: 992px) { .material-style[dir=rtl] .messages-wrapper { padding-right: 14rem; padding-left: 0; } .material-style[dir=rtl] .messages-wrapper .messages-sidebox { right: 0; left: auto; } }