fix: 장바구니 / 주문내역 페이지 제목 중복노출 수정 및 아이템 좌우 폭 조정

Author: MU-Software

apps/pyconkr-2026/src/components/pages/store/cart.tsx

@@ -1,12 +1,14 @@
 import { CartStatus } from "@frontend/shop/components/features";
-import { Divider, Typography } from "@mui/material";
+import { Box, Divider, Typography, useMediaQuery, useTheme } from "@mui/material";
 import { FC, useEffect } from "react";
 
 import { PageLayout } from "@apps/pyconkr-2026/components/layout/PageLayout";
 import { useAppContext } from "@apps/pyconkr-2026/contexts/app_context";
 
 export const StoreCartPage: FC = () => {
   const { setAppContext, language } = useAppContext();
+  const theme = useTheme();
+  const isMobile = useMediaQuery(theme.breakpoints.down("md"));
   const title = language === "ko" ? "장바구니" : "Cart";
 
   useEffect(() => {
@@ -20,11 +22,17 @@ export const StoreCartPage: FC = () => {
 
   return (
     <PageLayout spacing={3}>
-      <Typography variant="h4" sx={{ alignSelf: "flex-start", fontWeight: 700 }}>
-        {title}
-      </Typography>
-      <Divider flexItem />
-      <CartStatus />
+      {isMobile && (
+        <>
+          <Typography variant="h4" sx={{ alignSelf: "flex-start", fontWeight: 700 }}>
+            {title}
+          </Typography>
+          <Divider flexItem />
+        </>
+      )}
+      <Box sx={{ width: "100%" }}>
+        <CartStatus />
+      </Box>
     </PageLayout>
   );
 };

apps/pyconkr-2026/src/components/pages/store/order_histories.tsx

@@ -1,13 +1,15 @@
 import { UserSignInAccount, UserSignInMethod } from "@frontend/shop/components/common";
 import { OrderList } from "@frontend/shop/components/features";
-import { Divider, Stack, Typography } from "@mui/material";
+import { Box, Divider, Stack, Typography, useMediaQuery, useTheme } from "@mui/material";
 import { FC, useEffect } from "react";
 
 import { PageLayout } from "@apps/pyconkr-2026/components/layout/PageLayout";
 import { useAppContext } from "@apps/pyconkr-2026/contexts/app_context";
 
 export const StoreOrderHistoriesPage: FC = () => {
   const { setAppContext, language } = useAppContext();
+  const theme = useTheme();
+  const isMobile = useMediaQuery(theme.breakpoints.down("md"));
   const title = language === "ko" ? "주문 내역" : "Order History";
   const noticeText =
     language === "ko"
@@ -26,10 +28,14 @@ export const StoreOrderHistoriesPage: FC = () => {
 
   return (
     <PageLayout spacing={3}>
-      <Typography variant="h4" sx={{ alignSelf: "flex-start", fontWeight: 700 }}>
-        {title}
-      </Typography>
-      <Divider flexItem />
+      {isMobile && (
+        <>
+          <Typography variant="h4" sx={{ alignSelf: "flex-start", fontWeight: 700 }}>
+            {title}
+          </Typography>
+          <Divider flexItem />
+        </>
+      )}
       <Stack component="ul" sx={{ alignSelf: "flex-start", pl: 3, m: 0, gap: 0.5 }}>
         <li>
           <Typography variant="body2">{noticeText}</Typography>
@@ -40,7 +46,9 @@ export const StoreOrderHistoriesPage: FC = () => {
           </Typography>
         </li>
       </Stack>
-      <OrderList />
+      <Box sx={{ width: "100%" }}>
+        <OrderList />
+      </Box>
     </PageLayout>
   );
 };