Hide pages.meet actions when status is full-screen + css improvements

This commit is contained in:
Niko 2022-02-20 17:37:29 +01:00
parent b0920c186e
commit d952cab678
3 changed files with 19 additions and 7 deletions

View File

@ -23,7 +23,7 @@ $actor = $database->getActorByUsername($user->username);
<div id="content" class="size-max"></div>
<div id="actions" class="absolute-bottom width-max"></div>
<div class="fixed-top flex width-max"
style="height: 1em; max-width: var(--meet_max_width)">
style="height: 2em; max-width: var(--meet_max_width)">
<div id="trail" class="center"></div>
</div>
</div>

View File

@ -177,7 +177,7 @@ main {
max-width: var(--meet_max_width);
z-index: 10;
}
.meet.item .status-content.full .text { padding-top: 2em }
.meet.item .status-content.full .text { padding-top: 3em }
.meet.item .status-content .text {
margin: 0;
padding: 1em;
@ -187,7 +187,7 @@ main {
}
.meet.item .status-content .text p {
margin: 0 !important;
line-height: 1.3em;
line-height: 1.4em;
}
.meet.item .status-content .text a {
text-decoration: none;

View File

@ -106,8 +106,7 @@ app.pages.meet = {
`</span>&nbsp;<span id="collapse-link-${id}" collapsed="true"><br><a class="link" onclick="${act}">${t1}</a></span>`;
ptext.innerHTML = value;
if (!app.post.collapsed(id, true))
app.post.collapse(id, [t1, t2],
false, app.pages.meet.onPostCollapse);
app.post.collapse(id, [t1, t2], false, app.pages.meet.onPostCollapse);
}
}
}
@ -140,12 +139,21 @@ app.pages.meet = {
onPostCollapse: function(id, state) {
id = id.replace(/^meet/, '');
const elem = document.querySelector(`*[data-id="${id}"] .status-content`);
if (state === 'uncollapsed')
if (state === 'uncollapsed') {
elem.classList.add('full');
else if (state === 'collapsed')
elem.classList.add('height-mobile');
app.pages.meet.actions._hide();
calcHeightMobile();
} else if (state === 'collapsed') {
elem.classList.remove('full');
elem.classList.remove('height-mobile');
elem.style.height = '';
app.pages.meet.actions._show();
}
},
actions: {
_hide: function() { document.querySelector('#page-meet #actions').style.display = 'none' },
_show: function() { document.querySelector('#page-meet #actions').style.display = '' },
crush: function() {
document.activeElement.blur();
const current = app.pages.meet.dataCurrent();
@ -196,6 +204,10 @@ app.pages.meet = {
app.pages.meet.carousel.setDragEvent(direction);
calcHeightMobile();
if (app.post.collapsed('meet'+current._id, true) === false)
app.pages.meet.actions._hide();
else app.pages.meet.actions._show();
const trail = document.querySelector('#page-meet #trail');
const index = app.pages.meet.carousel._current;
if (trail !== null) {