add side widget button color param
This commit is contained in:
parent
75691a564b
commit
037adc12a3
@ -10,9 +10,10 @@ const PADDING = 10;
|
|||||||
interface Props {
|
interface Props {
|
||||||
quizId: string;
|
quizId: string;
|
||||||
position: "left" | "right";
|
position: "left" | "right";
|
||||||
|
buttonColor?: string;
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function QuizSideButton({ quizId, position }: Props) {
|
export default function QuizSideButton({ quizId, position, buttonColor }: Props) {
|
||||||
const [isQuizShown, setIsQuizShown] = useState<boolean>(false);
|
const [isQuizShown, setIsQuizShown] = useState<boolean>(false);
|
||||||
|
|
||||||
return createPortal(
|
return createPortal(
|
||||||
@ -53,6 +54,7 @@ export default function QuizSideButton({ quizId, position }: Props) {
|
|||||||
position: "fixed",
|
position: "fixed",
|
||||||
height: "70px",
|
height: "70px",
|
||||||
width: `calc(min(calc(100% - ${PADDING * 2}px), 600px))`,
|
width: `calc(min(calc(100% - ${PADDING * 2}px), 600px))`,
|
||||||
|
color: buttonColor,
|
||||||
},
|
},
|
||||||
position === "left" && {
|
position === "left" && {
|
||||||
bottom: PADDING,
|
bottom: PADDING,
|
||||||
|
@ -7,7 +7,9 @@ export class SideWidget {
|
|||||||
root: Root | undefined;
|
root: Root | undefined;
|
||||||
element = document.createElement("div");
|
element = document.createElement("div");
|
||||||
|
|
||||||
constructor({ quizId, position }: ComponentPropsWithoutRef<typeof QuizSideButton>) {
|
constructor({ quizId, position, buttonColor }: ComponentPropsWithoutRef<typeof QuizSideButton> & {
|
||||||
|
buttonColor?: string;
|
||||||
|
}) {
|
||||||
this.element.style.setProperty("display", "none");
|
this.element.style.setProperty("display", "none");
|
||||||
document.body.appendChild(this.element);
|
document.body.appendChild(this.element);
|
||||||
|
|
||||||
@ -17,6 +19,7 @@ export class SideWidget {
|
|||||||
<QuizSideButton
|
<QuizSideButton
|
||||||
quizId={quizId}
|
quizId={quizId}
|
||||||
position={position}
|
position={position}
|
||||||
|
buttonColor={buttonColor}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user