progress bar working on mobile
This commit is contained in:
parent
c923bbd4b4
commit
c3f17ca8d3
@ -579,6 +579,7 @@ class VideoPlayer extends Component {
|
||||
width,
|
||||
pointerEvents: isResizing ? 'none' : 'inherit',
|
||||
display: isMinimized && 'none',
|
||||
background: 'black',
|
||||
}}
|
||||
>
|
||||
<div
|
||||
@ -621,20 +622,6 @@ class VideoPlayer extends Component {
|
||||
{
|
||||
!isPresenter
|
||||
? [
|
||||
(
|
||||
<div className={styles.progressBar}>
|
||||
<div
|
||||
className={styles.loaded}
|
||||
style={{ width: loaded * 100 + '%' }}
|
||||
>
|
||||
<div
|
||||
className={styles.played}
|
||||
style={{ width: played * 100 / loaded + '%'}}
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
),
|
||||
(
|
||||
<div className={hoverToolbarStyle} key="hover-toolbar-external-video">
|
||||
<VolumeSlider
|
||||
@ -650,6 +637,19 @@ class VideoPlayer extends Component {
|
||||
label={intl.formatMessage(intlMessages.refreshLabel)}
|
||||
/>
|
||||
{this.renderFullscreenButton()}
|
||||
|
||||
<div className={styles.progressBar}>
|
||||
<div
|
||||
className={styles.loaded}
|
||||
style={{ width: loaded * 100 + '%' }}
|
||||
>
|
||||
<div
|
||||
className={styles.played}
|
||||
style={{ width: played * 100 / loaded + '%'}}
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
),
|
||||
(deviceInfo.isMobile && playing) && (
|
||||
|
@ -71,12 +71,8 @@
|
||||
}
|
||||
|
||||
.progressBar {
|
||||
display: none;
|
||||
|
||||
:hover > & {
|
||||
display: block;
|
||||
}
|
||||
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
height: 5px;
|
||||
width: 100%;
|
||||
|
||||
|
@ -17,8 +17,8 @@
|
||||
.slider {
|
||||
@extend %baseIndicator;
|
||||
display: flex;
|
||||
position: relative;
|
||||
bottom: 3.5em;
|
||||
position: absolute;
|
||||
bottom: 2.5em;
|
||||
left: 1em;
|
||||
padding: 0.25rem 0.5rem;
|
||||
min-width: 200px;
|
||||
|
Loading…
Reference in New Issue
Block a user