mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-11-27 11:47:23 +03:00
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #6618 from SimonBrandner/fix/long-names-call-tiles

Browse source 
Fix long display names in call tiles
This commit is contained in:
David Baker 2021-08-18 11:56:09 +01:00 committed by GitHub
commit 24e3a91f6f
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 8 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

7
res/css/views/messages/_CallEvent.scss
View file

@ -95,17 +95,23 @@ limitations under the License.
flex-direction: row; flex-direction: row;
align-items: center; align-items: center;
margin-left: 12px; margin-left: 12px;
min-width: 0;
.mx_CallEvent_info_basic { .mx_CallEvent_info_basic {
display: flex; display: flex;
flex-direction: column; flex-direction: column;
margin-left: 10px; // To match mx_CallEvent margin-left: 10px; // To match mx_CallEvent
min-width: 0;
.mx_CallEvent_sender { .mx_CallEvent_sender {
font-weight: 600; font-weight: 600;
font-size: 1.5rem; font-size: 1.5rem;
line-height: 1.8rem; line-height: 1.8rem;
margin-bottom: 3px; margin-bottom: 3px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
} }
.mx_CallEvent_type { .mx_CallEvent_type {
@ -142,6 +148,7 @@ limitations under the License.
color: $secondary-fg-color; color: $secondary-fg-color;
margin-right: 16px; margin-right: 16px;
gap: 8px; gap: 8px;
min-width: max-content;
.mx_CallEvent_content_button { .mx_CallEvent_content_button {
height: 24px; height: 24px;

2
src/components/views/messages/CallEvent.tsx
View file

@ -27,7 +27,7 @@ import classNames from 'classnames';
import AccessibleTooltipButton from '../elements/AccessibleTooltipButton'; import AccessibleTooltipButton from '../elements/AccessibleTooltipButton';
import { formatCallTime } from "../../../DateUtils"; import { formatCallTime } from "../../../DateUtils";
const MAX_NON_NARROW_WIDTH = 400 / 70 * 100; const MAX_NON_NARROW_WIDTH = 450 / 70 * 100;
interface IProps { interface IProps {
mxEvent: MatrixEvent; mxEvent: MatrixEvent;