Skip to content

Commit 754108a

Browse files
staticWagomUstaticWagomU
committed
feat: スポンサーセクションを作成
1 parent d09be0c commit 754108a

File tree

2 files changed

+104
-237
lines changed

2 files changed

+104
-237
lines changed

‎2025/src/components/Sponsors/index.astro‎

Lines changed: 102 additions & 237 deletions
Original file line numberDiff line numberDiff line change
@@ -6,251 +6,116 @@
66
</h2>
77
<div class="mx-auto h-1 w-16 bg-emerald-500"></div>
88
</div>
9-
<div class="mb-10">
10-
<h3 class="mb-6 text-center text-xl font-semibold md:text-2xl">
11-
企業スポンサー
12-
</h3>
13-
<div class="space-y-10">
14-
<div class="space-y-6">
15-
<h4 class="text-center text-lg font-medium">プラチナ</h4>
16-
<div
17-
class="grid grid-cols-1 justify-items-center gap-8 md:grid-cols-2"
18-
>
19-
<div class="flex flex-col items-center">
20-
<div class="mb-3 flex h-24 items-center justify-center md:h-32">
21-
<img
22-
alt="Acme Inc."
23-
class="max-h-full max-w-full object-contain"
24-
/>
25-
</div>
26-
<h4 class="text-base font-medium text-gray-800 md:text-lg">
27-
Acme Inc.
28-
</h4>
29-
</div>
30-
<div class="flex flex-col items-center">
31-
<div class="mb-3 flex h-24 items-center justify-center md:h-32">
32-
<img
33-
alt="TechCorp"
34-
class="max-h-full max-w-full object-contain"
35-
/>
36-
</div>
37-
<h4 class="text-base font-medium text-gray-800 md:text-lg">
38-
TechCorp
39-
</h4>
40-
</div>
41-
</div>
42-
</div>
43-
<div class="space-y-6">
44-
<h4 class="text-center text-lg font-medium">ゴールド</h4>
45-
<div
46-
class="grid grid-cols-2 justify-items-center gap-6 md:grid-cols-3"
47-
>
48-
<div class="flex flex-col items-center">
49-
<div class="mb-2 flex h-20 items-center justify-center md:h-24">
50-
<img
51-
alt="DevSolutions"
52-
class="max-h-full max-w-full object-contain"
53-
/>
54-
</div>
55-
<h4 class="text-sm font-medium text-gray-800 md:text-base">
56-
DevSolutions
57-
</h4>
58-
</div>
59-
<div class="flex flex-col items-center">
60-
<div class="mb-2 flex h-20 items-center justify-center md:h-24">
61-
<img
62-
alt="CodeMasters"
63-
class="max-h-full max-w-full object-contain"
64-
/>
65-
</div>
66-
<h4 class="text-sm font-medium text-gray-800 md:text-base">
67-
CodeMasters
68-
</h4>
69-
</div>
70-
</div>
71-
</div>
72-
<div class="space-y-6">
73-
<h4 class="text-center text-lg font-medium">シルバー</h4>
74-
<div
75-
class="grid grid-cols-3 justify-items-center gap-4 md:grid-cols-4"
76-
>
77-
<div class="flex flex-col items-center">
78-
<div class="mb-2 flex h-12 items-center justify-center md:h-16">
79-
<img
80-
alt="ByteWorks"
81-
class="max-h-full max-w-full object-contain"
82-
/>
9+
10+
<div class="mx-auto mb-12 max-w-4xl">
11+
<div
12+
class="mb-8 rounded-lg border border-emerald-100 bg-card text-card-foreground shadow-sm"
13+
>
14+
<div class="p-6 md:p-8">
15+
<div class="mb-6">
16+
<h3
17+
class="mb-4 flex items-center text-xl font-bold text-gray-800 md:text-2xl"
18+
>
19+
<svg
20+
xmlns="http://www.w3.org/2000/svg"
21+
width="24"
22+
height="24"
23+
viewBox="0 0 24 24"
24+
fill="none"
25+
stroke="currentColor"
26+
stroke-width="2"
27+
stroke-linecap="round"
28+
stroke-linejoin="round"
29+
class="lucide lucide-heart mr-2 h-6 w-6 text-emerald-600"
30+
><path
31+
d="M19 14c1.49-1.46 3-3.21 3-5.5A5.5 5.5 0 0 0 16.5 3c-1.76 0-3 .5-4.5 2-1.5-1.5-2.74-2-4.5-2A5.5 5.5 0 0 0 2 8.5c0 2.3 1.5 4.05 3 5.5l7 7Z"
32+
></path></svg
33+
>なぜスポンサーが必要なのか？
34+
</h3><p class="leading-relaxed text-gray-700">
35+
VimConf
36+
2025は、普段なかなか顔を合わせられないVimmer同士が情熱を交わし、知見を共有するための貴重な場です。今年は、イベント継続の担保と柔軟な運営のため、必要な資金をスポンサー様のご支援で集める仕組みを採用します。
37+
</p>
38+
</div><div class="mb-6">
39+
<h3 class="mb-4 text-xl font-bold text-gray-800 md:text-2xl">
40+
スポンサーシップ概要
41+
</h3><div class="grid gap-6 md:grid-cols-2">
42+
<div>
43+
<h4
44+
class="mb-3 flex items-center text-lg font-semibold text-gray-800"
45+
>
46+
<svg
47+
xmlns="http://www.w3.org/2000/svg"
48+
width="24"
49+
height="24"
50+
viewBox="0 0 24 24"
51+
fill="none"
52+
stroke="currentColor"
53+
stroke-width="2"
54+
stroke-linecap="round"
55+
stroke-linejoin="round"
56+
class="lucide lucide-calendar mr-2 h-5 w-5 text-emerald-600"
57+
><path d="M8 2v4"></path><path d="M16 2v4"></path><rect
58+
width="18"
59+
height="18"
60+
x="3"
61+
y="4"
62+
rx="2"></rect><path d="M3 10h18"></path></svg
63+
>募集期間
64+
</h4><p class="text-gray-700">2025年09月01日（月）</p>
8365
</div>
84-
<h4
85-
class="text-center text-xs font-medium text-gray-800 md:text-sm"
86-
>
87-
ByteWorks
88-
</h4>
89-
</div>
90-
<div class="flex flex-col items-center">
91-
<div class="mb-2 flex h-12 items-center justify-center md:h-16">
92-
<img
93-
alt="EditPro"
94-
class="max-h-full max-w-full object-contain"
95-
/>
66+
<div>
67+
<h4
68+
class="mb-3 flex items-center text-lg font-semibold text-gray-800"
69+
>
70+
<svg
71+
xmlns="http://www.w3.org/2000/svg"
72+
width="24"
73+
height="24"
74+
viewBox="0 0 24 24"
75+
fill="none"
76+
stroke="currentColor"
77+
stroke-width="2"
78+
stroke-linecap="round"
79+
stroke-linejoin="round"
80+
class="lucide lucide-gift mr-2 h-5 w-5 text-emerald-600"
81+
><rect x="3" y="8" width="18" height="4" rx="1"></rect><path
82+
d="M12 8v13"></path><path
83+
d="M19 12v7a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2v-7"></path><path
84+
d="M7.5 8a2.5 2.5 0 0 1 0-5A4.8 8 0 0 1 12 8a4.8 8 0 0 1 4.5-5 2.5 2.5 0 0 1 0 5"
85+
></path></svg
86+
>ご提供いただく支援
87+
</h4><p class="mb-3 text-gray-700">
88+
スポンサーシップに応じたメリットを用意しています：
89+
</p><ul class="mb-3 space-y-1 text-gray-700">
90+
<li>• 公式サイトでのロゴ掲載</li><li>
91+
• ノベルティの配布
92+
</li><li>• バックパネルへのロゴ掲載</li>
93+
</ul><p class="mb-3 text-gray-700">
94+
イベント開催のための資金として、ぜひご協力ください。
95+
</p><p class="text-sm text-gray-600">
96+
また、併せて個人による寄付の募集も行っています。（開催されなかった場合でも返金不可）
97+
</p>
9698
</div>
97-
<h4
98-
class="text-center text-xs font-medium text-gray-800 md:text-sm"
99-
>
100-
EditPro
101-
</h4>
10299
</div>
103-
<div class="flex flex-col items-center">
104-
<div class="mb-2 flex h-12 items-center justify-center md:h-16">
105-
<img
106-
alt="VimTools"
107-
class="max-h-full max-w-full object-contain"
108-
/>
109-
</div>
110-
<h4
111-
class="text-center text-xs font-medium text-gray-800 md:text-sm"
100+
</div><div class="text-center">
101+
<p class="mb-4 text-gray-700">
102+
ご支援いただける方は、以下のリンクからお願いいたします。
103+
</p><div class="flex flex-col justify-center gap-3 sm:flex-row">
104+
<button
105+
class="inline-flex h-10 items-center justify-center gap-2 rounded-md bg-emerald-600 px-4 py-2 text-sm font-medium whitespace-nowrap text-primary-foreground ring-offset-background transition-colors hover:bg-emerald-700 focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0"
106+
><a
107+
href="https://vimconf.booth.pm/"
108+
target="_blank"
109+
rel="noopener noreferrer">寄付する</a
110+
></button
112111
>
113-
VimTools
114-
</h4>
115-
</div>
116-
</div>
117-
</div>
118-
</div>
119-
</div>
120-
<div class="mb-8">
121-
<h3 class="mb-6 text-center text-xl font-semibold md:text-2xl">
122-
個人スポンサー
123-
</h3>
124-
<div class="rounded-lg bg-emerald-50 p-4 md:p-6">
125-
<div class="flex flex-wrap justify-center gap-4">
126-
<div class="flex flex-col items-center">
127-
<div
128-
class="mb-1 h-12 w-12 overflow-hidden rounded-full bg-white shadow-sm md:h-16 md:w-16"
129-
>
130-
<img alt="田中一郎" class="h-full w-full object-cover" />
131-
</div>
132-
<span class="text-center text-xs font-medium md:text-sm"
133-
>田中一郎</span
134-
>
135-
</div>
136-
<div class="flex flex-col items-center">
137-
<div
138-
class="mb-1 h-12 w-12 overflow-hidden rounded-full bg-white shadow-sm md:h-16 md:w-16"
139-
>
140-
<img alt="John Doe" class="h-full w-full object-cover" />
141-
</div>
142-
<span class="text-center text-xs font-medium md:text-sm"
143-
>John Doe</span
144-
>
145-
</div>
146-
<div class="flex flex-col items-center">
147-
<div
148-
class="mb-1 h-12 w-12 overflow-hidden rounded-full bg-white shadow-sm md:h-16 md:w-16"
149-
>
150-
<img alt="鈴木花子" class="h-full w-full object-cover" />
151-
</div>
152-
<span class="text-center text-xs font-medium md:text-sm"
153-
>鈴木花子</span
154-
>
155-
</div>
156-
<div class="flex flex-col items-center">
157-
<div
158-
class="mb-1 h-12 w-12 overflow-hidden rounded-full bg-white shadow-sm md:h-16 md:w-16"
159-
>
160-
<img alt="Jane Smith" class="h-full w-full object-cover" />
161112
</div>
162-
<span class="text-center text-xs font-medium md:text-sm"
163-
>Jane Smith</span
164-
>
165-
</div>
166-
<div class="flex flex-col items-center">
167-
<div
168-
class="mb-1 h-12 w-12 overflow-hidden rounded-full bg-white shadow-sm md:h-16 md:w-16"
169-
>
170-
<img alt="佐藤健太" class="h-full w-full object-cover" />
171-
</div>
172-
<span class="text-center text-xs font-medium md:text-sm"
173-
>佐藤健太</span
174-
>
175-
</div>
176-
<div class="flex flex-col items-center">
177-
<div
178-
class="mb-1 h-12 w-12 overflow-hidden rounded-full bg-white shadow-sm md:h-16 md:w-16"
179-
>
180-
<img alt="Alex Johnson" class="h-full w-full object-cover" />
181-
</div>
182-
<span class="text-center text-xs font-medium md:text-sm"
183-
>Alex Johnson</span
184-
>
185-
</div>
186-
<div class="flex flex-col items-center">
187-
<div
188-
class="mb-1 h-12 w-12 overflow-hidden rounded-full bg-white shadow-sm md:h-16 md:w-16"
189-
>
190-
<img alt="山田太郎" class="h-full w-full object-cover" />
191-
</div>
192-
<span class="text-center text-xs font-medium md:text-sm"
193-
>山田太郎</span
194-
>
195-
</div>
196-
<div class="flex flex-col items-center">
197-
<div
198-
class="mb-1 h-12 w-12 overflow-hidden rounded-full bg-white shadow-sm md:h-16 md:w-16"
199-
>
200-
<img alt="Emily Brown" class="h-full w-full object-cover" />
201-
</div>
202-
<span class="text-center text-xs font-medium md:text-sm"
203-
>Emily Brown</span
204-
>
205-
</div>
206-
<div class="flex flex-col items-center">
207-
<div
208-
class="mb-1 h-12 w-12 overflow-hidden rounded-full bg-white shadow-sm md:h-16 md:w-16"
209-
>
210-
<img alt="伊藤直子" class="h-full w-full object-cover" />
211-
</div>
212-
<span class="text-center text-xs font-medium md:text-sm"
213-
>伊藤直子</span
214-
>
215-
</div>
216-
<div class="flex flex-col items-center">
217-
<div
218-
class="mb-1 h-12 w-12 overflow-hidden rounded-full bg-white shadow-sm md:h-16 md:w-16"
219-
>
220-
<img alt="Michael Wilson" class="h-full w-full object-cover" />
221-
</div>
222-
<span class="text-center text-xs font-medium md:text-sm"
223-
>Michael Wilson</span
224-
>
225-
</div>
226-
<div class="flex flex-col items-center">
227-
<div
228-
class="mb-1 h-12 w-12 overflow-hidden rounded-full bg-white shadow-sm md:h-16 md:w-16"
229-
>
230-
<img alt="高橋誠" class="h-full w-full object-cover" />
231-
</div>
232-
<span class="text-center text-xs font-medium md:text-sm"
233-
>高橋誠</span
234-
>
235-
</div>
236-
<div class="flex flex-col items-center">
237-
<div
238-
class="mb-1 h-12 w-12 overflow-hidden rounded-full bg-white shadow-sm md:h-16 md:w-16"
239-
>
240-
<img alt="Sarah Davis" class="h-full w-full object-cover" />
241-
</div>
242-
<span class="text-center text-xs font-medium md:text-sm"
243-
>Sarah Davis</span
244-
>
113+
<p class="mt-4 text-sm text-gray-600">
114+
初の試みですので、ご不明な点やご質問があればご遠慮なくお問い合わせください。
115+
</p>
245116
</div>
246117
</div>
247118
</div>
248119
</div>
249-
<div class="text-center">
250-
<button
251-
class="inline-flex h-10 items-center justify-center gap-2 rounded-md bg-emerald-600 px-4 py-2 text-sm font-medium whitespace-nowrap text-primary-foreground ring-offset-background transition-colors hover:bg-emerald-700 focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:outline-none disabled:pointer-events-none disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0"
252-
>Become a Sponsor</button
253-
>
254-
</div>
255120
</div>
256121
</section>

‎2025/src/pages/[lang]/index.astro‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
import AboutVimConf from "../../components/AboutVimConf.astro";
33
import KeynoteSpeakers from "../../components/KeynoteSpeakers.astro";
44
import Schedule from "../../components/Schedule.astro";
5+
import Sponsors from "../../components/Sponsors/index.astro";
56
import Staff from "../../components/Staff/index.astro";
67
import Top from "../../components/Top.astro";
78
import Venue from "../../components/Venue.astro";
@@ -22,6 +23,7 @@ export function getStaticPaths() {
2223
<Venue />
2324
<AboutVimConf />
2425
<Schedule />
26+
<Sponsors />
2527
<Staff />
2628
</main>
2729
</Layout>

0 commit comments

Comments
 (0)