表記変更

MurakawaTakuya · Jan 9, 2025 · 6443494 · 6443494
1 parent cfc3367
commit 6443494
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 12 deletions.
diff --git a/src/Components/PWAButton/PWAButton.tsx b/src/Components/PWAButton/PWAButton.tsx
@@ -44,7 +44,8 @@ export const PWAButton = ({
     const appInstalledHandler = () => {
       console.log("PWA was successfully installed!");
       showSnackBar({
-        message: "アプリに追加しました。ホーム画面から起動してください。",
+        message:
+          "アプリに追加しました。ホーム画面から起動してください。通知を受信している場合はPWAで再度登録を推奨します。",
         type: "success",
       });
     };

diff --git a/src/app/account/page.tsx b/src/app/account/page.tsx
@@ -46,7 +46,7 @@ export default function Account() {
       const userAgent = navigator.userAgent || navigator.vendor;
       return /iPad|iPhone|iPod/.test(userAgent);
     };
-    setIsIOS(checkIOS());
+    setIsIOS(true);
   }, []);
 
   // PWAか判定
@@ -93,20 +93,29 @@ export default function Account() {
             >
               通知を受信・アプリに追加
             </Typography>
-            <Typography sx={{ textAlign: "center" }}>
-              目標が未達成の場合に期限の5分前に通知を送信します。
-            </Typography>
             <div className={styles.buttonContainer}>
               <div>
-                <NotificationButton defaultDisabled={isIOS} />
+                <PWAButton defaultDisabled={isIOS || isPWA} />
               </div>
               <div>
-                <PWAButton defaultDisabled={isPWA || isIOS} />
+                <NotificationButton defaultDisabled={isIOS && !isPWA} />
               </div>
             </div>
+            <Typography>
+              アプリに追加をすると、端末のホーム画面やアプリ一覧から起動できるようになります。
+              <br />
+              <br />
+              通知を有効にすると、端末の目標が未達成の場合に期限の5分前に通知を送信します。
+              <br />
+            </Typography>
+            <Typography color="neutral" level="body-xs">
+              1ユーザー1端末のみ。最後に登録した端末に送信します。
+              <br />
+              通知が受信できない場合はブラウザやサイトの権限を確認してください。
+            </Typography>
             {isIOS && (
               <>
-                <Typography color="danger" sx={{ textAlign: "center" }}>
+                <Typography color="danger">
                   iOSでは通常ブラウザで通知機能と「アプリに追加」ボタンを使用できません。以下の画像のように「ホーム画面に追加」を押してから、ホーム画面から起動してください。
                 </Typography>
                 <img

diff --git a/src/app/page.module.scss b/src/app/page.module.scss
@@ -40,7 +40,7 @@
     fill: var(--primary-color);
     height: 35px;
     margin: 0;
-    padding-bottom: 3px;
+    padding-bottom: 1px;
     width: 35px;
   }
 }

diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -13,7 +13,7 @@ const StyledTypography = styled(Typography)<TypographyProps>`
   color: var(--primary-color);
   font-family: Roboto, "Zen Kaku Gothic New", sans-serif;
   font-weight: 600;
-  padding: 0 3px;
+  padding: 0 13px;
 `;
 
 export default function Top() {
@@ -32,7 +32,9 @@ export default function Top() {
           }}
         >
           <FormatListBulletedIcon className={styles.svg} />
-          <StyledTypography level="h1">TODO REAL</StyledTypography>
+          <StyledTypography level="h1" sx={{ padding: "0 !important" }}>
+            TODO REAL
+          </StyledTypography>
         </div>
         <img src="/img/app.webp" />
       </CenterIn>
@@ -95,7 +97,7 @@ export default function Top() {
           <br />
           また、達成率や達成回数で友達と競うこともできます!
         </StyledTypography>
-        <img src="/img/competition.webp" />
+        <img src="/img/competition.webp" style={{ width: "70%" }} />
       </CenterIn>
 
       <CenterIn>