BigBlueButton/bigbluebutton-Github
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix(user-list): center icons in chrome on iOS devices

Browse Source
This commit is contained in:
Arthurk12 2023-10-06 19:11:49 -03:00
parent f92d3a1ca5
commit 6129314a33
2 changed files with 6 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
bigbluebutton-html5/imports/ui/components/user-avatar/component.jsx
View File

@ -2,7 +2,7 @@ import React from 'react';
import PropTypes from 'prop-types'; import PropTypes from 'prop-types';
import Settings from '/imports/ui/services/settings'; import Settings from '/imports/ui/services/settings';
import Styled from './styles'; import Styled from './styles';
import browserInfo from '/imports/utils/browserInfo'; import deviceInfo from '/imports/utils/deviceInfo';
const propTypes = { const propTypes = {
children: PropTypes.node, children: PropTypes.node,
@ -37,7 +37,7 @@ const defaultProps = {
}; };
const { animations } = Settings.application; const { animations } = Settings.application;
const { isSafari } = browserInfo; const { isIos } = deviceInfo;
const UserAvatar = ({ const UserAvatar = ({
children, children,
@ -70,7 +70,7 @@ const UserAvatar = ({
listenOnly={listenOnly} listenOnly={listenOnly}
voice={voice} voice={voice}
noVoice={noVoice && !listenOnly} noVoice={noVoice && !listenOnly}
isSafari={isSafari} isIos={isIos}
style={{ style={{
backgroundColor: color, backgroundColor: color,
color, // We need the same color on both for the border color, // We need the same color on both for the border

4
bigbluebutton-html5/imports/ui/components/user-avatar/styles.js
View File

@ -118,7 +118,7 @@ const Avatar = styled.div`
width: 0; width: 0;
height: 0; height: 0;
padding-top: .5rem; padding-top: .5rem;
padding-right: ${({ isSafari }) => isSafari ? '.6rem' : '0'}; padding-right: ${({ isIos }) => isIos ? '.6rem;' : '0;'};;
padding-left: 0; padding-left: 0;
padding-bottom: 0; padding-bottom: 0;
color: inherit; color: inherit;
@ -170,6 +170,7 @@ const Avatar = styled.div`
[dir="rtl"] & { [dir="rtl"] & {
left: auto; left: auto;
padding-right: .3rem !important;
right: ${userIndicatorsOffset}; right: ${userIndicatorsOffset};
letter-spacing: -.33rem; letter-spacing: -.33rem;
} }
@ -192,6 +193,7 @@ const Avatar = styled.div`
[dir="rtl"] & { [dir="rtl"] & {
left: auto; left: auto;
padding-right: .3rem !important;
right: ${userIndicatorsOffset}; right: ${userIndicatorsOffset};
letter-spacing: -.33rem; letter-spacing: -.33rem;
transform: scale(-1, 1); transform: scale(-1, 1);