Mini-Player controls patch (#1688)

* Remove draggable component from mini player on mobile

* Replace draggable disabling method

* Clean code
This commit is contained in:
Rave | 図書館猫 2022-06-14 08:16:23 +02:00 committed by GitHub
parent 363fe82050
commit 4ffec69f25
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 57 additions and 58 deletions

View file

@ -375,15 +375,15 @@ export default function FileRenderFloating(props: Props) {
return ( return (
<Draggable <Draggable
onDrag={!isMobile ? handleDragMove : undefined} onDrag={handleDragMove}
onStart={!isMobile ? handleDragStart : undefined} onStart={handleDragStart}
onStop={!isMobile ? handleDragStop : undefined} onStop={handleDragStop}
defaultPosition={position} defaultPosition={position}
position={isFloating ? position : { x: 0, y: 0 }} position={isFloating ? position : { x: 0, y: 0 }}
bounds="parent" bounds="parent"
disabled={noFloatingPlayer} handle=".draggable"
handle={!isMobile ? '.draggable' : ''}
cancel=".button" cancel=".button"
disabled={noFloatingPlayer}
> >
<div <div
className={classnames([CONTENT_VIEWER_CLASS], { className={classnames([CONTENT_VIEWER_CLASS], {

View file

@ -93,7 +93,6 @@
.icon { .icon {
flex-shrink: 0; flex-shrink: 0;
// width:20px;
} }
} }
} }
@ -101,20 +100,6 @@
.autoplay-countdown { .autoplay-countdown {
display: none; display: none;
} }
}
.vjs-control-bar {
display: inline-block !important;
opacity: 1 !important;
&::before {
background: unset !important;
}
}
.vjs-control {
display: none;
}
.vjs-play-control { .vjs-play-control {
transform: unset !important; transform: unset !important;
@ -135,6 +120,7 @@
font-size: 2.2em !important; font-size: 2.2em !important;
line-height: 32px !important; line-height: 32px !important;
background-size: 60%; background-size: 60%;
pointer-events: none;
} }
} }
@ -152,6 +138,34 @@
display: none !important; display: none !important;
} }
} }
}
.vjs-control-bar {
display: inline-block !important;
opacity: 1 !important;
.vjs-progress-control.vjs-control {
top: 40px;
margin: unset !important;
width: 100%;
max-width: 100%;
.vjs-slider {
margin: 0 !important;
div,
span {
height: 3px !important;
}
}
}
&::before {
background: unset !important;
}
}
.vjs-control {
display: none;
}
.vjs-play-control.vjs-playing { .vjs-play-control.vjs-playing {
.vjs-icon-placeholder::before { .vjs-icon-placeholder::before {
@ -171,21 +185,6 @@
} }
} }
.video-js {
.vjs-progress-control.vjs-control {
top: 38px;
margin: unset !important;
max-width: 100%;
.vjs-slider {
margin: 0 !important;
div,
span {
height: 2px !important;
}
}
}
}
.content__info { .content__info {
margin-top: -50px; margin-top: -50px;
opacity: 0; opacity: 0;