Skip to content

Commit d261d00

Browse files
aster-voidaster-void
committed
refactor: consolidate join pages and remove outdated welcome-events
Merged /join and /join/welcome-events into a single, cleaner page. Removed 2025 spring welcome events (outdated). Discord invite now only shows during recruitment season (April-May).
1 parent 7d4c91c commit d261d00

File tree

2 files changed

+88
-500
lines changed

2 files changed

+88
-500
lines changed

‎src/routes/(site)/join/+page.svelte‎

Lines changed: 88 additions & 137 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,19 @@
11
<script lang="ts">
2-
import { ArrowRight, Github, Heart, MessageCircle, Twitter, Users } from "lucide-svelte";
2+
import { ExternalLink, Github, Twitter } from "lucide-svelte";
3+
4+
const month = new Date().getMonth();
5+
const isRecruitmentSeason = month === 3 || month === 4; // April and May only
36
</script>
47

58
<svelte:head>
69
<title>入部案内 | ut.code();</title>
710
<meta property="og:title" content="入部案内 | ut.code();" />
811
<meta
912
name="description"
10-
content="ut.code();への参加方法をご案内します。プログラミング、ものづくり、デザインに興味がある学生を広く歓迎しています。"
13+
content="ut.code();への参加方法をご案内します。プログラミングに興味がある学生を広く歓迎しています。"
1114
/>
1215
</svelte:head>
1316

14-
<!-- Header -->
1517
<section class="border-b border-zinc-200 bg-zinc-50/50 py-16">
1618
<div class="mx-auto max-w-6xl px-6">
1719
<div
@@ -20,166 +22,115 @@
2022
Join us
2123
</div>
2224
<h1 class="mb-2 text-3xl font-bold">入部案内</h1>
23-
<p class="text-zinc-500">ut.code(); への参加方法をご案内します。</p>
2425
</div>
2526
</section>
2627

27-
<div class="mx-auto max-w-4xl px-6 py-8 sm:py-12">
28-
<!-- Welcome message -->
29-
<div class="mb-8 rounded-2xl border border-primary/20 bg-primary/5 p-6 sm:mb-12 sm:p-8">
30-
<h2 class="mb-3 text-xl font-bold sm:mb-4 sm:text-2xl">ようこそ!</h2>
31-
<p class="leading-relaxed text-zinc-700">
32-
ut.code(); は東京大学のソフトウェアエンジニアリングサークルです。
33-
プログラミング、ものづくり、デザインに興味がある学生を広く歓迎しています。
34-
初心者から実務経験者まで、学年を問わずどなたでも参加できます。
28+
<div class="mx-auto max-w-2xl px-6">
29+
<!-- Intro -->
30+
<section class="py-16">
31+
<p class="text-lg leading-relaxed text-zinc-600">
32+
ut.code();
33+
は東京大学のソフトウェアエンジニアリングサークルです。プログラミングを学びたい人、ものづくりが好きな人、仲間と一緒に開発したい人を歓迎しています。
3534
</p>
36-
</div>
37-
38-
<!-- Requirements -->
39-
<section class="mb-8 sm:mb-12">
40-
<h2 class="mb-4 flex items-center gap-2 text-lg font-bold sm:mb-6 sm:text-xl">
41-
<Users class="h-5 w-5 text-primary" />
42-
入部要件
43-
</h2>
44-
<div class="rounded-2xl border border-zinc-200/50 bg-white/80 backdrop-blur-md p-6">
45-
<ul class="space-y-3">
46-
<li class="flex items-start gap-3">
47-
<span class="mt-1.5 h-2 w-2 shrink-0 rounded-full bg-primary"></span>
48-
<span class="text-zinc-700">基本的に大学生・大学院生が対象です</span>
49-
</li>
50-
<li class="flex items-start gap-3">
51-
<span class="mt-1.5 h-2 w-2 shrink-0 rounded-full bg-primary"></span>
52-
<span class="text-zinc-700">大学名による制限はありません（他大学の方も歓迎）</span>
53-
</li>
54-
<li class="flex items-start gap-3">
55-
<span class="mt-1.5 h-2 w-2 shrink-0 rounded-full bg-primary"></span>
56-
<span class="text-zinc-700">学年による制限はありません</span>
57-
</li>
58-
<li class="flex items-start gap-3">
59-
<span class="mt-1.5 h-2 w-2 shrink-0 rounded-full bg-primary"></span>
60-
<span class="text-zinc-700">プログラミング経験の有無は問いません</span>
61-
</li>
62-
</ul>
63-
</div>
6435
</section>
6536

66-
<!-- How to join -->
67-
<section class="mb-12">
68-
<h2 class="mb-6 flex items-center gap-2 text-xl font-bold">
69-
<MessageCircle class="h-5 w-5 text-primary" />
70-
入部方法
71-
</h2>
72-
<div class="rounded-2xl border border-zinc-200/50 bg-white/80 backdrop-blur-md p-6">
73-
<div class="space-y-4">
74-
<div class="flex items-start gap-4">
75-
<div
76-
class="flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-primary font-bold text-white"
77-
>
78-
1
79-
</div>
80-
<div>
81-
<h3 class="font-semibold text-zinc-900">Discord サーバーに参加</h3>
82-
<p class="mt-1 text-sm text-zinc-500">
83-
部員同士の交流やプロジェクトの連絡は主に Discord で行っています。
84-
新歓期は自由に参加いただけます。
85-
</p>
86-
</div>
87-
</div>
88-
<div class="flex items-start gap-4">
89-
<div
90-
class="flex h-8 w-8 shrink-0 items-center justify-center rounded-full bg-primary font-bold text-white"
91-
>
92-
2
93-
</div>
94-
<div>
95-
<h3 class="font-semibold text-zinc-900">部員登録フォームを提出</h3>
96-
<p class="mt-1 text-sm text-zinc-500">
97-
新歓期に Discord で配布される部員登録フォームを提出すれば入部完了です。
98-
</p>
99-
</div>
100-
</div>
37+
<!-- Discord CTA -->
38+
{#if isRecruitmentSeason}
39+
<section class="pb-16">
40+
<div class="rounded-2xl border border-[#5865F2]/20 bg-[#5865F2]/5 p-8">
41+
<h2 class="mb-3 text-xl font-bold">Discord に参加する</h2>
42+
<p class="mb-6 text-zinc-600">
43+
活動はすべて Discord 上で行われています。イベント案内や部員登録もこちらから。
44+
</p>
45+
<a
46+
href="https://discord.gg/q3w3gfZfjy"
47+
target="_blank"
48+
rel="noopener noreferrer"
49+
class="inline-flex items-center gap-2 rounded-lg bg-[#5865F2] px-6 py-3 font-semibold text-white transition-colors hover:bg-[#4752C4]"
50+
>
51+
Discord を開く
52+
<ExternalLink class="h-4 w-4" />
53+
</a>
10154
</div>
102-
</div>
103-
<div class="mt-6 text-center">
104-
<a
105-
href="/join/welcome-events"
106-
class="inline-flex items-center gap-2 rounded-lg bg-zinc-900 px-6 py-3 text-sm font-medium text-white transition-colors hover:bg-primary hover:text-zinc-900"
107-
>
108-
新歓イベント一覧を見る
109-
</a>
55+
</section>
56+
{/if}
57+
58+
<!-- Who can join -->
59+
<section class="border-t border-zinc-100 py-16">
60+
<h2 class="mb-8 text-xl font-bold">参加できる人</h2>
61+
<div class="space-y-6 text-zinc-600">
62+
<p>大学生・大学院生であれば、どなたでも参加できます。東京大学以外の方も歓迎です。</p>
63+
<p>学年は問いません。1年生から院生まで、幅広い学年のメンバーが在籍しています。</p>
64+
<p>
65+
プログラミング経験も不問です。まったくの初心者から実務経験のある人まで、それぞれのペースで活動しています。
66+
</p>
11067
</div>
11168
</section>
11269

11370
<!-- Activities -->
114-
<section class="mb-12">
115-
<h2 class="mb-6 flex items-center gap-2 text-xl font-bold">
116-
<Heart class="h-5 w-5 text-primary" />
117-
活動について
118-
</h2>
119-
<div class="grid gap-4 sm:grid-cols-2">
120-
<div class="rounded-2xl border border-zinc-200/50 bg-white/80 backdrop-blur-md p-6">
71+
<section class="border-t border-zinc-100 py-16">
72+
<h2 class="mb-8 text-xl font-bold">主な活動</h2>
73+
<div class="space-y-8">
74+
<div>
12175
<h3 class="mb-2 font-semibold">学習会</h3>
122-
<p class="text-sm text-zinc-500">
123-
プログラミング未経験者から経験者まで、共に学び教え合う学習会を開催しています。
76+
<p class="text-zinc-600">
77+
Web開発の基礎から応用まで、部員同士で教え合いながら学んでいます。初心者向けの講習会も定期的に開催しています。
12478
</p>
12579
</div>
126-
<div class="rounded-2xl border border-zinc-200/50 bg-white/80 backdrop-blur-md p-6">
80+
<div>
12781
<h3 class="mb-2 font-semibold">プロジェクト開発</h3>
128-
<p class="text-sm text-zinc-500">
129-
大学や社会をより良くするソフトウェアを一緒に開発しています。
82+
<p class="text-zinc-600">
83+
チームでWebアプリやツールを開発しています。企画から設計、実装、運用まで一通り経験できます。
13084
</p>
13185
</div>
132-
<div class="rounded-2xl border border-zinc-200/50 bg-white/80 backdrop-blur-md p-6">
86+
<div>
13387
<h3 class="mb-2 font-semibold">交流イベント</h3>
134-
<p class="text-sm text-zinc-500">
135-
集中開発合宿やブレインストーミング大会など、様々なイベントを実施しています。
88+
<p class="text-zinc-600">
89+
開発合宿やハッカソン、ブレインストーミング大会など、楽しみながら技術を磨くイベントがあります。
13690
</p>
13791
</div>
138-
<div class="rounded-2xl border border-zinc-200/50 bg-white/80 backdrop-blur-md p-6">
92+
<div>
13993
<h3 class="mb-2 font-semibold">オンライン活動</h3>
140-
<p class="text-sm text-zinc-500">Discord を中心に、オンラインでも活発に活動しています。</p>
94+
<p class="text-zinc-600">Discord を中心に、オンラインでも活発に活動しています。</p>
14195
</div>
14296
</div>
14397
</section>
14498

145-
<!-- Contact -->
146-
<section class="mb-12">
147-
<h2 class="mb-6 text-xl font-bold">お問い合わせ</h2>
148-
<div class="rounded-2xl border border-zinc-200/50 bg-white/80 backdrop-blur-md p-6">
149-
<p class="mb-4 text-zinc-700">ご質問やお問い合わせは、以下の SNS からお気軽にどうぞ。</p>
150-
<div class="flex flex-wrap gap-4">
151-
<a
152-
href="https://github.com/ut-code"
153-
target="_blank"
154-
rel="noopener noreferrer"
155-
class="inline-flex items-center gap-2 rounded-lg border border-zinc-200 bg-white px-4 py-2 text-sm font-medium text-zinc-700 transition-colors hover:border-primary/30 hover:bg-primary/5 hover:text-primary"
156-
>
157-
<Github class="h-4 w-4" />
158-
GitHub
159-
</a>
160-
<a
161-
href="https://twitter.com/utokyo_code"
162-
target="_blank"
163-
rel="noopener noreferrer"
164-
class="inline-flex items-center gap-2 rounded-lg border border-zinc-200 bg-white px-4 py-2 text-sm font-medium text-zinc-700 transition-colors hover:border-primary/30 hover:bg-primary/5 hover:text-primary"
165-
>
166-
<Twitter class="h-4 w-4" />
167-
X (Twitter)
168-
</a>
169-
</div>
99+
<!-- How to join -->
100+
<section class="border-t border-zinc-100 py-16">
101+
<h2 class="mb-8 text-xl font-bold">入部の流れ</h2>
102+
<div class="space-y-6 text-zinc-600">
103+
<p>まずは Discord サーバーに参加してください。雰囲気を見てから決めていただいて構いません。</p>
104+
<p>
105+
正式に入部する場合は、新歓期に Discord
106+
で配布される部員登録フォームを提出してください。それだけで手続きは完了です。
107+
</p>
170108
</div>
171109
</section>
172110

173-
<!-- CTA -->
174-
<div class="rounded-2xl bg-zinc-900 p-6 text-center text-white sm:p-8">
175-
<h2 class="mb-3 text-xl font-bold sm:mb-4 sm:text-2xl">一緒にソフトウェアを作ろう</h2>
176-
<p class="mb-6 text-zinc-500">ut.code(); であなたのアイデアを形にしませんか？</p>
177-
<a
178-
href="/"
179-
class="group inline-flex items-center gap-2 rounded-lg bg-primary px-6 py-3 font-semibold text-zinc-900 transition-all hover:bg-primary/90"
180-
>
181-
トップページへ戻る
182-
<ArrowRight class="h-4 w-4 transition-transform group-hover:translate-x-0.5" />
183-
</a>
184-
</div>
111+
<!-- Contact -->
112+
<section class="border-t border-zinc-100 py-16">
113+
<h2 class="mb-8 text-xl font-bold">お問い合わせ</h2>
114+
<p class="mb-6 text-zinc-600">ご質問があれば、SNS からお気軽にどうぞ。</p>
115+
<div class="flex flex-wrap gap-4">
116+
<a
117+
href="https://twitter.com/utokyo_code"
118+
target="_blank"
119+
rel="noopener noreferrer"
120+
class="inline-flex items-center gap-2 rounded-lg border border-zinc-200 bg-white px-4 py-2 text-sm font-medium text-zinc-700 transition-colors hover:border-primary/30 hover:bg-primary/5 hover:text-primary"
121+
>
122+
<Twitter class="h-4 w-4" />
123+
X (Twitter)
124+
</a>
125+
<a
126+
href="https://github.com/ut-code"
127+
target="_blank"
128+
rel="noopener noreferrer"
129+
class="inline-flex items-center gap-2 rounded-lg border border-zinc-200 bg-white px-4 py-2 text-sm font-medium text-zinc-700 transition-colors hover:border-primary/30 hover:bg-primary/5 hover:text-primary"
130+
>
131+
<Github class="h-4 w-4" />
132+
GitHub
133+
</a>
134+
</div>
135+
</section>
185136
</div>

0 commit comments

Comments
 (0)