fix: バナーの文言とスタイルを修正

Author: 3w36zj6

website/package.json

@@ -1,5 +1,6 @@
 {
 	"private": true,
+	"version": "0.13.1",
 	"type": "module",
 	"scripts": {
 		"dev": "vite dev",

website/src/components/ui/common/SiteNoticeBanner.tsx

@@ -1,8 +1,11 @@
 import {
 	discordServerUrl,
+	githubOrganizationUrl,
 	githubRepositoryUrl,
 	typstOfficialDocsUrl,
+	version,
 } from "../../../metadata";
+import { InfoCircleIcon } from "../../icons";
 
 export const SiteNoticeBanner = () => {
 	return (
@@ -36,72 +39,39 @@ export const SiteNoticeBanner = () => {
 		>
 			<div class="prose relative flex flex-col sm:flex-row items-start w-full px-3 sm:px-12 mx-auto max-w-7xl flex-wrap">
 				<div class="flex flex-col sm:flex-row w-full text-xs leading-6 text-black duration-150 ease-out opacity-80 hover:opacity-100 gap-3">
-					<span class="flex items-center flex-shrink-0">
-						<svg
-							class="w-4 h-4 mr-2"
-							viewBox="0 0 24 24"
-							fill="none"
-							stroke="currentColor"
-						>
-							<title>Warning</title>
-							<path
-								d="M12 3L2 21h20L12 3z"
-								stroke="currentColor"
-								strokeWidth="1.5"
-							/>
-							<rect
-								x="11"
-								y="9"
-								width="2"
-								height="5"
-								rx="1"
-								stroke="none"
-								fill="currentColor"
-							/>
-							<rect
-								x="11"
-								y="16"
-								width="2"
-								height="2"
-								rx="1"
-								stroke="none"
-								fill="currentColor"
-							/>
-						</svg>
-						<strong>注意 / Warning</strong>
+					<span class="flex items-center flex-shrink-0 gap-2">
+						<div class="w-4 h-4">
+							<InfoCircleIcon />
+						</div>
+						<strong>情報 / Info</strong>
 					</span>
 					<span class="hidden sm:flex items-center">
 						<span class="inline-block w-px h-12 bg-neutral-200 mx-3" />
 					</span>
 					<span class="block flex-1 pt-1 pb-2 leading-normal sm:inline sm:pt-0 sm:pb-0">
-						当サイトは、
-						<a href={typstOfficialDocsUrl}>Typst v0.13.1 公式ドキュメント</a>
-						を、日本語コミュニティが非公式に翻訳したものです。誤訳・未訳・古い情報が含まれている可能性があるため、
-						<a href={typstOfficialDocsUrl}>公式ドキュメント</a>
-						との併用を推奨します。このサイトの内容に誤りを発見された方は、
-						<a href={githubRepositoryUrl}>
-							GitHubリポジトリまでご報告を頂けましたら幸いです
-						</a>
-						。我々のコミュニティにご興味のある方は、ぜひ
-						<a href={discordServerUrl}>
-							非公式Discordサーバー「くみはんクラブ」
+						当サイトは、Typst GmbHの許諾を得て、日本語コミュニティ「
+						<a href={githubOrganizationUrl}>Typst Japan Community</a>」が
+						<a href={typstOfficialDocsUrl}>
+							Typst v{version}の公式ドキュメント
 						</a>
-						にご参加ください。
+						を翻訳したものです。誤訳や古い情報が含まれている可能性があるため、
+						<a href={typstOfficialDocsUrl}>公式ドキュメント</a>
+						との併用を推奨します。翻訳の改善やサイトの機能向上について、
+						<a href={githubRepositoryUrl}>GitHub</a>でのIssueやPull
+						Requestを歓迎します。コミュニティにご興味のある方は
+						<a href={discordServerUrl}>Discordサーバー「くみはんクラブ」</a>
+						にぜひご参加ください。
 						<br />
-						This site provides an unofficial translation of the
-						<a href={typstOfficialDocsUrl}>Typst v0.13.1 documentation</a>
-						by the Japanese Community. Please note that there may be some
-						inaccuracies, untranslated sections or outdated information. We
-						highly recommend referring to
-						<a href={typstOfficialDocsUrl}>the latest official documentation</a>
-						as well. If you find any errors in the content,
-						<a href={githubRepositoryUrl}>
-							please let us know through our GitHub repository.
-						</a>
-						If you are interested in our community, feel free to join
-						<a href={discordServerUrl}>
-							our unofficial Discord server, "Kumihan Club."
-						</a>
+						This site provides a Japanese translation of the{" "}
+						<a href={typstOfficialDocsUrl}>Typst v{version} documentation</a>{" "}
+						maintained by the "
+						<a href={githubOrganizationUrl}>Typst Japan Community</a>" with
+						permission from Typst GmbH. We recommend using this alongside the{" "}
+						<a href={typstOfficialDocsUrl}>official documentation</a>. We
+						welcome contributions through Issues and Pull Requests on{" "}
+						<a href={githubRepositoryUrl}>our GitHub repository</a> for both
+						translation improvements and website enhancements. Feel free to join{" "}
+						<a href={discordServerUrl}>our Discord server "Kumihan Club"</a>.
 					</span>
 				</div>
 			</div>

website/src/metadata.ts

@@ -1,3 +1,6 @@
+import { version } from "../package.json";
+
+export { version };
 export const typstOfficialUrl = "https://typst.app";
 export const typstOfficialDocsUrl = "https://typst.app/docs";
 export const githubOrganizationUrl = "https://github.com/typst-jp";