Add LinkedIn community link

docs/homepage-redesign-roadmap.md

@@ -30,7 +30,7 @@ First-meetup expectations
   Practical first-visit facts · Secondary RSVP
 
 Community links
-  Meetup · Discord · GitHub · Contact
+  Meetup · Discord · GitHub · LinkedIn · Contact
 
 Upcoming events
   Mobile event list · Desktop calendar · RSVP counts · Maps links
@@ -332,7 +332,7 @@ Give existing members fast access to frequently used resources without interrupt
 
 - Move the current quick links below the first-meetup onboarding section.
 - Rename the section to “Community links.”
-- Preserve the four existing external destinations: Meetup, Discord, GitHub, and Contact.
+- Preserve the external destinations: Meetup, Discord, LinkedIn, GitHub, and Contact.
 - Reorder the remainder of the homepage according to the target structure.
 - Add a fixed-navigation destination for the hub.
 - Restore a compact community-size signal near the hub introduction, backed by Meetup data rather than a hard-coded claim.
@@ -342,6 +342,7 @@ Give existing members fast access to frequently used resources without interrupt
 - Meetup → community Meetup group
 - Discord → community Discord
 - GitHub → community GitHub organization
+- LinkedIn → community LinkedIn company page
 - Contact → organizer contact form
 
 ### Implementation notes

src/components/Footer.astro

@@ -1,5 +1,11 @@
 ---
-import { FaGithub, FaDiscord, FaMeetup, FaEnvelope } from "react-icons/fa";
+import {
+	FaDiscord,
+	FaEnvelope,
+	FaGithub,
+	FaLinkedin,
+	FaMeetup,
+} from "react-icons/fa";
 import { useTranslations } from "../i18n/utils";
 
 type Props = {
@@ -14,6 +20,7 @@ const meetupUrl =
 		? "https://www.meetup.com/ja-JP/kyoto-tech-meetup/"
 		: "https://www.meetup.com/kyoto-tech-meetup/";
 const contactUrl = "https://forms.gle/NPtc1G1vM9jGBYhp6";
+const linkedinUrl = "https://www.linkedin.com/company/kyoto-tech-meetup/";
 ---
 
 <footer class="bg-stone-950 px-6 py-12 text-slate-100 md:px-12">
@@ -43,6 +50,16 @@ const contactUrl = "https://forms.gle/NPtc1G1vM9jGBYhp6";
 						<FaDiscord className="text-lg" /> {t("home.footer.discord")}
 					</a>
 				</li>
+				<li>
+					<a
+						class="flex items-center gap-2 transition hover:text-white"
+						href={linkedinUrl}
+						target="_blank"
+						rel="noreferrer"
+					>
+						<FaLinkedin className="text-lg" /> {t("home.footer.linkedin")}
+					</a>
+				</li>
 				<li>
 					<a
 						class="flex items-center gap-2 transition hover:text-white"

src/i18n/ui.ts

@@ -45,6 +45,8 @@ export const ui = {
     "home.quickLinks.meetup.description": "Hang with us",
     "home.quickLinks.discord.title": "Discord",
     "home.quickLinks.discord.description": "Chat with us",
+    "home.quickLinks.linkedin.title": "LinkedIn",
+    "home.quickLinks.linkedin.description": "Network with us",
     "home.quickLinks.github.title": "GitHub",
     "home.quickLinks.github.description": "Build with us",
     "home.quickLinks.contact.title": "Contact",
@@ -102,6 +104,7 @@ export const ui = {
     "home.footer.socialNavLabel": "Social links",
         "home.footer.github": "GitHub",
         "home.footer.discord": "Discord",
+        "home.footer.linkedin": "LinkedIn",
         "home.footer.meetup": "Meetup",
         "home.footer.contact": "Contact",
 
@@ -151,6 +154,8 @@ export const ui = {
     "home.quickLinks.meetup.description": "次回イベントに参加する。",
     "home.quickLinks.discord.title": "Discord",
     "home.quickLinks.discord.description": "メンバーとリアルタイムで交流。",
+    "home.quickLinks.linkedin.title": "LinkedIn",
+    "home.quickLinks.linkedin.description": "つながりを広げよう。",
     "home.quickLinks.github.title": "GitHub",
     "home.quickLinks.github.description": "コミュニティの制作物をチェック。",
     "home.quickLinks.contact.title": "お問い合わせ",
@@ -209,6 +214,7 @@ export const ui = {
     "home.footer.socialNavLabel": "ソーシャルリンク",
         "home.footer.github": "GitHub",
         "home.footer.discord": "Discord",
+        "home.footer.linkedin": "LinkedIn",
         "home.footer.meetup": "Meetup",
         "home.footer.contact": "お問い合わせ",
 

src/pages/index.astro

@@ -6,7 +6,13 @@ import Calendar from "../components/Calendar.astro";
 import UpcomingEventList from "../components/UpcomingEventList.astro";
 import LiveEventUpdater from "../components/LiveEventUpdater.astro";
 import Footer from "../components/Footer.astro";
-import { FaGithub, FaDiscord, FaMeetup, FaEnvelope } from "react-icons/fa";
+import {
+  FaDiscord,
+  FaEnvelope,
+  FaGithub,
+  FaLinkedin,
+  FaMeetup,
+} from "react-icons/fa";
 import { FaExternalLinkAlt } from "react-icons/fa";
 import {
   FaComments,
@@ -41,6 +47,7 @@ const meetupUrl =
     ? "https://www.meetup.com/ja-JP/kyoto-tech-meetup/"
     : "https://www.meetup.com/kyoto-tech-meetup/";
 const discordUrl = "https://discord.gg/mXFWEHDKeu";
+const linkedinUrl = "https://www.linkedin.com/company/kyoto-tech-meetup/";
 const githubUrl = "https://github.com/kyoto-tech";
 const contactUrl = "https://forms.gle/NPtc1G1vM9jGBYhp6";
 const memberFeedsEditUrl =
@@ -65,6 +72,12 @@ const quickLinks = [
     titleKey: "home.quickLinks.github.title",
     descriptionKey: "home.quickLinks.github.description",
   },
+  {
+    href: linkedinUrl,
+    icon: FaLinkedin,
+    titleKey: "home.quickLinks.linkedin.title",
+    descriptionKey: "home.quickLinks.linkedin.description",
+  },
   {
     href: contactUrl,
     icon: FaEnvelope,
@@ -262,19 +275,22 @@ const formatDate = (value: string) => {
         <h2 class="text-3xl font-semibold text-slate-900">
           {t("home.quickLinks.title")}
         </h2>
-        <div class="mt-6 grid gap-4 sm:grid-cols-2 lg:grid-cols-4">
+        <div class="mt-6 grid gap-4 sm:grid-cols-2 lg:grid-cols-6">
           {
-            quickLinks.map((link) => (
+            quickLinks.map((link, index) => (
               <a
-                class="group flex h-full items-start gap-3 rounded-2xl border border-slate-200/80 bg-white p-4 shadow-lg shadow-stone-900/5 transition hover:-translate-y-0.5 hover:border-(--accent)"
+                class:list={[
+                  "group flex h-full items-start gap-3 rounded-2xl border border-slate-200/80 bg-white p-4 shadow-lg shadow-stone-900/5 transition hover:-translate-y-0.5 hover:border-(--accent) lg:col-span-2",
+                  index === 3 ? "lg:col-start-2" : "",
+                ]}
                 href={link.href}
                 target="_blank"
                 rel="noreferrer"
               >
                 <span class="flex h-11 w-11 shrink-0 items-center justify-center rounded-full bg-(--accent)/10 text-(--accent)">
                   <link.icon size={18} aria-hidden="true" />
                 </span>
-                <span class="flex flex-col">
+                <span class="flex min-w-0 flex-col">
                   <span class="text-base font-semibold text-slate-900 group-hover:text-(--accent)">
                     {t(link.titleKey)}
                   </span>