Skip to content

Fix/about photo side by side #47

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.

Sign up for GitHub

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

Merged
n3orma merged 1 commit into from
Oct 15, 2026
Merged

Fix/about photo side by side #47

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions src/components/About.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,12 @@ import { motion } from "framer-motion";
import aboutImage from "../assets/about.jpg";
const About = () => {
return (
<div className="pt-32 pb-24 min-h-screen bg-slate-900 border-b border-slate-800 relative overflow-hidden text-white">
<div className="pt-28 sm:pt-32 pb-8 sm:pb-12 bg-slate-900 relative overflow-hidden text-white">
{/* Background Orbs */}
<div className="hidden md:block absolute top-20 left-0 w-[500px] h-[500px] bg-primary/10 blur-[150px] rounded-full pointer-events-none"></div>
<div className="max-w-7xl mx-auto px-4 sm:px-6 relative z-10">
{/* Centered Heading */}
<div className="text-center mb-10 sm:mb-16 lg:mb-20">
<div className="text-center mb-8 sm:mb-12 lg:mb-14">
<motion.h1
initial={{ opacity: 0, y: 20 }}
animate={{ opacity: 1, y: 0 }}
Expand Down Expand Up @@ -69,13 +69,13 @@ const About = () => {
initial={{ opacity: 0, x: 30 }}
animate={{ opacity: 1, x: 0 }}
transition={{ delay: 0.2 }}
className="relative sticky top-24 sm:top-28 lg:top-32 w-full"
className="relative sticky top-24 sm:top-28 lg:top-32 w-full max-w-md mx-auto"
>
<div className="absolute inset-0 bg-primary/20 blur-2xl sm:blur-3xl rounded-full scale-90"></div>
<img
src={aboutImage}
alt="Dharmesh Makvana"
className="relative rounded-2xl sm:rounded-3xl shadow-2xl border border-slate-700/50 object-cover w-full aspect-[3/4]"
className="relative rounded-2xl sm:rounded-3xl shadow-2xl border border-slate-700/50 object-cover w-full aspect-[3/4] max-h-[460px] sm:max-h-[520px] lg:max-h-[560px]"
/>
</motion.div>
</div>
Expand Down
2 changes: 1 addition & 1 deletion src/components/Footer.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@ import { FaGithub, FaLinkedin, FaYoutube, FaEnvelope } from 'react-icons/fa';

const Footer = () => {
return (
<footer className="bg-secondary text-slate-300 py-24 border-t border-slate-800">
<footer className="bg-secondary text-slate-300 py-12 sm:py-16 border-t border-slate-800">
<div className="max-w-7xl mx-auto px-6 grid grid-cols-1 md:grid-cols-2 lg:grid-cols-12 gap-12 lg:gap-16">
<div className="flex flex-col items-start lg:col-span-8">
<h3 className="text-2xl font-bold text-white mb-6">Edge Robotics Studio</h3>
Expand Down
Loading