-
Notifications
You must be signed in to change notification settings - Fork 0
Gutlapallin/prof animation #94
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: dev
Are you sure you want to change the base?
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Overall good animation, some comments added
import Image from "next/image"; | ||
import professorImage from "@/public/about/watkinsonMedina.webp"; | ||
|
||
import { motion } from "motion/react"; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
minor, but can you put all the imports together at the top
transition={{ duration: 2.5 }} | ||
viewport={{ once: true }} | ||
> | ||
<div className="w-full xl:w-4/5"> |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I don't think this div is needed anymore, but you can combine it with the above motion.div and readjust the width's and stuff need be
<motion.div | ||
initial={{ opacity: 0 }} | ||
whileInView={{ opacity: 1 }} | ||
transition={{ duration: 2.5 }} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
make it a bit faster
<motion.div | ||
initial={{ opacity: 0 }} | ||
whileInView={{ opacity: 1 }} | ||
transition={{ duration: 2.5 }} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
make it a bit faster
</p> | ||
</div> | ||
<div className="mx-8 mb-4 flex flex-row justify-center gap-8 xl:flex-row xl:items-center"> | ||
<motion.div |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
both these motion.div tags are the same, you can either make a custom animation component at the top of this file and call it whenever it's needed, or try to make this animation in the div above.
No description provided.