Skip to content

Commit 9283443

Browse files
fiveseven-lambdafiveseven-lambda
committed
Cardをコンポーネントとして分離
1 parent 4089f7b commit 9283443

File tree

2 files changed

+65
-70
lines changed

2 files changed

+65
-70
lines changed

‎src/components/Card.astro

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<div class="outer">
2+
<div class="inner">
3+
<slot />
4+
</div>
5+
</div>
6+
7+
<style>
8+
.outer {
9+
padding: .5em;
10+
}
11+
.inner {
12+
background-color: white;
13+
padding: .5em 1em;
14+
border-radius: 16px;
15+
}
16+
</style>

‎src/pages/index.astro

Lines changed: 49 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
---
22
import Layout from '../layouts/Layout.astro';
3+
import Card from '../components/Card.astro';
34
---
45

56
<Layout>
@@ -8,68 +9,54 @@ import Layout from '../layouts/Layout.astro';
89
</header>
910
<div class="background">
1011
<main>
11-
<div class="card-outer">
12-
<div class="card-inner">
13-
<h2>とが</h2>
14-
<p>一応、名前のアクセントは「<span class="underline">と</span> <span class="overline">が」</span>のつもりです（「水」と同じ平板型）。</p>
15-
<p>「<span class="overline endline">と</span> <span class="underline">が</span>」や「<span class="underline">と</span> <span class="overline endline">が</span>」ではありません。</p>
16-
</div>
17-
</div>
18-
<div class="card-outer">
19-
<div class="card-inner">
20-
<h2>アイコン</h2>
21-
<img width="108px" src="favicon.jpg"/>
22-
<p><a href="https://x.com/Cafrette">@Cafrette</a> さんに書いていただきました。</p>
23-
</div>
24-
</div>
25-
<div class="card-outer">
26-
<div class="card-inner">
27-
<h2>OSS Contribution</h2>
28-
<p>Rust や Python ライブラリ SciPy などに貢献しています．</p>
29-
</div>
30-
</div>
31-
<div class="card-outer">
32-
<div class="card-inner">
33-
<h2>競プロ</h2>
34-
<p>使用言語：C / C++ / Rust</p>
35-
<p><a href="https://atcoder.jp/users/toga57">AtCoder</a>, <a href="https://codeforces.com/profile/57tggx">Codeforces</a></p>
36-
<ul>
37-
<li>PCK 2017 … 本選出場（失われた太陽を求めて）</li>
38-
<li>JOI 2018 … 本選出場</li>
39-
<li>ICPC 2019 … アジア横浜地区大会出場（<b>t</b>hx_yucpc）</li>
40-
<li>ICPC 2021 … アジア横浜地区大会出場（<b>t</b>oxic）</li>
41-
<li>ICPC 2022 … アジア横浜地区大会出場（h<b>a</b>unting）</li>
42-
</ul>
43-
</div>
44-
</div>
45-
<div class="card-outer">
46-
<div class="card-inner">
47-
<h2>研究</h2>
48-
<p>主に統計や AI をやっています。</p>
49-
<p>Atsushi Komaba, Hisashi Johno, and Kazunori Nakamoto. A novel statistical approach for two-sample testing based on the overlap coefficient. <i>Journal of Mathematical Sciences, The University of Tokyo</i>, 30(2):205–240, 2023.</p>
50-
<p>Ryota Tozuka, Hisashi Johno, Akitomo Amakawa, Junichi Sato, Mizuki Muto, Shoichiro Seki, Atsushi Komaba, and Hiroshi Onishi. Application of NotebookLM, a large language model with retrieval‑augmented generation, for lung cancer staging. <i>Japanese Journal of Radiology</i>, 2024. Online ahead of print.</p>
51-
<p>他に日本磁気共鳴医学会、医療の質・安全学会など。</p>
52-
</div>
53-
</div>
54-
<div class="card-outer">
55-
<div class="card-inner">
56-
<h2>登山</h2>
57-
<p>一番印象に残っているのは槍ヶ岳（2022 年 9 月）です。</p>
58-
<p>他に北岳（2022 年 7 月）、鳳凰三山（2023 年 8 月）、富士山（2024 年 7 月）、赤岳（2025 年 2 月）など。</p>
59-
</div>
60-
</div>
61-
<div class="card-outer">
62-
<div class="card-inner">
63-
<h2>リンク</h2>
64-
<ul>
65-
<li>X: <a href="https://x.com/57tggx">@57tggx</a></li>
66-
<li>Misskey: <a href="https://misskey.io/@five_seven">@[email protected]</a> <a href="https://sushi.ski/@57">@[email protected]</a></li>
67-
<li>GitHub: <a href="https://github.com/fiveseven-lambda/">fiveseven-lambda</a></li>
68-
<li>Zenn: <a href="https://zenn.dev/">toga</a></li>
69-
<li>ORCID: <a href="https://orcid.org/0000-0002-4935-3945">0000-0002-4935-3945</a></li>
70-
</ul>
71-
</div>
72-
</div>
12+
<Card>
13+
<h2>とが</h2>
14+
<p>一応、名前のアクセントは「<span class="underline">と</span> <span class="overline">が」</span>のつもりです（「水」と同じ平板型）。</p>
15+
<p>「<span class="overline endline">と</span> <span class="underline">が</span>」や「<span class="underline">と</span> <span class="overline endline">が</span>」ではありません。</p>
16+
</Card>
17+
<Card>
18+
<h2>アイコン</h2>
19+
<img width="108px" src="favicon.jpg"/>
20+
<p><a href="https://x.com/Cafrette">@Cafrette</a> さんに書いていただきました。</p>
21+
</Card>
22+
<Card>
23+
<h2>OSS Contribution</h2>
24+
<p>Rust や Python ライブラリ SciPy などに貢献しています．</p>
25+
</Card>
26+
<Card>
27+
<h2>競プロ</h2>
28+
<p>使用言語：C / C++ / Rust</p>
29+
<p><a href="https://atcoder.jp/users/toga57">AtCoder</a>, <a href="https://codeforces.com/profile/57tggx">Codeforces</a></p>
30+
<ul>
31+
<li>PCK 2017 … 本選出場（失われた太陽を求めて）</li>
32+
<li>JOI 2018 … 本選出場</li>
33+
<li>ICPC 2019 … アジア横浜地区大会出場（<b>t</b>hx_yucpc）</li>
34+
<li>ICPC 2021 … アジア横浜地区大会出場（<b>t</b>oxic）</li>
35+
<li>ICPC 2022 … アジア横浜地区大会出場（h<b>a</b>unting）</li>
36+
</ul>
37+
</Card>
38+
<Card>
39+
<h2>研究</h2>
40+
<p>主に統計や AI をやっています。</p>
41+
<p>Atsushi Komaba, Hisashi Johno, and Kazunori Nakamoto. A novel statistical approach for two-sample testing based on the overlap coefficient. <i>Journal of Mathematical Sciences, The University of Tokyo</i>, 30(2):205–240, 2023.</p>
42+
<p>Ryota Tozuka, Hisashi Johno, Akitomo Amakawa, Junichi Sato, Mizuki Muto, Shoichiro Seki, Atsushi Komaba, and Hiroshi Onishi. Application of NotebookLM, a large language model with retrieval‑augmented generation, for lung cancer staging. <i>Japanese Journal of Radiology</i>, 2024. Online ahead of print.</p>
43+
<p>他に日本磁気共鳴医学会、医療の質・安全学会など。</p>
44+
</Card>
45+
<Card>
46+
<h2>登山</h2>
47+
<p>一番印象に残っているのは槍ヶ岳（2022 年 9 月）です。</p>
48+
<p>他に北岳（2022 年 7 月）、鳳凰三山（2023 年 8 月）、富士山（2024 年 7 月）、赤岳（2025 年 2 月）など。</p>
49+
</Card>
50+
<Card>
51+
<h2>リンク</h2>
52+
<ul>
53+
<li>X: <a href="https://x.com/57tggx">@57tggx</a></li>
54+
<li>Misskey: <a href="https://misskey.io/@five_seven">@[email protected]</a> <a href="https://sushi.ski/@57">@[email protected]</a></li>
55+
<li>GitHub: <a href="https://github.com/fiveseven-lambda/">fiveseven-lambda</a></li>
56+
<li>Zenn: <a href="https://zenn.dev/">toga</a></li>
57+
<li>ORCID: <a href="https://orcid.org/0000-0002-4935-3945">0000-0002-4935-3945</a></li>
58+
</ul>
59+
</Card>
7360
</main>
7461
</div>
7562
<footer>
@@ -118,14 +105,6 @@ import Layout from '../layouts/Layout.astro';
118105
}
119106
}
120107

121-
.card-outer {
122-
padding: .5em;
123-
}
124-
.card-inner {
125-
background-color: white;
126-
padding: .5em 1em;
127-
border-radius: 16px;
128-
}
129108
h2, p {
130109
margin: .3em;
131110
}

0 commit comments

Comments
 (0)