From 138ab7a6e3a01de736f7ed5bc6b5b1df24c5639a Mon Sep 17 00:00:00 2001
From: lanberb <lanberb.2@gmail.com>
Date: Thu, 4 Jan 2024 16:39:48 +0900
Subject: [PATCH] =?UTF-8?q?refactor:=20=E3=82=A4=E3=83=99=E3=83=B3?=
 =?UTF-8?q?=E3=83=88=E3=83=AA=E3=82=B9=E3=83=88=E3=81=AE=E3=83=AA=E3=83=B3?=
 =?UTF-8?q?=E3=82=AF=E4=BF=AE=E6=AD=A3=E3=81=A8=E3=83=9E=E3=83=BC=E3=82=AF?=
 =?UTF-8?q?=E3=82=A2=E3=83=83=E3=83=97=E3=81=AE=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/components/WantedSponsor.tsx |  6 ++--
 src/pages/about/+Page.tsx        |  4 +--
 src/pages/guideline/+Page.tsx    |  4 +--
 src/pages/index/+Page.tsx        | 53 +++++++++++++++++---------------
 4 files changed, 36 insertions(+), 31 deletions(-)

diff --git a/src/components/WantedSponsor.tsx b/src/components/WantedSponsor.tsx
index afc0845..79e4d22 100644
--- a/src/components/WantedSponsor.tsx
+++ b/src/components/WantedSponsor.tsx
@@ -41,10 +41,10 @@ export const WantedSponsor = ({
     ],
   );
   return (
-    <section className="space-y-48">
+    <section>
       <h2 className="mb-24 text-64 font-black leading-[120%]">{title}</h2>
-      <div className="text-14 font-light leading-180 tracking-2">
-        <p dangerouslySetInnerHTML={{ __html: summary }} />
+      <div className="mb-80 text-14 font-light leading-180 tracking-2">
+        <div dangerouslySetInnerHTML={{ __html: summary }} />
       </div>
       <div className="space-y-32">
         <h3 className="text-20 font-bold leading-140 tracking-2">
diff --git a/src/pages/about/+Page.tsx b/src/pages/about/+Page.tsx
index 658bcbd..0c34736 100644
--- a/src/pages/about/+Page.tsx
+++ b/src/pages/about/+Page.tsx
@@ -10,7 +10,7 @@ export function Page() {
   const wantedSponsor = context?.data?.wantedSponsor;
 
   return (
-    <main class="about grid grid-cols-1 gap-120 px-20 md:p-80">
+    <div class="about grid grid-cols-1 gap-64 px-20 md:gap-120 md:p-80">
       <div class="grid grid-cols-1 gap-48">
         <Breadcrumb
           items={[
@@ -75,6 +75,6 @@ export function Page() {
       <section>
         <ContactX />
       </section>
-    </main>
+    </div>
   );
 }
diff --git a/src/pages/guideline/+Page.tsx b/src/pages/guideline/+Page.tsx
index c5201ad..4c5da39 100644
--- a/src/pages/guideline/+Page.tsx
+++ b/src/pages/guideline/+Page.tsx
@@ -70,7 +70,7 @@ export default function Page() {
   );
 
   return (
-    <main className="guideline space-y-64 px-20 md:space-y-120 md:p-80">
+    <div className="guideline space-y-64 px-20 md:space-y-120 md:p-80">
       <section className="space-y-48">
         <Breadcrumb
           items={[
@@ -152,6 +152,6 @@ export default function Page() {
       <section>
         <ContactX />
       </section>
-    </main>
+    </div>
   );
 }
diff --git a/src/pages/index/+Page.tsx b/src/pages/index/+Page.tsx
index ac72cad..ffa7b99 100644
--- a/src/pages/index/+Page.tsx
+++ b/src/pages/index/+Page.tsx
@@ -179,19 +179,24 @@ export function Page() {
           sizes="large"
           className="mb-32"
         />
-        <table className="w-full table-auto">
-          <tbody>
-            {context?.data?.meetupList?.map((meetup, index) => {
-              const isComingSoon = day(meetup.fields.date).isSameOrAfter(
-                day(),
-                "milliseconds",
-              );
-              return (
-                <tr
-                  key={`${meetup.fields.id}-${index}`}
-                  className="border-b border-white-alpha12"
+        <ol className="w-full table-auto">
+          {context?.data?.meetupList?.map((meetup, index) => {
+            const isComingSoon = day(meetup.fields.date).isSameOrAfter(
+              day(),
+              "milliseconds",
+            );
+            return (
+              <li
+                key={`${meetup.fields.id}-${index}`}
+                className="border-b border-white-alpha12"
+              >
+                <a
+                  href={meetup.fields.connpassUrl}
+                  target="_blank"
+                  rel="noopener noreferrer"
+                  className="flex items-center"
                 >
-                  <td className="flex items-center px-0 py-24 lg:table-cell lg:pl-4 lg:pr-32">
+                  <div className="flex items-center px-0 py-24 lg:pl-4 lg:pr-32">
                     <p
                       className={clsx(
                         "h-fit w-fit whitespace-nowrap rounded-8 py-8 pl-12 pr-10 text-center text-14 font-bold leading-100 tracking-2 md:rounded-12 md:py-12 md:pl-16 md:pr-14 md:text-18",
@@ -239,14 +244,14 @@ export function Page() {
                       </p>
                     </div>
                     {/* --- SPサイズの表示要素 --- */}
-                  </td>
-                  <td className="hidden whitespace-nowrap pr-32 text-18 font-bold leading-100 tracking-2 lg:table-cell">
+                  </div>
+                  <div className="whitespace-nowrap pr-32 text-18 font-bold leading-100 tracking-2">
                     {day(meetup.fields.date).format("YYYY.MM.DD（dd）")}
-                  </td>
-                  <td className="hidden grow pr-32 text-18 font-bold leading-140 tracking-2 lg:table-cell">
+                  </div>
+                  <div className="grow pr-32 text-18 font-bold leading-140 tracking-2">
                     {meetup.fields.title}
-                  </td>
-                  <td className="hidden lg:table-cell">
+                  </div>
+                  <div className="max-w-320">
                     <div className="flex h-full items-center pr-32 text-16 font-bold leading-140 tracking-2">
                       <img
                         alt=""
@@ -257,12 +262,12 @@ export function Page() {
                       />
                       <p>{meetup.fields.locationName}</p>
                     </div>
-                  </td>
-                </tr>
-              );
-            })}
-          </tbody>
-        </table>
+                  </div>
+                </a>
+              </li>
+            );
+          })}
+        </ol>
       </section>
       <section className="px-20 py-40 md:p-80">
         <SectionHeader