💄 手直し

92thunder · Feb 11, 2024 · 8c5aeb4 · 8c5aeb4
1 parent 227d848
commit 8c5aeb4
Show file tree

Hide file tree

Showing 5 changed files with 55 additions and 48 deletions.
diff --git a/pages/about.tsx b/pages/about.tsx
@@ -1,4 +1,4 @@
-import { Box, Heading, Text } from "@chakra-ui/react"
+import { Box, Container, Heading, Text } from "@chakra-ui/react"
 import { NextPage } from "next"
 import { Header } from "../components/Header"
 import { Career } from "../components/Career"
@@ -7,18 +7,20 @@ const About: NextPage = () => {
 	return (
 		<>
 			<Header />
-			<Box maxW="800px">
-				<Box p="24px" mt="2rem" as="dl">
-					<Heading as="dt" color="brand.accent">
-						About me
-					</Heading>
-					<Text as="dd" mt="1rem">
-						フロントエンドエンジニアとしてテックタッチ株式会社で働いています。
-						DevOpsに強い興味があり、より良いプロダクトを作れる文化や基盤作りにも取り組んでいます。
-					</Text>
+			<Container maxW="container.xl">
+				<Box maxW="800px">
+					<Box p="24px" mt="2rem" as="dl">
+						<Heading as="dt" color="brand.accent">
+							About me
+						</Heading>
+						<Text as="dd" mt="1rem">
+							フロントエンドエンジニアとしてテックタッチ株式会社で働いています。
+							DevOpsに強い興味があり、より良いプロダクトを作れる文化や基盤作りにも取り組んでいます。
+						</Text>
+					</Box>
+					<Career />
 				</Box>
-				<Career />
-			</Box>
+			</Container>
 		</>
 	)
 }

diff --git a/pages/blog/[id].tsx b/pages/blog/[id].tsx
@@ -1,6 +1,7 @@
 import { GetStaticProps, InferGetStaticPropsType, NextPage } from "next"
 import {
 	Box,
+	Container,
 	Divider,
 	HStack,
 	Heading,
@@ -123,36 +124,38 @@ const PostPage: NextPage = ({
 				<meta content="https://92thunder.dev/ogp.png" property="og:image" />
 			</Head>
 			<Header />
-			<Box p="24px" pt="2rem">
-				<VStack alignItems="start" gap={10}>
-					<VStack alignItems="start">
-						<Heading
-							as="h1"
-							fontWeight="bold"
-							size="lg"
-							sx={{ wordBreak: "auto-phrase" }}
-						>
-							{post.title}
-						</Heading>
-						<Text color="gray.400">{post.publishedAt}</Text>
-					</VStack>
-					<HStack alignItems="start" gap={2} maxW="100%">
-						<TableOfContents markdown={post.body} />
-						<Box flexGrow="1" overflow="hidden" mt="-10px">
-							<ReactMarkdown
-								components={ChakraUIRenderer(theme)}
-								plugins={[remarkGfm]}
-								skipHtml={false}
+			<Container maxW="container.xl">
+				<Box p="24px" pt="2rem">
+					<VStack alignItems="start" gap={10}>
+						<VStack alignItems="start">
+							<Heading
+								as="h1"
+								fontWeight="bold"
+								size="lg"
+								sx={{ wordBreak: "auto-phrase" }}
 							>
-								{post.body}
-							</ReactMarkdown>
-							<Box mt={20}>
-								<ShareButtons title={post.title} />
+								{post.title}
+							</Heading>
+							<Text color="gray.400">{post.publishedAt}</Text>
+						</VStack>
+						<HStack alignItems="start" gap={2} maxW="100%">
+							<Box flexGrow="1" overflow="hidden" mt="-10px">
+								<ReactMarkdown
+									components={ChakraUIRenderer(theme)}
+									plugins={[remarkGfm]}
+									skipHtml={false}
+								>
+									{post.body}
+								</ReactMarkdown>
+								<Box mt={20}>
+									<ShareButtons title={post.title} />
+								</Box>
 							</Box>
-						</Box>
-					</HStack>
-				</VStack>
-			</Box>
+							<TableOfContents markdown={post.body} />
+						</HStack>
+					</VStack>
+				</Box>
+			</Container>
 		</>
 	)
 }

diff --git a/pages/blog/index.tsx b/pages/blog/index.tsx
@@ -4,7 +4,7 @@ import { Posts } from "../../components/Posts"
 import { getPosts } from "../../libs/postRepository"
 import { Post } from "../../types"
 import { generateFeed } from "../../libs/generateFeed"
-import { Box, VStack } from "@chakra-ui/react"
+import { Box, Container, VStack } from "@chakra-ui/react"
 import { Header } from "../../components/Header"
 
 export const getStaticProps: GetStaticProps = async () => {
@@ -48,11 +48,13 @@ const Blog: NextPage = ({
 			</Head>
 
 			<Header />
-			<Box p="24px" pt="2rem" w="100%" as="main">
-				<VStack alignItems="start" spacing="16px">
-					<Posts posts={posts} />
-				</VStack>
-			</Box>
+			<Container maxW="container.xl">
+				<Box p="24px" pt="2rem" w="100%" as="main">
+					<VStack alignItems="start" spacing="16px">
+						<Posts posts={posts} />
+					</VStack>
+				</Box>
+			</Container>
 		</>
 	)
 }

diff --git a/posts/2024-01-24.md b/posts/2024-01-24.md
@@ -8,7 +8,7 @@ Playwright で `test()` 内でマウントしているコンポーネントに
 
 ## 原因
 
-Playwright では、テスト自体は Node.js として実行され、コンポーネントは実際のブラウザで実行される仕組みとなっている。テストでは Node.js の全ての機能が使用できるが、Node.jsとして実行している部分で読み込んだファイルのオブジェクトをコンポーネントの Props として渡すことができない。
+Playwright では、テスト自体は Node.js として実行され、コンポーネントは実際のブラウザで実行される仕組みとなっている。テストでは Node.js の全ての機能が使用できるが、Node.js として実行している部分で読み込んだファイルのオブジェクトをコンポーネントの Props として渡すことができない。
 
 公式ドキュメントはこちら
 

diff --git a/posts/2024-02-11/post.md b/posts/2024-02-11/post.md
@@ -1,4 +1,4 @@
-会社のオフサイトミーティングへ参加して、翌日に立ち寄った東京の美術館で刺激を受け、トップページのデザインを作り直した。
+会社のオフサイトミーティングへ参加後、翌日に立ち寄った東京の美術館で刺激を受け、トップページのデザインを作り直した。
 
 ---