Web:Viewer Fixed navigation button
This commit is contained in:
parent
9fed795cca
commit
86d4fd470f
@ -2,6 +2,7 @@ import styled from "styled-components";
|
|||||||
|
|
||||||
type StyledSwitchToolbarProps = {
|
type StyledSwitchToolbarProps = {
|
||||||
left?: boolean;
|
left?: boolean;
|
||||||
|
isPdfFIle?: boolean;
|
||||||
};
|
};
|
||||||
|
|
||||||
const StyledSwitchToolbar = styled.div<StyledSwitchToolbarProps>`
|
const StyledSwitchToolbar = styled.div<StyledSwitchToolbarProps>`
|
||||||
@ -13,7 +14,8 @@ const StyledSwitchToolbar = styled.div<StyledSwitchToolbarProps>`
|
|||||||
display: block;
|
display: block;
|
||||||
opacity: 0;
|
opacity: 0;
|
||||||
transition: all 0.3s;
|
transition: all 0.3s;
|
||||||
${(props) => (props.left ? "left: 0" : "right: 0")};
|
${(props) =>
|
||||||
|
props.left ? "left: 0" : props.isPdfFIle ? "right: 20px" : "right: 0"};
|
||||||
&:hover {
|
&:hover {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
opacity: 1;
|
opacity: 1;
|
||||||
|
@ -8,11 +8,12 @@ import MediaNextIcon from "PUBLIC_DIR/images/viewer.next.react.svg";
|
|||||||
|
|
||||||
type NextButtonProps = {
|
type NextButtonProps = {
|
||||||
nextClick: VoidFunction;
|
nextClick: VoidFunction;
|
||||||
|
isPdfFIle: boolean;
|
||||||
};
|
};
|
||||||
|
|
||||||
function NextButton({ nextClick }: NextButtonProps) {
|
function NextButton({ nextClick, isPdfFIle }: NextButtonProps) {
|
||||||
return (
|
return (
|
||||||
<StyledSwitchToolbar onClick={nextClick}>
|
<StyledSwitchToolbar onClick={nextClick} isPdfFIle={isPdfFIle}>
|
||||||
<StyledButtonScroll orientation="right">
|
<StyledButtonScroll orientation="right">
|
||||||
<MediaNextIcon />
|
<MediaNextIcon />
|
||||||
</StyledButtonScroll>
|
</StyledButtonScroll>
|
||||||
|
@ -172,7 +172,9 @@ function Viewer(props: ViewerProps) {
|
|||||||
{props.playlist.length > 1 && !isFullscreen && !isMobile && (
|
{props.playlist.length > 1 && !isFullscreen && !isMobile && (
|
||||||
<>
|
<>
|
||||||
{isNotFirstElement && <PrevButton prevClick={prevClick} />}
|
{isNotFirstElement && <PrevButton prevClick={prevClick} />}
|
||||||
{isNotLastElement && <NextButton nextClick={nextClick} />}
|
{isNotLastElement && (
|
||||||
|
<NextButton isPdfFIle={props.isPdf} nextClick={nextClick} />
|
||||||
|
)}
|
||||||
</>
|
</>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user