ZF/jitsi-meet
1
0
Fork 0
mirror of https://gitcode.com/GitHub_Trending/ji/jitsi-meet.git synced 2025-12-30 11:22:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(StageParticipantNameLabel): size

Browse Source 
Fixes an issue where StageParticipantNameLabel is smaller. This is caused because the font size and line height  props are calculated to an invalid (NaN) value after we started using rem instead of px for lineHeight and fontSize in theme.
Reference: #15917
This commit is contained in:
Hristo Terezov
2025-05-07 18:56:35 -05:00
parent 9361e3209b
commit a01f4468a0
2 changed files with 8 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
react/features/display-name/components/web/StageParticipantNameLabel.tsx
View File

@@ -5,7 +5,7 @@ import { makeStyles } from 'tss-react/mui';
import { IReduxState } from '../../../app/types';
import { getParticipantDisplayName, isScreenShareParticipant } from '../../../base/participants/functions';
import { withPixelLineHeight } from '../../../base/styles/functions.web';
import { getVideospaceFloatingElementsBottomSpacing } from '../../../base/ui/functions.web';
import { getVideospaceFloatingElementsBottomSpacing, remToPixels } from '../../../base/ui/functions.web';
import { getLargeVideoParticipant } from '../../../large-video/functions';
import {
getTransitionParamsForElementsAboveToolbox,
@@ -28,9 +28,13 @@ interface IOptions {
}
const useStyles = makeStyles<IOptions, 'screenSharing'>()((theme, options: IOptions = {}, classes) => {
const originalTypography = getStageParticipantTypography(theme);
const typography = {
...getStageParticipantTypography(theme)
...originalTypography,
fontSize: remToPixels(originalTypography.fontSize),
lineHeight: remToPixels(originalTypography.lineHeight)
};
const { clientHeight } = options;
if (typeof clientHeight === 'number' && clientHeight > 0) {

4
react/features/display-name/components/web/styles.ts
View File

@@ -24,8 +24,8 @@ export function getStageParticipantTypography(theme: Theme) {
*/
export function getStageParticipantFontSizeRange(theme: Theme) {
return {
max: theme.typography.bodyShortRegularLarge.fontSize,
min: theme.typography.bodyShortRegularSmall.fontSize
max: remToPixels(theme.typography.bodyShortRegularLarge.fontSize),
min: remToPixels(theme.typography.bodyShortRegularSmall.fontSize)
};
}