Fix controls for mini player on mobile
This commit is contained in:
parent
234bd2526a
commit
bb868777f8
2 changed files with 12 additions and 8 deletions
|
@ -318,14 +318,14 @@ export default function FileRenderFloating(props: Props) {
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Draggable
|
<Draggable
|
||||||
onDrag={handleDragMove}
|
onDrag={!isMobile ? handleDragMove : null}
|
||||||
onStart={handleDragStart}
|
onStart={!isMobile ? handleDragStart : null}
|
||||||
onStop={handleDragStop}
|
onStop={!isMobile ? handleDragStop : null}
|
||||||
defaultPosition={position}
|
defaultPosition={position}
|
||||||
position={isFloating ? position : { x: 0, y: 0 }}
|
position={isFloating ? position : { x: 0, y: 0 }}
|
||||||
bounds="parent"
|
bounds="parent"
|
||||||
disabled={noFloatingPlayer}
|
disabled={noFloatingPlayer}
|
||||||
handle=".draggable"
|
handle={!isMobile ? '.draggable' : ''}
|
||||||
cancel=".button"
|
cancel=".button"
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
|
@ -365,7 +365,7 @@ export default function FileRenderFloating(props: Props) {
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{isReadyToPlay ? (
|
{isReadyToPlay ? (
|
||||||
<FileRender className="draggable" uri={uri} />
|
<FileRender className={classnames({ draggable: !isMobile })} uri={uri} />
|
||||||
) : collectionId && !canViewFile ? (
|
) : collectionId && !canViewFile ? (
|
||||||
<div className="content__loading">
|
<div className="content__loading">
|
||||||
<AutoplayCountdown
|
<AutoplayCountdown
|
||||||
|
@ -385,7 +385,7 @@ export default function FileRenderFloating(props: Props) {
|
||||||
)}
|
)}
|
||||||
|
|
||||||
{isFloating && (
|
{isFloating && (
|
||||||
<div className="draggable content__info">
|
<div className={classnames('content__info', { draggable: !isMobile })}>
|
||||||
<div className="claim-preview__title" title={title || uri}>
|
<div className="claim-preview__title" title={title || uri}>
|
||||||
<Button label={title || uri} navigate={navigateUrl} button="link" className="content__floating-link" />
|
<Button label={title || uri} navigate={navigateUrl} button="link" className="content__floating-link" />
|
||||||
</div>
|
</div>
|
||||||
|
|
|
@ -112,7 +112,7 @@
|
||||||
|
|
||||||
.vjs-play-control {
|
.vjs-play-control {
|
||||||
transform: unset !important;
|
transform: unset !important;
|
||||||
display: none !important;
|
display: inline-block !important;
|
||||||
position: fixed !important;
|
position: fixed !important;
|
||||||
top: 12px !important;
|
top: 12px !important;
|
||||||
left: calc(50% - 80px) !important;
|
left: calc(50% - 80px) !important;
|
||||||
|
@ -125,7 +125,11 @@
|
||||||
padding: 15px !important;
|
padding: 15px !important;
|
||||||
|
|
||||||
.vjs-icon-placeholder {
|
.vjs-icon-placeholder {
|
||||||
font-size: 1.2rem !important;
|
&::before {
|
||||||
|
font-size: 1.8em !important;
|
||||||
|
line-height: 32px !important;
|
||||||
|
background-size: 60%;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
span {
|
span {
|
||||||
|
|
Loading…
Reference in a new issue