Apply Prettier Change

src/components/NavigationContent.tsx

@@ -44,7 +44,7 @@ const NavLink = styled.a.attrs(({ current }: { current: boolean }) => ({
 `;
 const NavigationData = [
   { title: 'ホーム', pathname: '/' },
-  {title: '色のコントラスト比', pathname: '/contrast/'},
+  { title: '色のコントラスト比', pathname: '/contrast/' },
   { title: 'キーボードで操作してみよう', pathname: '/keyboard/' },
   { title: 'スクリーンリーダーを使ってみよう', pathname: '/screen-reader/' },
   { title: '画像', pathname: '/image/' },

src/pages/contrast.mdx

@@ -26,13 +26,13 @@ import { Title } from '/src/components/Title';
   </p>
 </ExampleContainer>
 
-freeeのガイドラインでは、テキストについて4.5:1以上のコントラスト比を満たすことを求めています（[コントラスト比の確保](https://a11y-guidelines.freee.co.jp/categories/text.html#gl-text-contrast)）。
-サイズの大きいテキストについては3:1以上でも良いことになっていますが、できるだけ4.5:1以上を目指すようにしましょう。
+freee のガイドラインでは、テキストについて 4.5:1 以上のコントラスト比を満たすことを求めています（[コントラスト比の確保](https://a11y-guidelines.freee.co.jp/categories/text.html#gl-text-contrast)）。
+サイズの大きいテキストについては 3:1 以上でも良いことになっていますが、できるだけ 4.5:1 以上を目指すようにしましょう。
 
 コントラスト比は、[WebAIM Contrast Checker](https://webaim.org/resources/contrastchecker/)で確認することができます。
-Background Color（背景色）とForeground Color（前景色）それぞれにカラーコードを入力するか、カラーピッカーを使って色を選択すると、Contrast Ratioの欄にコントラスト比が表示されます。
+Background Color（背景色）と Foreground Color（前景色）それぞれにカラーコードを入力するか、カラーピッカーを使って色を選択すると、Contrast Ratio の欄にコントラスト比が表示されます。
 
-また、実装されたページに対するコントラスト比のチェックは、axe DevToolsで行うことができます。
+また、実装されたページに対するコントラスト比のチェックは、axe DevTools で行うことができます。
 コントラスト比の低い部分は **「要素は色のコントラスト比（最低限）の閾値を満たしていなければなりません (Elements must meet minimum color contrast ratio thresholds)」** という問題として、検出されます。
 
 <RelatedChecks ids={['0021']} />

src/pages/index.mdx

@@ -8,6 +8,7 @@ import { Title } from '/src/components/Title';
 [freee アクセシビリティー・ガイドライン](https://a11y-guidelines.freee.co.jp/)とあわせて見ることで、Web アクセシビリティへの理解を促進することを目的としています。
 
 ただ各ページを見ていくだけでなく、キーボードのみによって操作したり、スクリーンリーダーで操作したり、開発者ツールで DOM の状態を見たりしてみてください。
+
 - [キーボードで操作してみよう](/keyboard/)
 - [色のコントラスト比](/contrast/)
 - [スクリーンリーダーを使ってみよう](/screen-reader/)

src/pages/keyboard.mdx

@@ -3,9 +3,7 @@ import { IconButton, TextLink } from '/src/components/parts';
 import { MdContentCopy, MdEdit, MdDelete } from 'react-icons/md';
 import { Title } from '/src/components/Title';
 import { RelatedChecks } from '/src/components/parts/RelatedChecks';
-import {
-  FieldLabelsFor,
-} from '/src/components/examples/form';
+import { FieldLabelsFor } from '/src/components/examples/form';
 
 <Title>キーボードで操作してみよう</Title>
 
@@ -41,7 +39,9 @@ import {
 <ExampleContainer>
   <TextLink href="https://corp.freee.co.jp">freee株式会社</TextLink>
   <TextLink href="https://jobs.freee.co.jp">採用情報</TextLink>
-  <TextLink href="https://developers.freee.co.jp">freee Developers Hub</TextLink>
+  <TextLink href="https://developers.freee.co.jp">
+    freee Developers Hub
+  </TextLink>
 </ExampleContainer>
 <ExampleContainer>
   <IconButton
@@ -146,5 +146,4 @@ import {
   />
 </ExampleContainer>
 
-
 <RelatedChecks ids={['0171']} />