MDL-64267 core_message: sticky positioning of contact request info

This commit is contained in:
Bas Brands 2019-04-10 09:54:50 +02:00
parent 6d2b7d5028
commit 929706015b
4 changed files with 20 additions and 8 deletions

View File

@ -44,10 +44,14 @@
>
<div class="position-relative h-100" data-region="content-container" style="overflow-y: auto; overflow-x: hidden">
<div class="content-message-container hidden h-100 px-2 pt-0" data-region="content-message-container" role="log" style="overflow-y: auto; overflow-x: hidden">
<div class="p-3 text-center hidden" data-region="contact-request-sent-message-container">
<div class="py-3 bg-light sticky-top border-bottom text-center hidden" data-region="contact-request-sent-message-container">
<p class="m-0">{{#str}} contactrequestsent, core_message {{/str}}</p>
<p class="font-italic font-weight-light" data-region="text"></p>
</div>
<div class="p-3 bg-light text-center hidden" data-region="self-conversation-message-container">
<p class="m-0">{{#str}} selfconversation, core_message {{/str}}</p>
<p class="font-italic font-weight-light" data-region="text">{{#str}} selfconversationdefaultmessage, core_message {{/str}}</p>
</div>
<div class="hidden text-center p-3" data-region="more-messages-loading-icon-container">{{> core/loading }}</div>
</div>
<div class="p-4 w-100 h-100 hidden position-absolute" data-region="confirm-dialogue-container" style="top: 0; background: rgba(0,0,0,0.3);">

View File

@ -27,10 +27,8 @@ $positions: static, relative, absolute, fixed, sticky;
z-index: $zindex-fixed;
}
// .sticky-top {
// @supports (position: sticky) {
// position: sticky;
// top: 0;
// z-index: $zindex-sticky;
// }
// }
.sticky-top {
position: sticky;
top: 0;
z-index: $zindex-sticky;
}

View File

@ -7259,6 +7259,11 @@ button.bg-dark:focus {
left: 0;
z-index: 1030; }
.sticky-top {
position: sticky;
top: 0;
z-index: 1020; }
.sr-only {
position: absolute;
width: 1px;

View File

@ -7492,6 +7492,11 @@ button.bg-dark:focus {
left: 0;
z-index: 1030; }
.sticky-top {
position: sticky;
top: 0;
z-index: 1020; }
.sr-only {
position: absolute;
width: 1px;