feat:animations applied only on divs

[Saqlain532]

Summary

As the previous branch was too messy to making rebase with original repo . So i created new branch and upstreamed with original repo then I have changed only required file that i.e global.css and src/page.tsx .

Closes #343

Type of Change

• Bug fix
• New feature
• Documentation update
• Refactor / code cleanup

Changes Made

I have applied animation on divs using @Keyframes in global.css .
applied same calssName to sign with github and view on github div for consistent look .
I have take care about the hardcoded color and applied suggesation to replace hard coded color with { bg-white text-slate-900 on the GitHub sign-in button → use bg-[var(--card)] text-[var(--card-foreground)]
hover:bg-slate-100 on both buttons → use hover:bg-[var(--control)] }
as mentioned in my first PR #395

How to Test

Steps for the reviewer to verify this works:

1.Clone the branch and install dependencies using npm install

2.Run the development server using npm run dev

3.Open the main page in the browser

4.Hover over interactive sections/cards and verify:
i> background color transition
iii> smooth scale animation
5.Run npm run lint to verify no lint issues in the modified code

Checklist

• Linked issue in summary
• npm run lint passes locally
• No TypeScript errors (npm run type-check)
• Self-reviewed the diff
• Added/updated tests if applicable

[vercel]

@Saqlain532 is attempting to deploy a commit to the PRIYANSHU DOSHI's projects Team on Vercel.

A member of the Team first needs to authorize it.

[github-actions]

GSSoC Label Checklist 🏷️

@Priyanshu-byte-coder — please apply the appropriate labels before merging:

Difficulty (pick one):

• level:beginner — 20 pts
• level:intermediate — 35 pts
• level:advanced — 55 pts
• level:critical — 80 pts

Quality (optional):

• quality:clean — ×1.2 multiplier
• quality:exceptional — ×1.5 multiplier

Validation (required to score):

• gssoc:approved — counts for points
• gssoc:invalid / gssoc:spam / gssoc:ai-slop — does not score

Type labels (type:*) are auto-detected from files and title. Review and adjust if needed.
Points formula: (difficulty × quality_multiplier) + type_bonus

[Priyanshu-byte-coder]

Missing EOF newline at the end of src/app/globals.css. Please add a newline after the .fade-up block.