styling changes

working on new content to put in. Thinking it'll be a menu where the new user will setup their username if they sign up with email and some other tutorial steps
This commit is contained in:
rsandb
2023-01-14 22:20:29 -06:00
parent 92a707bdc1
commit 2e0f6115c2
@@ -18,16 +18,16 @@ import { useState, useEffect } from "react";
export function WelcomeModal() {
const { data: session } = useSession();
const [showModal, setShowModal] = useState(false);
const [showModal, setShowModal] = useState(true);
useEffect(() => {
if (!localStorage.getItem("welcomeModalSeen")) {
setShowModal(true);
localStorage.setItem("welcomeModalSeen", "true");
} else {
setShowModal(false);
}
}, []);
// useEffect(() => {
// if (!localStorage.getItem("welcomeModalSeen")) {
// setShowModal(true);
// localStorage.setItem("welcomeModalSeen", "true");
// } else {
// setShowModal(false);
// }
// }, []);
if (!session) {
return <></>;
@@ -37,20 +37,32 @@ export function WelcomeModal() {
<>
<Modal isOpen={showModal} onClose={() => setShowModal(false)} isCentered>
<ModalOverlay backdropFilter="auto" backdropBlur="2px" />
<ModalContent>
<ModalHeader>Welcome, {session.user.name || "Contributor"}!</ModalHeader>
<ModalCloseButton />
<ModalBody>
<Box>
<Text>
Open Assistant is an open-source AI assistant that uses and trains advanced language models to
understand and respond to humans.
<ModalContent borderRadius="xl">
<Box p="6" pb="0">
<ModalHeader>
<Text
as="h1"
fontWeight="extrabold"
fontSize="3xl"
bgGradient="linear(320deg, #7162D4, #3182CE)"
bgClip="text"
>
Welcome, {session.user.name || "Contributor"}!
</Text>
<Divider my="4" />
<Text>Complete tasks to help train the model and earn points!</Text>
</Box>
</ModalBody>
<ModalFooter>
</ModalHeader>
<ModalCloseButton mt="1" />
<ModalBody mb="8">
<Box>
<Text>
Open Assistant is an open-source AI assistant that uses and trains advanced language models to
understand and respond to humans.
</Text>
<Divider my="4" />
<Text>Complete tasks to help train the model and earn points.</Text>
</Box>
</ModalBody>
</Box>
<ModalFooter p="8">
<Button colorScheme="blue" onClick={() => setShowModal(false)}>
Got it!
</Button>