1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
|
import "./index.css";
import { useC } from "~src/common";
import Page from "~src/components/Page";
interface Credit {
name: string;
url: string;
}
type Credits = Credit[];
const frontendCredits: Credits = [
{
name: "react.js",
url: "https://reactjs.org",
},
{
name: "typescript",
url: "https://www.typescriptlang.org",
},
{
name: "bootstrap",
url: "https://getbootstrap.com",
},
{
name: "parcel.js",
url: "https://parceljs.org",
},
{
name: "eslint",
url: "https://eslint.org",
},
{
name: "prettier",
url: "https://prettier.io",
},
];
const backendCredits: Credits = [
{
name: "ASP.NET Core",
url: "https://dotnet.microsoft.com/learn/aspnet/what-is-aspnet-core",
},
{ name: "sqlite", url: "https://sqlite.org" },
{
name: "ImageSharp",
url: "https://github.com/SixLabors/ImageSharp",
},
];
export default function AboutPage() {
const c = useC();
return (
<Page className="about-page">
<h2>{c("about.credits.title")}</h2>
<p>{c("about.credits.content")}</p>
<h3>{c("about.credits.frontend")}</h3>
<ul>
{frontendCredits.map((item, index) => {
return (
<li key={index}>
<a href={item.url} target="_blank" rel="noopener noreferrer">
{item.name}
</a>
</li>
);
})}
<li>...</li>
</ul>
<h3>{c("about.credits.backend")}</h3>
<ul>
{backendCredits.map((item, index) => {
return (
<li key={index}>
<a href={item.url} target="_blank" rel="noopener noreferrer">
{item.name}
</a>
</li>
);
})}
<li>...</li>
</ul>
</Page>
);
}
|
