diff --git a/frontend/src/index.css b/frontend/src/index.css index 921b81e..e80f671 100644 --- a/frontend/src/index.css +++ b/frontend/src/index.css @@ -73,3 +73,8 @@ body { opacity: 1; } } + +/* 라이트박스 스크롤바 숨기기 */ +.lightbox-no-scrollbar::-webkit-scrollbar { + display: none; +} diff --git a/frontend/src/pages/pc/AlbumDetail.jsx b/frontend/src/pages/pc/AlbumDetail.jsx index 9482afb..1bdb5cd 100644 --- a/frontend/src/pages/pc/AlbumDetail.jsx +++ b/frontend/src/pages/pc/AlbumDetail.jsx @@ -474,10 +474,11 @@ function AlbumDetail() { animate={{ opacity: 1 }} exit={{ opacity: 0 }} transition={{ duration: 0.2 }} - className="fixed inset-0 bg-black/95 z-50 overflow-auto" + className="fixed inset-0 bg-black/95 z-50 overflow-scroll lightbox-no-scrollbar" + style={{ scrollbarWidth: 'none', msOverflowStyle: 'none' }} > {/* 내부 컨테이너 - min-width, min-height 적용 */} -
+
{/* 상단 버튼들 */}
{/* 다운로드 버튼 */} @@ -525,7 +526,7 @@ function AlbumDetail() { e.stopPropagation()} onCanPlay={() => setImageLoaded(true)} initial={{ x: slideDirection * 100 }} @@ -539,7 +540,7 @@ function AlbumDetail() { key={lightbox.index} src={lightbox.images[lightbox.index]} alt="확대 이미지" - className={`max-w-[1100px] max-h-[75vh] object-contain transition-opacity duration-200 ${imageLoaded ? 'opacity-100' : 'opacity-0'}`} + className={`max-w-[1100px] max-h-[900px] object-contain transition-opacity duration-200 ${imageLoaded ? 'opacity-100' : 'opacity-0'}`} onClick={(e) => e.stopPropagation()} onLoad={() => setImageLoaded(true)} initial={{ x: slideDirection * 100 }} diff --git a/frontend/src/pages/pc/AlbumGallery.jsx b/frontend/src/pages/pc/AlbumGallery.jsx index f53c081..f5fde02 100644 --- a/frontend/src/pages/pc/AlbumGallery.jsx +++ b/frontend/src/pages/pc/AlbumGallery.jsx @@ -308,10 +308,11 @@ function AlbumGallery() { animate={{ opacity: 1 }} exit={{ opacity: 0 }} transition={{ duration: 0.2 }} - className="fixed inset-0 bg-black/95 z-50 overflow-auto" + className="fixed inset-0 bg-black/95 z-50 overflow-scroll lightbox-no-scrollbar" + style={{ scrollbarWidth: 'none', msOverflowStyle: 'none' }} > {/* 내부 컨테이너 - min-width, min-height 적용 (화면 줄여도 크기 유지, 스크롤) */} -
+
{/* 상단 버튼들 */}