refactor

src/pages/Hello.tsx

@@ -57,13 +57,25 @@ const Hello: Component = () => {
           未実装の機能やバグがあることを承知の上でご利用ください。
         </p>
       </div>
-      <div class="p-8 shadow-md">
+      <div class="rounded-md p-8 shadow-md">
         <Switch>
           <Match when={signerStatus() === 'checking'}>
             拡張機能のインストール状況を確認中です...
           </Match>
           <Match when={signerStatus() === 'unavailable'}>
-            <div class="pb-1 text-lg font-bold">拡張機能がインストールされていません！</div>
+            <h2 class="text-lg font-bold">Nostrをはじめる</h2>
+            <p class="pt-2">
+              <a
+                class="text-blue-500 underline"
+                target="_blank"
+                rel="noopener noreferrer"
+                href="https://scrapbox.io/nostr/%E3%81%AF%E3%81%98%E3%82%81%E3%81%A6%E3%81%AENostr%E3%80%90%E3%81%AF%E3%81%98%E3%82%81%E3%81%A6%E3%81%AE%E6%96%B9%E3%81%AF%E3%81%93%E3%81%A1%E3%82%89%E3%80%91"
+              >
+                はじめてのNostr
+              </a>
+              を参考にするとよいでしょう。
+            </p>
+            <h2 class="pt-2 text-lg font-bold">既にキーペアを持っている場合</h2>
             <p class="pt-2">
               利用にはNIP-07に対応した拡張機能が必要です。
               <br />
@@ -77,18 +89,6 @@ const Hello: Component = () => {
               </a>
               に拡張機能をインストールしてください。
             </p>
-            <p class="pt-2">
-              はじめてNostrを利用する方は
-              <a
-                class="text-blue-500 underline"
-                target="_blank"
-                rel="noopener noreferrer"
-                href="https://scrapbox.io/nostr/%E3%81%AF%E3%81%98%E3%82%81%E3%81%A6%E3%81%AENostr%E3%80%90%E3%81%AF%E3%81%98%E3%82%81%E3%81%A6%E3%81%AE%E6%96%B9%E3%81%AF%E3%81%93%E3%81%A1%E3%82%89%E3%80%91"
-              >
-                はじめてのNostr
-              </a>
-              を参考にするとよいでしょう。
-            </p>
           </Match>
           <Match when={signerStatus() === 'available'}>
             <button