Skip to content

Commit c657dca

Browse files
committed
fix: improve hero section alignment and centering for better visual balance
1 parent ee7ccaf commit c657dca

8 files changed

Lines changed: 64 additions & 14 deletions

File tree

asset-manifest.json

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,13 +1,13 @@
11
{
22
"files": {
3-
"main.css": "/static/css/main.a0100632.css",
4-
"main.js": "/static/js/main.630565be.js",
3+
"main.css": "/static/css/main.9f51176b.css",
4+
"main.js": "/static/js/main.b70245b9.js",
55
"index.html": "/index.html",
6-
"main.a0100632.css.map": "/static/css/main.a0100632.css.map",
7-
"main.630565be.js.map": "/static/js/main.630565be.js.map"
6+
"main.9f51176b.css.map": "/static/css/main.9f51176b.css.map",
7+
"main.b70245b9.js.map": "/static/js/main.b70245b9.js.map"
88
},
99
"entrypoints": [
10-
"static/css/main.a0100632.css",
11-
"static/js/main.630565be.js"
10+
"static/css/main.9f51176b.css",
11+
"static/js/main.b70245b9.js"
1212
]
1313
}

index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="David Agustin - Full Stack Developer specializing in React, Next.js, AI/ML, and modern web technologies. View my projects and experience."/><meta name="keywords" content="David Agustin, Full Stack Developer, React, Next.js, AI, Machine Learning, Web Development, Portfolio"/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet"><title>David Agustin - Full Stack Developer Portfolio</title><script defer="defer" src="/static/js/main.630565be.js"></script><link href="/static/css/main.a0100632.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
1+
<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.ico"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="David Agustin - Full Stack Developer specializing in React, Next.js, AI/ML, and modern web technologies. View my projects and experience."/><meta name="keywords" content="David Agustin, Full Stack Developer, React, Next.js, AI, Machine Learning, Web Development, Portfolio"/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet"><title>David Agustin - Full Stack Developer Portfolio</title><script defer="defer" src="/static/js/main.b70245b9.js"></script><link href="/static/css/main.9f51176b.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>

src/components/Hero.tsx

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -6,18 +6,18 @@ const Hero: React.FC = () => {
66
return (
77
<section
88
id="home"
9-
className="min-h-screen flex items-center bg-gradient-to-br from-blue-600 via-purple-600 to-blue-800 relative overflow-hidden pt-16 sm:pt-20"
9+
className="min-h-screen flex items-center bg-gradient-to-br from-blue-600 via-purple-600 to-blue-800 relative overflow-hidden pt-16 sm:pt-20 pb-8"
1010
>
1111
{/* Subtle Pattern */}
1212
<div className="absolute inset-0 opacity-10">
1313
<div className="absolute inset-0 bg-[url('data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 100 100%22%3E%3Cdefs%3E%3Cpattern id=%22grain%22 width=%22100%22 height=%22100%22 patternUnits=%22userSpaceOnUse%22%3E%3Ccircle cx=%2250%22 cy=%2250%22 r=%221%22 fill=%22white%22 opacity=%220.1%22/%3E%3C/pattern%3E%3C/defs%3E%3Crect width=%22100%22 height=%22100%22 fill=%22url(%23grain)%22/%3E%3C/svg%3E')]" />
1414
</div>
1515

1616
<div className="container mx-auto px-4 relative z-10">
17-
<div className="grid grid-cols-1 lg:grid-cols-2 gap-8 lg:gap-12 items-center">
17+
<div className="grid grid-cols-1 lg:grid-cols-2 gap-8 lg:gap-12 items-center justify-items-center">
1818
{/* Content */}
1919
<motion.div
20-
className="text-white"
20+
className="text-white text-center lg:text-left max-w-lg lg:max-w-none"
2121
initial={{ opacity: 0, x: -50 }}
2222
animate={{ opacity: 1, x: 0 }}
2323
transition={{ duration: 0.8 }}
@@ -57,7 +57,7 @@ const Hero: React.FC = () => {
5757
</motion.p>
5858

5959
<motion.div
60-
className="flex flex-col sm:flex-row flex-wrap gap-4 mb-8"
60+
className="flex flex-col sm:flex-row flex-wrap gap-4 mb-8 justify-center lg:justify-start"
6161
initial={{ opacity: 0, y: 20 }}
6262
animate={{ opacity: 1, y: 0 }}
6363
transition={{ duration: 0.8, delay: 0.8 }}
@@ -81,7 +81,7 @@ const Hero: React.FC = () => {
8181
</motion.div>
8282

8383
<motion.div
84-
className="flex flex-col sm:flex-row gap-4"
84+
className="flex flex-col sm:flex-row gap-4 justify-center lg:justify-start"
8585
initial={{ opacity: 0, y: 20 }}
8686
animate={{ opacity: 1, y: 0 }}
8787
transition={{ duration: 0.8, delay: 1 }}
@@ -108,13 +108,13 @@ const Hero: React.FC = () => {
108108

109109
{/* Tech Stack & Stats */}
110110
<motion.div
111-
className="flex flex-col items-center gap-6 lg:gap-8"
111+
className="flex flex-col items-center gap-6 lg:gap-8 w-full max-w-md"
112112
initial={{ opacity: 0, x: 50 }}
113113
animate={{ opacity: 1, x: 0 }}
114114
transition={{ duration: 0.8, delay: 0.3 }}
115115
>
116116
{/* Tech Stack */}
117-
<div className="grid grid-cols-3 gap-3 sm:gap-4 w-full max-w-xs sm:max-w-sm lg:max-w-md">
117+
<div className="grid grid-cols-3 gap-3 sm:gap-4 w-full">
118118
{TECH_STACK.map((tech) => (
119119
<motion.div
120120
key={tech.name}

static/css/main.9f51176b.css

Lines changed: 6 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

static/css/main.9f51176b.css.map

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

static/js/main.b70245b9.js

Lines changed: 3 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.
Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
/**
2+
* @license React
3+
* react-dom.production.min.js
4+
*
5+
* Copyright (c) Facebook, Inc. and its affiliates.
6+
*
7+
* This source code is licensed under the MIT license found in the
8+
* LICENSE file in the root directory of this source tree.
9+
*/
10+
11+
/**
12+
* @license React
13+
* react-jsx-runtime.production.min.js
14+
*
15+
* Copyright (c) Facebook, Inc. and its affiliates.
16+
*
17+
* This source code is licensed under the MIT license found in the
18+
* LICENSE file in the root directory of this source tree.
19+
*/
20+
21+
/**
22+
* @license React
23+
* react.production.min.js
24+
*
25+
* Copyright (c) Facebook, Inc. and its affiliates.
26+
*
27+
* This source code is licensed under the MIT license found in the
28+
* LICENSE file in the root directory of this source tree.
29+
*/
30+
31+
/**
32+
* @license React
33+
* scheduler.production.min.js
34+
*
35+
* Copyright (c) Facebook, Inc. and its affiliates.
36+
*
37+
* This source code is licensed under the MIT license found in the
38+
* LICENSE file in the root directory of this source tree.
39+
*/

static/js/main.b70245b9.js.map

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)