fix: 사이트 레이아웃 개선

- 사이트 전체 min-width 1200px → 1440px로 변경
- 헤더/갤러리 양쪽 여백 통일 (px-24)
- 갤러리 CSS 정리 (호버 효과만 유지)
This commit is contained in:
caadiq 2026-01-04 02:22:42 +09:00
parent 326cb02df6
commit a5eba6535f
3 changed files with 3 additions and 16 deletions

View file

@ -19,7 +19,7 @@ function Header() {
return ( return (
<header className="bg-white shadow-sm sticky top-0 z-50"> <header className="bg-white shadow-sm sticky top-0 z-50">
<div className="max-w-7xl mx-auto px-6"> <div className="px-24">
<div className="flex items-center justify-between h-16"> <div className="flex items-center justify-between h-16">
{/* 로고 */} {/* 로고 */}
<NavLink to="/" className="flex items-center gap-2"> <NavLink to="/" className="flex items-center gap-2">

View file

@ -14,7 +14,7 @@ body {
/* 최소 너비 설정 - 화면 축소시 깨짐 방지 */ /* 최소 너비 설정 - 화면 축소시 깨짐 방지 */
#root { #root {
min-width: 1200px; min-width: 1440px;
} }
/* 스크롤바 스타일 */ /* 스크롤바 스타일 */

View file

@ -62,25 +62,12 @@ const galleryStyles = `
transition: transform 0.3s ease, filter 0.3s ease !important; transition: transform 0.3s ease, filter 0.3s ease !important;
cursor: pointer; cursor: pointer;
overflow: visible !important; overflow: visible !important;
animation: fadeInUp 0.4s ease-out backwards;
} }
.react-photo-album--photo:hover { .react-photo-album--photo:hover {
transform: scale(1.05); transform: scale(1.05);
filter: brightness(0.9); filter: brightness(0.9);
z-index: 10; z-index: 10;
} }
/* 순차적 로드 애니메이션 */
.react-photo-album--photo:nth-child(1) { animation-delay: 0.02s; }
.react-photo-album--photo:nth-child(2) { animation-delay: 0.04s; }
.react-photo-album--photo:nth-child(3) { animation-delay: 0.06s; }
.react-photo-album--photo:nth-child(4) { animation-delay: 0.08s; }
.react-photo-album--photo:nth-child(5) { animation-delay: 0.1s; }
.react-photo-album--photo:nth-child(6) { animation-delay: 0.12s; }
.react-photo-album--photo:nth-child(7) { animation-delay: 0.14s; }
.react-photo-album--photo:nth-child(8) { animation-delay: 0.16s; }
.react-photo-album--photo:nth-child(9) { animation-delay: 0.18s; }
.react-photo-album--photo:nth-child(10) { animation-delay: 0.2s; }
.react-photo-album--photo:nth-child(n+11) { animation-delay: 0.22s; }
`; `;
function AlbumGallery() { function AlbumGallery() {
@ -251,7 +238,7 @@ function AlbumGallery() {
transition={{ duration: 0.3 }} transition={{ duration: 0.3 }}
className="py-16" className="py-16"
> >
<div className="container mx-auto px-4"> <div className="px-24">
{/* 브레드크럼 스타일 헤더 */} {/* 브레드크럼 스타일 헤더 */}
<div className="mb-8"> <div className="mb-8">
<div className="flex items-center gap-2 text-sm text-gray-500 mb-2"> <div className="flex items-center gap-2 text-sm text-gray-500 mb-2">