From 40c619f722085dce6ea5f3a6aa0173045b54c058 Mon Sep 17 00:00:00 2001
From: ChanatpakornD <csirintronsopon8@gmail.com>
Date: Sun, 28 Jan 2024 20:01:18 +0700
Subject: [PATCH 1/6] feat:fetch octokit

---
 package.json                                |  1 +
 pnpm-lock.yaml                              | 13 +++++++++++
 src/components/member/Members.svelte        | 26 +++++++++++++++++++++
 src/components/member/ProfileCard.svelte    | 23 ++++++++++++++++++
 src/components/member/ProfileSection.svelte |  0
 src/components/member/types.ts              |  6 +++++
 src/pages/index.astro                       | 16 +++++++++++++
 7 files changed, 85 insertions(+)
 create mode 100644 src/components/member/Members.svelte
 create mode 100644 src/components/member/ProfileCard.svelte
 create mode 100644 src/components/member/ProfileSection.svelte
 create mode 100644 src/components/member/types.ts

diff --git a/package.json b/package.json
index e1aef79..b23f2d0 100644
--- a/package.json
+++ b/package.json
@@ -22,6 +22,7 @@
     "@astrojs/tailwind": "5.1.0",
     "@fontsource-variable/space-grotesk": "5.0.16",
     "@fontsource/noto-sans-thai-looped": "5.0.8",
+    "@octokit/types": "12.4.0",
     "astro": "4.2.1",
     "sharp": "0.33.2",
     "tailwindcss": "3.4.1",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 78c09b7..b079e57 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -20,6 +20,9 @@ dependencies:
   '@fontsource/noto-sans-thai-looped':
     specifier: 5.0.8
     version: 5.0.8
+  '@octokit/types':
+    specifier: 12.4.0
+    version: 12.4.0
   astro:
     specifier: 4.2.1
     version: 4.2.1(typescript@5.3.3)
@@ -1010,6 +1013,16 @@ packages:
       '@nodelib/fs.scandir': 2.1.5
       fastq: 1.16.0
 
+  /@octokit/openapi-types@19.1.0:
+    resolution: {integrity: sha512-6G+ywGClliGQwRsjvqVYpklIfa7oRPA0vyhPQG/1Feh+B+wU0vGH1JiJ5T25d3g1JZYBHzR2qefLi9x8Gt+cpw==}
+    dev: false
+
+  /@octokit/types@12.4.0:
+    resolution: {integrity: sha512-FLWs/AvZllw/AGVs+nJ+ELCDZZJk+kY0zMen118xhL2zD0s1etIUHm1odgjP7epxYU1ln7SZxEUWYop5bhsdgQ==}
+    dependencies:
+      '@octokit/openapi-types': 19.1.0
+    dev: false
+
   /@pkgjs/parseargs@0.11.0:
     resolution: {integrity: sha512-+1VkjdD0QBLPodGrJUeqarH8VAIvQODIbwh9XpP5Syisf7YoQgsJKPNFoqqLQlu+VQ/tVSshMR6loPMn8U+dPg==}
     engines: {node: '>=14'}
diff --git a/src/components/member/Members.svelte b/src/components/member/Members.svelte
new file mode 100644
index 0000000..c5d4cbe
--- /dev/null
+++ b/src/components/member/Members.svelte
@@ -0,0 +1,26 @@
+<script lang="ts">
+  import ProfileCard from "./ProfileCard.svelte";
+  import type { OrgMember } from "./types.ts";
+  export let OrgMembers: OrgMember[];
+</script>
+
+<section>
+  <div class="container bg-blue-500">
+    <p class="text-4xl font-bold text-white">Members</p>
+    <div class="inline-flex items-center justify-center">
+      <div class="profile-container">
+        {#if !OrgMembers ||OrgMembers.length === 0}
+          <p>No Public Members found...</p>
+        {:else}
+          {#each OrgMembers as member}
+            <ProfileCard
+              username={member.login}
+              avatarURL={member.avatar_url}
+              profileURL={member.html_url}
+            />
+          {/each}
+        {/if}
+      </div>
+    </div>
+  </div>
+</section>
diff --git a/src/components/member/ProfileCard.svelte b/src/components/member/ProfileCard.svelte
new file mode 100644
index 0000000..ba5b367
--- /dev/null
+++ b/src/components/member/ProfileCard.svelte
@@ -0,0 +1,23 @@
+<script lang="ts">
+  export let username: string;
+  export let avatarURL: string;
+  export let profileURL: string;
+</script>
+
+<div>
+  <div class="m-2 inline-block">
+    <a class="no-underline" title={username} href={profileURL}>
+      <div
+        id="profile"
+        class="rounded bg-[#232428] p-2 text-white hover:scale-110"
+      >
+        <div class="flex flex-row items-center">
+          <img alt={username} class="mr-3 rounded-full" src={avatarURL} />
+          <p class="text-sm">
+            @ {username}
+          </p>
+        </div>
+      </div>
+    </a>
+  </div>
+</div>
diff --git a/src/components/member/ProfileSection.svelte b/src/components/member/ProfileSection.svelte
new file mode 100644
index 0000000..e69de29
diff --git a/src/components/member/types.ts b/src/components/member/types.ts
new file mode 100644
index 0000000..3e4357a
--- /dev/null
+++ b/src/components/member/types.ts
@@ -0,0 +1,6 @@
+import type { Endpoints } from "@octokit/types";
+
+export type OrgMember =
+  Endpoints["GET /orgs/{org}/public_members"]["response"]["data"][number];
+
+export type GitHubUser = Pick<OrgMember, "avatar_url" | "login" | "html_url">;
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 03aa83b..8667258 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -3,6 +3,21 @@ import Layout from "@/layouts/Layout.astro";
 
 import ISDLogo from "@/assets/isd_logo.svg";
 import { Image } from "astro:assets";
+import Members from "@/components/member/Members.svelte";
+
+const fetchOrgMembers = async () => {
+  try {
+    const res = await fetch(
+      "https://api.github.com/orgs/isd-sgcu/public_members",
+    );
+    const data = await res.json();
+    return data;
+  } catch (err) {
+    console.error(err);
+  }
+};
+const orgMembers= await fetchOrgMembers();
+console.log(orgMembers);
 ---
 
 <Layout title="Home" description="Main page">
@@ -48,6 +63,7 @@ import { Image } from "astro:assets";
         อบจ. และองค์กรต่าง ๆ ในจุฬาฯ เพื่อพัฒนาระบบเว็บไซต์ แอปพลิเคชัน
         และระบบสารสนเทศอื่น ๆ ที่อำนวยความสะดวก และเป็นประโยชน์ต่อนิสิตจุฬาฯ
       </p>
+      <Members orgMembers={orgMembers}/>
     </div>
   </section>
 </Layout>

From db5c7aaa22ecb5e96125bbb0e391b20b81c4974c Mon Sep 17 00:00:00 2001
From: ChanatpakornD <csirintronsopon8@gmail.com>
Date: Mon, 29 Jan 2024 16:38:53 +0700
Subject: [PATCH 2/6] feat: members

---
 src/components/member/Members.svelte        | 41 +++++++++++++--------
 src/components/member/ProfileCard.svelte    | 18 +++++++--
 src/components/member/ProfileSection.svelte |  0
 src/pages/index.astro                       | 11 +++---
 4 files changed, 47 insertions(+), 23 deletions(-)
 delete mode 100644 src/components/member/ProfileSection.svelte

diff --git a/src/components/member/Members.svelte b/src/components/member/Members.svelte
index c5d4cbe..6415d5f 100644
--- a/src/components/member/Members.svelte
+++ b/src/components/member/Members.svelte
@@ -5,22 +5,33 @@
 </script>
 
 <section>
-  <div class="container bg-blue-500">
-    <p class="text-4xl font-bold text-white">Members</p>
-    <div class="inline-flex items-center justify-center">
-      <div class="profile-container">
-        {#if !OrgMembers ||OrgMembers.length === 0}
-          <p>No Public Members found...</p>
-        {:else}
-          {#each OrgMembers as member}
-            <ProfileCard
-              username={member.login}
-              avatarURL={member.avatar_url}
-              profileURL={member.html_url}
-            />
-          {/each}
-        {/if}
+  <div
+    class="mb-20 flex flex-col items-center justify-center gap-4 px-8 text-center"
+  >
+    <div class="w-3/4">
+      <p class="text-4xl font-medium text-white">Members</p>
+      <div class="mt-6 flex w-full flex-col justify-center lg:my-20">
+        <div class="inline-flex flex-wrap justify-center">
+          {#if !OrgMembers || OrgMembers.length === 0}
+            <p>No Public Members found...</p>
+          {:else}
+            {#each OrgMembers as member}
+              <ProfileCard
+                username={member.login}
+                avatarURL={member.avatar_url}
+                profileURL={member.html_url}
+              />
+            {/each}
+          {/if}
+        </div>
       </div>
     </div>
+    <a href="https://github.com/orgs/isd-sgcu/people">
+      <button
+        class="item-center rounded-lg border border-[#807F7E] bg-transparent px-4 py-2 font-normal text-[#807F7E] duration-100 hover:bg-[#807F7E] hover:text-primary"
+      >
+        All members
+      </button>
+    </a>
   </div>
 </section>
diff --git a/src/components/member/ProfileCard.svelte b/src/components/member/ProfileCard.svelte
index ba5b367..b616b87 100644
--- a/src/components/member/ProfileCard.svelte
+++ b/src/components/member/ProfileCard.svelte
@@ -5,14 +5,19 @@
 </script>
 
 <div>
-  <div class="m-2 inline-block">
+  <div class="mx-2 my-4 inline-block">
     <a class="no-underline" title={username} href={profileURL}>
       <div
         id="profile"
-        class="rounded bg-[#232428] p-2 text-white hover:scale-110"
+        class="rounded bg-[#232428] p-2 text-white duration-200 hover:scale-110"
       >
         <div class="flex flex-row items-center">
-          <img alt={username} class="mr-3 rounded-full" src={avatarURL} />
+          <img
+            id="image-profile"
+            alt={username}
+            class="mr-2 h-8 w-8 rounded-full"
+            src={avatarURL}
+          />
           <p class="text-sm">
             @ {username}
           </p>
@@ -21,3 +26,10 @@
     </a>
   </div>
 </div>
+
+<style lang="post-css">
+  #image-profile {
+    width: 30px;
+    height: 30px;
+  }
+</style>
diff --git a/src/components/member/ProfileSection.svelte b/src/components/member/ProfileSection.svelte
deleted file mode 100644
index e69de29..0000000
diff --git a/src/pages/index.astro b/src/pages/index.astro
index 8667258..fa44279 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -16,8 +16,7 @@ const fetchOrgMembers = async () => {
     console.error(err);
   }
 };
-const orgMembers= await fetchOrgMembers();
-console.log(orgMembers);
+const orgMembers = await fetchOrgMembers();
 ---
 
 <Layout title="Home" description="Main page">
@@ -33,7 +32,9 @@ console.log(orgMembers);
     >
     </div>
     <span class="grid place-content-center"> </span>
-    <p class="leading-[120px] tracking-wide">Information System</p><p>
+    <p class="z-10 leading-[120px] tracking-wide">Information System</p><p
+      class="z-10"
+    >
       Development
     </p>
     <div
@@ -50,7 +51,7 @@ console.log(orgMembers);
     </div>
   </section>
   <section
-    class="absolute flex h-screen w-screen -translate-y-12 flex-col items-center justify-center bg-black lg:-translate-y-32"
+    class="flex h-screen w-screen -translate-y-12 flex-col items-center justify-center bg-black lg:-translate-y-32"
   >
     <Image src={ISDLogo} class="w-60 lg:w-80" alt="logo" />
     <div
@@ -63,7 +64,7 @@ console.log(orgMembers);
         อบจ. และองค์กรต่าง ๆ ในจุฬาฯ เพื่อพัฒนาระบบเว็บไซต์ แอปพลิเคชัน
         และระบบสารสนเทศอื่น ๆ ที่อำนวยความสะดวก และเป็นประโยชน์ต่อนิสิตจุฬาฯ
       </p>
-      <Members orgMembers={orgMembers}/>
     </div>
   </section>
+  <Members OrgMembers={orgMembers} />
 </Layout>

From 5a6587afa20615f0d731cf6443e1407703328c07 Mon Sep 17 00:00:00 2001
From: ChanatpakornD <csirintronsopon8@gmail.com>
Date: Mon, 29 Jan 2024 17:29:55 +0700
Subject: [PATCH 3/6] feat: desktop animation and ring

---
 src/pages/index.astro | 27 +++++++++++++++------------
 tailwind.config.mjs   |  6 ++++++
 2 files changed, 21 insertions(+), 12 deletions(-)

diff --git a/src/pages/index.astro b/src/pages/index.astro
index fa44279..565f84d 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -21,34 +21,37 @@ const orgMembers = await fetchOrgMembers();
 
 <Layout title="Home" description="Main page">
   <section
-    class="flex h-screen w-screen -translate-y-12 flex-col items-center justify-center bg-gradient-to-b from-black to-indigo-950 text-4xl font-bold text-white md:text-6xl lg:-translate-y-32"
+    class="flex h-screen w-screen -translate-y-12 flex-col items-center justify-center overflow-hidden bg-gradient-to-b from-black to-indigo-950 text-4xl font-bold text-white md:text-6xl lg:-translate-y-32"
   >
+    <!-- pink -->
     <div
-      class="invisible absolute left-64 top-44 h-24 w-24 rounded-full bg-pink-600 sm:visible lg:h-36 lg:w-36"
+      class="absolute left-32 top-44 aspect-square w-24 animate-sliding-left rounded-full bg-pink-600 duration-100"
     >
     </div>
     <div
-      class="invisible absolute right-0 top-32 h-[600px] w-[300px] rounded-bl-full border-l-[45px] border-blue-700 sm:visible lg:h-[221px] lg:w-[260px]"
+      class="duration-50 absolute -right-32 bottom-0 aspect-square w-64 animate-sliding-right rounded-full bg-pink-600"
     >
     </div>
-    <span class="grid place-content-center"> </span>
-    <p class="z-10 leading-[120px] tracking-wide">Information System</p><p
-      class="z-10"
-    >
-      Development
-    </p>
+    <!-- blue -->
     <div
-      class="invisible absolute bottom-0 right-0 h-72 w-36 rounded-l-full bg-pink-600 sm:visible"
+      class="absolute -right-80 -top-80 aspect-square h-[600px] animate-sliding-right rounded-full ring-[64px] ring-indigo-800"
     >
     </div>
     <div
-      class="invisible absolute bottom-0 left-0 h-80 w-48 rounded-tr-full border-r-[35px] border-indigo-800 sm:visible md:w-60 lg:w-80"
+      class="absolute -bottom-16 -left-24 aspect-square w-64 animate-sliding-left rounded-full ring-[32px] ring-indigo-800 sm:visible"
     >
     </div>
     <div
-      class="invisible absolute bottom-0 right-1/4 h-36 w-72 rounded-t-full border-t-[22px] border-blue-700 sm:visible"
+      class="absolute -bottom-32 right-1/4 aspect-square w-48 animate-sliding-up rounded-full ring-[28px] ring-blue-700"
     >
     </div>
+    <!-- text -->
+    <span class="grid place-content-center"> </span>
+    <p class="z-10 leading-[120px] tracking-wide">Information System</p><p
+      class="z-10"
+    >
+      Development
+    </p>
   </section>
   <section
     class="flex h-screen w-screen -translate-y-12 flex-col items-center justify-center bg-black lg:-translate-y-32"
diff --git a/tailwind.config.mjs b/tailwind.config.mjs
index dd923df..0e935a2 100644
--- a/tailwind.config.mjs
+++ b/tailwind.config.mjs
@@ -17,10 +17,16 @@ export default {
           "70%": { transform: "translateX(-2%)" },
           "100%": { transform: "translateX(0)" },
         },
+        slideUp: {
+          "0%": { transform: "translateY(100%)" },
+          "70%": { transform: "translateY(-2%)" },
+          "100%": { transform: "translateY(0)" },
+        },
       },
       animation: {
         "sliding-left": "slideLeft 1.5s",
         "sliding-right": "slideRight 1.5s",
+        "sliding-up": "slideUp 1.5s",
       },
     },
   },

From 9b768108ef76b6b58af02ddbc6d8c930fd925807 Mon Sep 17 00:00:00 2001
From: ChanatpakornD <csirintronsopon8@gmail.com>
Date: Mon, 29 Jan 2024 20:05:22 +0700
Subject: [PATCH 4/6] refactor: home animation

---
 src/pages/index.astro | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/pages/index.astro b/src/pages/index.astro
index 565f84d..f47f5c8 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -25,24 +25,24 @@ const orgMembers = await fetchOrgMembers();
   >
     <!-- pink -->
     <div
-      class="absolute left-32 top-44 aspect-square w-24 animate-sliding-left rounded-full bg-pink-600 duration-100"
+      class="absolute left-16 lg:left-32 top-16 lg:top-44 aspect-square w-24 animate-sliding-left rounded-full bg-pink-600 duration-100"
     >
     </div>
     <div
-      class="duration-50 absolute -right-32 bottom-0 aspect-square w-64 animate-sliding-right rounded-full bg-pink-600"
+      class="duration-50 absolute -right-16 bottom-16 lg:-right-32 lg:bottom-0 aspect-square w-32 lg:w-64 animate-sliding-right rounded-full bg-pink-600"
     >
     </div>
     <!-- blue -->
     <div
-      class="absolute -right-80 -top-80 aspect-square h-[600px] animate-sliding-right rounded-full ring-[64px] ring-indigo-800"
+      class="absolute -right-32 lg:-right-80 -top-24 lg:-top-1/4 aspect-square h-[240px] lg:h-[600px] animate-sliding-right rounded-full ring-[32px] lg:ring-[64px] ring-indigo-800"
     >
     </div>
     <div
-      class="absolute -bottom-16 -left-24 aspect-square w-64 animate-sliding-left rounded-full ring-[32px] ring-indigo-800 sm:visible"
+      class="absolute -bottom-12 -left-16 lg:-bottom-16 lg:-left-24 aspect-square w-48 lg:w-64 animate-sliding-left rounded-full ring-[32px] ring-indigo-800 sm:visible"
     >
     </div>
     <div
-      class="absolute -bottom-32 right-1/4 aspect-square w-48 animate-sliding-up rounded-full ring-[28px] ring-blue-700"
+      class="absolute -bottom-8 lg:-bottom-32 right-[10%] lg:right-1/4 aspect-square w-24 lg:w-48 animate-sliding-up rounded-full ring-[12px] lg:ring-[28px] ring-blue-700"
     >
     </div>
     <!-- text -->

From 5ff868fabcf49428f39a803d847812ac63a3ede8 Mon Sep 17 00:00:00 2001
From: ChanatpakornD <csirintronsopon8@gmail.com>
Date: Mon, 29 Jan 2024 20:41:54 +0700
Subject: [PATCH 5/6] refactor: camel case

---
 src/components/member/Members.svelte   |  8 ++++---
 src/components/member/RightTick.svelte | 30 ++++++++++++++++++++++++++
 src/pages/index.astro                  | 13 +++++------
 3 files changed, 42 insertions(+), 9 deletions(-)
 create mode 100644 src/components/member/RightTick.svelte

diff --git a/src/components/member/Members.svelte b/src/components/member/Members.svelte
index 6415d5f..2ebc26a 100644
--- a/src/components/member/Members.svelte
+++ b/src/components/member/Members.svelte
@@ -1,7 +1,8 @@
 <script lang="ts">
   import ProfileCard from "./ProfileCard.svelte";
+  import RightTick from "./RightTick.svelte";
   import type { OrgMember } from "./types.ts";
-  export let OrgMembers: OrgMember[];
+  export let members: OrgMember[];
 </script>
 
 <section>
@@ -12,10 +13,10 @@
       <p class="text-4xl font-medium text-white">Members</p>
       <div class="mt-6 flex w-full flex-col justify-center lg:my-20">
         <div class="inline-flex flex-wrap justify-center">
-          {#if !OrgMembers || OrgMembers.length === 0}
+          {#if !members || members.length === 0}
             <p>No Public Members found...</p>
           {:else}
-            {#each OrgMembers as member}
+            {#each members as member}
               <ProfileCard
                 username={member.login}
                 avatarURL={member.avatar_url}
@@ -31,6 +32,7 @@
         class="item-center rounded-lg border border-[#807F7E] bg-transparent px-4 py-2 font-normal text-[#807F7E] duration-100 hover:bg-[#807F7E] hover:text-primary"
       >
         All members
+        <RightTick classProps="inline-block" />
       </button>
     </a>
   </div>
diff --git a/src/components/member/RightTick.svelte b/src/components/member/RightTick.svelte
new file mode 100644
index 0000000..86f5b29
--- /dev/null
+++ b/src/components/member/RightTick.svelte
@@ -0,0 +1,30 @@
+<script lang="ts">
+  export let classProps: string;
+</script>
+
+<svg
+  class={classProps}
+  width="16"
+  height="17"
+  viewBox="0 0 16 17"
+  fill="none"
+  xmlns="http://www.w3.org/2000/svg"
+>
+  <g id="Keyboard arrow right" clip-path="url(#clip0_1401_1011)">
+    <path
+      id="Vector"
+      d="M5.72656 11.394L8.7799 8.33398L5.72656 5.27398L6.66656 4.33398L10.6666 8.33398L6.66656 12.334L5.72656 11.394Z"
+      fill="#807F7E"
+    />
+  </g>
+  <defs>
+    <clipPath id="clip0_1401_1011">
+      <rect
+        width="16"
+        height="16"
+        fill="white"
+        transform="translate(0 0.333984)"
+      />
+    </clipPath>
+  </defs>
+</svg>
diff --git a/src/pages/index.astro b/src/pages/index.astro
index f47f5c8..68943d8 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -17,6 +17,7 @@ const fetchOrgMembers = async () => {
   }
 };
 const orgMembers = await fetchOrgMembers();
+console.log(orgMembers);
 ---
 
 <Layout title="Home" description="Main page">
@@ -25,24 +26,24 @@ const orgMembers = await fetchOrgMembers();
   >
     <!-- pink -->
     <div
-      class="absolute left-16 lg:left-32 top-16 lg:top-44 aspect-square w-24 animate-sliding-left rounded-full bg-pink-600 duration-100"
+      class="absolute left-16 top-16 aspect-square w-24 animate-sliding-left rounded-full bg-pink-600 duration-100 lg:left-32 lg:top-44"
     >
     </div>
     <div
-      class="duration-50 absolute -right-16 bottom-16 lg:-right-32 lg:bottom-0 aspect-square w-32 lg:w-64 animate-sliding-right rounded-full bg-pink-600"
+      class="duration-50 absolute -right-16 bottom-16 aspect-square w-32 animate-sliding-right rounded-full bg-pink-600 lg:-right-32 lg:bottom-0 lg:w-64"
     >
     </div>
     <!-- blue -->
     <div
-      class="absolute -right-32 lg:-right-80 -top-24 lg:-top-1/4 aspect-square h-[240px] lg:h-[600px] animate-sliding-right rounded-full ring-[32px] lg:ring-[64px] ring-indigo-800"
+      class="absolute -right-32 -top-24 aspect-square h-[240px] animate-sliding-right rounded-full ring-[32px] ring-indigo-800 lg:-right-80 lg:-top-1/4 lg:h-[600px] lg:ring-[64px]"
     >
     </div>
     <div
-      class="absolute -bottom-12 -left-16 lg:-bottom-16 lg:-left-24 aspect-square w-48 lg:w-64 animate-sliding-left rounded-full ring-[32px] ring-indigo-800 sm:visible"
+      class="absolute -bottom-12 -left-16 aspect-square w-48 animate-sliding-left rounded-full ring-[32px] ring-indigo-800 sm:visible lg:-bottom-16 lg:-left-24 lg:w-64"
     >
     </div>
     <div
-      class="absolute -bottom-8 lg:-bottom-32 right-[10%] lg:right-1/4 aspect-square w-24 lg:w-48 animate-sliding-up rounded-full ring-[12px] lg:ring-[28px] ring-blue-700"
+      class="absolute -bottom-8 right-[10%] aspect-square w-24 animate-sliding-up rounded-full ring-[12px] ring-blue-700 lg:-bottom-32 lg:right-1/4 lg:w-48 lg:ring-[28px]"
     >
     </div>
     <!-- text -->
@@ -69,5 +70,5 @@ const orgMembers = await fetchOrgMembers();
       </p>
     </div>
   </section>
-  <Members OrgMembers={orgMembers} />
+  <Members members={orgMembers} />
 </Layout>

From d3c77da4797255c820d5ed48fe4f0a58325ed176 Mon Sep 17 00:00:00 2001
From: ChanatpakornD <csirintronsopon8@gmail.com>
Date: Mon, 29 Jan 2024 20:43:32 +0700
Subject: [PATCH 6/6] refactor: del console log

---
 src/pages/index.astro | 1 -
 1 file changed, 1 deletion(-)

diff --git a/src/pages/index.astro b/src/pages/index.astro
index 68943d8..2046ca6 100644
--- a/src/pages/index.astro
+++ b/src/pages/index.astro
@@ -17,7 +17,6 @@ const fetchOrgMembers = async () => {
   }
 };
 const orgMembers = await fetchOrgMembers();
-console.log(orgMembers);
 ---
 
 <Layout title="Home" description="Main page">