Fix call link notice on group call; fix call participants horizontal alignment

This commit is contained in:
ayumi-signal 2024-05-03 07:04:41 -07:00 committed by GitHub
parent 480c1f4882
commit 214fae0c6e
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 52 additions and 37 deletions

View file

@ -3671,7 +3671,7 @@
"description": "Title for the select your screen sharing sources modal" "description": "Title for the select your screen sharing sources modal"
}, },
"icu:CallingAdhocCallInfo__CopyLink": { "icu:CallingAdhocCallInfo__CopyLink": {
"messageformat": "Copy link", "messageformat": "Copy call link",
"description": "Menu item in the in-call info popup for call link calls. The action is to add the call link to the clipboard." "description": "Menu item in the in-call info popup for call link calls. The action is to add the call link to the clipboard."
}, },
"icu:CallingAdhocCallInfo__RemoveClient": { "icu:CallingAdhocCallInfo__RemoveClient": {

View file

@ -4367,29 +4367,37 @@ button.module-image__border-overlay:focus {
flex-direction: column; flex-direction: column;
width: 320px; width: 320px;
height: 440px; height: 440px;
max-height: calc(100vh - $CallControls__height - 22px);
padding-block: 5px 0;
padding-inline: 5px;
margin-block-end: 85px;
margin-block-start: 20px;
margin-inline: auto;
background-color: $color-gray-80; background-color: $color-gray-80;
border-radius: 10px; border-radius: 10px;
color: $color-white; color: $color-white;
filter: drop-shadow(0px 4px 3px $color-black-alpha-20); filter: drop-shadow(0px 4px 3px $color-black-alpha-20);
margin-inline-end: 340px;
margin-block-end: 85px;
margin-block-start: 20px;
outline: 1px solid $color-gray-62; outline: 1px solid $color-gray-62;
overflow: hidden; overflow: hidden;
padding-block: 5px 0;
padding-inline: 5px;
&__overlay { &__overlay {
position: absolute; position: absolute;
top: 0; top: 0;
display: flex; display: flex;
flex-direction: column; flex-direction: row;
align-items: center;
width: 100vw; width: 100vw;
height: 100vh; height: 100vh;
justify-content: flex-end; padding-inline-start: 15px;
align-items: flex-end;
inset-inline-start: 0; inset-inline-start: 0;
z-index: $z-index-calling; z-index: $z-index-calling;
&::after {
content: '';
display: flex;
flex-shrink: 1;
flex-basis: 480px;
}
} }
&__title { &__title {

View file

@ -2,23 +2,32 @@
// SPDX-License-Identifier: AGPL-3.0-only // SPDX-License-Identifier: AGPL-3.0-only
.CallingAdhocCallInfo { .CallingAdhocCallInfo {
width: 100%; flex-shrink: 0;
width: 360px;
height: auto; height: auto;
margin-block-end: auto; margin-block-end: auto;
padding-block-end: 16px; padding-block-end: 16px;
overflow: auto; pointer-events: auto;
} }
.CallingAdhocCallInfo__width-container { .CallingAdhocCallInfo__width-container {
display: flex; display: flex;
flex-direction: column; flex-direction: row;
width: 360px; width: 100%;
max-width: none;
height: auto; height: auto;
padding-block: 1px; padding-block: 1px;
padding-inline: 1px; padding-inline-start: 15px;
margin-block-end: 102px; margin-block-end: 80px;
margin-inline-start: 90px;
overflow: hidden; overflow: hidden;
pointer-events: none;
}
.CallingAdhocCallInfo__width-container::after {
content: '';
display: flex;
flex-shrink: 1;
flex-basis: 480px;
} }
.CallingAdhocCallInfo__overlay { .CallingAdhocCallInfo__overlay {
@ -29,11 +38,6 @@
flex-direction: column; flex-direction: column;
padding: 0; padding: 0;
justify-content: flex-end; justify-content: flex-end;
align-items: start;
}
.CallingAdhocCallInfo__Overlay {
align-items: start;
} }
.CallingAdhocCallInfo__MenuItem { .CallingAdhocCallInfo__MenuItem {

View file

@ -311,22 +311,25 @@ export function CallingLobby({
{i18n('icu:calling__your-video-is-off')} {i18n('icu:calling__your-video-is-off')}
</div> </div>
{callMode === CallMode.Adhoc && isAdhocJoinRequestPending ? ( {/* eslint-disable-next-line no-nested-ternary */}
<div className="CallingLobby__CallLinkNotice CallingLobby__CallLinkNotice--join-request-pending"> {callMode === CallMode.Adhoc ? (
<SpinnerV2 isAdhocJoinRequestPending ? (
className="CallingLobby__CallLinkJoinRequestPendingSpinner" <div className="CallingLobby__CallLinkNotice CallingLobby__CallLinkNotice--join-request-pending">
size={16} <SpinnerV2
strokeWidth={3} className="CallingLobby__CallLinkJoinRequestPendingSpinner"
/> size={16}
{i18n('icu:CallingLobby__CallLinkNotice--join-request-pending')} strokeWidth={3}
</div> />
) : ( {i18n('icu:CallingLobby__CallLinkNotice--join-request-pending')}
<div className="CallingLobby__CallLinkNotice"> </div>
{isSharingPhoneNumberWithEverybody ) : (
? i18n('icu:CallingLobby__CallLinkNotice--phone-sharing') <div className="CallingLobby__CallLinkNotice">
: i18n('icu:CallingLobby__CallLinkNotice')} {isSharingPhoneNumberWithEverybody
</div> ? i18n('icu:CallingLobby__CallLinkNotice--phone-sharing')
)} : i18n('icu:CallingLobby__CallLinkNotice')}
</div>
)
) : null}
<CallingButtonToastsContainer <CallingButtonToastsContainer
hasLocalAudio={hasLocalAudio} hasLocalAudio={hasLocalAudio}