reactjs / reactjs/ja.react.dev

Fix italic font issues by applying a class to `<em>`'s containing Japanese characters

Open
#599 0 comments 0 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

workflow
Dominant language
JavaScript
Stars
301
Forks
190
PR merge metrics
No merged PRs in 30d

Description

*このタイプの強調*<em></em> に変換されますが、日本語には本来イタリックの概念がないため、以下のような問題が生じています。

  • タイポグラフィ・デザインの観点から言えばよろしくない
  • フォント設定や環境によってはイタリックはそもそも表示されない
  • 表示されたとしても隣の文字と干渉するなど汚いし、気付かれづらい

というわけで、<em> 内に日本語文字が含まれていた場合は <em class="em-ja"> などに変換し、その場合はイタリックではなく太字を適用する、という処理が必要です。以前は #94 のように Gatzby プラグインで処理していますが、新サイトでどうするか調べるところからやる必要があります。

Contributor guide

Open the contributing guide

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

Research direction

Start by locating how the new site transforms elements and review the Gatsby plugin handling referenced in #94. Confirm how Japanese characters are detected and where emphasis styles are defined. Done means Japanese-containing emphasis receives a separate class and bold styling instead of italics, while other emphasis remains unchanged.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
documentation, localization
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.