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

Split animation and connection to own span to run in safari

Browse Source
This commit is contained in:
Tainan Felipe 2018-08-31 13:58:47 -03:00
parent 6f4e00aed1
commit 1f6b959efc
2 changed files with 16 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
bigbluebutton-html5/imports/ui/components/audio/audio-modal/component.jsx
View File

@ -324,12 +324,15 @@ class AudioModal extends Component {
}
if (this.skipAudioOptions()) {
return (
<span className={styles.connecting} role="alert">
{!isEchoTest ?
<div className={styles.connecting} role="alert">
<span>
{!isEchoTest ?
intl.formatMessage(intlMessages.connecting) :
intl.formatMessage(intlMessages.connectingEchoTest)
}
</span>
</span>
<span className={styles.connectingAnimation} />
</div>
);
}
return content ? this.contents[content].component() : this.renderAudioOptions();

26
bigbluebutton-html5/imports/ui/components/audio/audio-modal/styles.scss
View File

@ -132,25 +132,19 @@
font-size: 2rem;
}
.connecting:after {
overflow: hidden;
display: inline-block;
vertical-align: bottom;
-webkit-animation: ellipsis steps(4,end) 900ms infinite;
animation: ellipsis steps(4,end) 900ms infinite;
content: "\2026"; /* ascii code for the ellipsis character */
width: 0;
margin-right: 1.25em;
}
@keyframes ellipsis {
to {
width: 1.25em;
margin-right: 0;
.connectingAnimation{
&:after {
overflow: hidden;
display: inline-block;
vertical-align: bottom;
animation: ellipsis steps(4,end) 900ms infinite;
content: "\2026"; /* ascii code for the ellipsis character */
width: 0;
margin-right: 1.25em;
}
}
@-webkit-keyframes ellipsis {
@keyframes ellipsis {
to {
width: 1.25em;
margin-right: 0;