add side widget fullScreen param
This commit is contained in:
parent
4d1bab00b5
commit
5e965ae65f
@ -62,7 +62,7 @@ export default function QuizDialog({
|
|||||||
top: 0,
|
top: 0,
|
||||||
right: 0,
|
right: 0,
|
||||||
backgroundColor: "rgba(0, 0, 0, 0.5)",
|
backgroundColor: "rgba(0, 0, 0, 0.5)",
|
||||||
borderTopRightRadius: "4px",
|
borderTopRightRadius: 0,
|
||||||
borderTopLeftRadius: 0,
|
borderTopLeftRadius: 0,
|
||||||
borderBottomLeftRadius: "4px",
|
borderBottomLeftRadius: "4px",
|
||||||
borderBottomRightRadius: 0,
|
borderBottomRightRadius: 0,
|
||||||
|
@ -14,9 +14,10 @@ interface Props {
|
|||||||
position: "left" | "right";
|
position: "left" | "right";
|
||||||
buttonBackgroundColor?: string;
|
buttonBackgroundColor?: string;
|
||||||
dimensions?: { width: string; height: string; };
|
dimensions?: { width: string; height: string; };
|
||||||
|
fullScreen?: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function QuizSideButton({ quizId, position, buttonBackgroundColor, dimensions }: Props) {
|
export default function QuizSideButton({ quizId, position, buttonBackgroundColor, dimensions, fullScreen = false }: Props) {
|
||||||
const [isQuizShown, setIsQuizShown] = useState<boolean>(false);
|
const [isQuizShown, setIsQuizShown] = useState<boolean>(false);
|
||||||
const isMobile = useMediaQuery("(max-width: 600px)");
|
const isMobile = useMediaQuery("(max-width: 600px)");
|
||||||
|
|
||||||
@ -32,7 +33,7 @@ export default function QuizSideButton({ quizId, position, buttonBackgroundColor
|
|||||||
{
|
{
|
||||||
m: 0,
|
m: 0,
|
||||||
},
|
},
|
||||||
!isMobile && {
|
(!isMobile && !fullScreen) && {
|
||||||
position: "absolute",
|
position: "absolute",
|
||||||
bottom: PADDING,
|
bottom: PADDING,
|
||||||
right: position === "right" ? PADDING : undefined,
|
right: position === "right" ? PADDING : undefined,
|
||||||
@ -42,7 +43,7 @@ export default function QuizSideButton({ quizId, position, buttonBackgroundColor
|
|||||||
height: dimensions?.height ?? WIDGET_DEFAULT_HEIGHT,
|
height: dimensions?.height ?? WIDGET_DEFAULT_HEIGHT,
|
||||||
maxHeight: `calc(100% - ${PADDING * 2}px)`,
|
maxHeight: `calc(100% - ${PADDING * 2}px)`,
|
||||||
},
|
},
|
||||||
isMobile && {
|
(isMobile || fullScreen) && {
|
||||||
position: "relative",
|
position: "relative",
|
||||||
width: "100%",
|
width: "100%",
|
||||||
height: "100%",
|
height: "100%",
|
||||||
|
Loading…
Reference in New Issue
Block a user