Skip to content

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

Open
wants to merge 2 commits into
base: dev
Choose a base branch
from
Open

Conversation

gutlapallin
Copy link
Collaborator

No description provided.

@gutlapallin gutlapallin self-assigned this Aug 1, 2025
@gutlapallin gutlapallin linked an issue Aug 1, 2025 that may be closed by this pull request
@gutlapallin
Copy link
Collaborator Author

Screenshot 2025-07-31 at 11 21 37 PM

Copy link
Contributor

@ALE00111 ALE00111 left a 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";
Copy link
Contributor

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">
Copy link
Contributor

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 }}
Copy link
Contributor

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 }}
Copy link
Contributor

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
Copy link
Contributor

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.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Animate Professor Section
2 participants