From a25b8b36c07c876654835b323bc91eb67c651327 Mon Sep 17 00:00:00 2001
From: Ted <wodf410@gmail.com>
Date: Mon, 23 Dec 2024 11:33:47 +0800
Subject: [PATCH] feat: adjust mobile picture banner

---
 src/pages/ProgramPage/Secondary/Banner/PictureBanner.tsx | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/src/pages/ProgramPage/Secondary/Banner/PictureBanner.tsx b/src/pages/ProgramPage/Secondary/Banner/PictureBanner.tsx
index 7e6cf72af..a058ee63e 100644
--- a/src/pages/ProgramPage/Secondary/Banner/PictureBanner.tsx
+++ b/src/pages/ProgramPage/Secondary/Banner/PictureBanner.tsx
@@ -29,11 +29,17 @@ const Cover = styled.div<{ coverUrl?: { mobileUrl?: string; desktopUrl?: string
   background-image: url(${props => props.coverUrl?.mobileUrl || props.coverUrl?.desktopUrl});
   background-size: cover;
   background-position: center;
-  background-attachment: fixed;
+  background-repeat: no-repeat;
+
+  @media (max-width: ${BREAK_POINT}px) {
+    transform: scale(1.05);
+  }
+
   @media (min-width: ${BREAK_POINT}px) {
     background-image: url(${props => props.coverUrl?.desktopUrl || props.coverUrl?.mobileUrl});
   }
 `
+
 const ContentWrapper = styled.div<{ gradient?: boolean }>`
   position: relative;
   background: linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6));