LoginSignup
45

More than 5 years have passed since last update.

AtomのMarkdownプレビューをGitHubスタイルにしたり、カスタマイズしたりする。

Last updated at Posted at 2016-03-29

コメントをいただいたので反映しました。
以下のかんたんな手順でGitHubスタイルに準拠できます。

  1. Settingsを開く。
  2. パッケージというサブメニューを選択する。
  3. markdown-previewを検索して、Settingsボタンを押す。
  4. Use GitHub.com styleにチェックする。

以上です。
カスタマイズをしたい人というのは、以下の記事を参照してください。


AtomのUI themeの何を選択するとしても背景色は黒系統で運用するわけじゃないですか。
そこでMarkdownプレビューすると背景色が黒いけど、プレビューは白背景で黒文字にしたいわけじゃないですか。
どうすればいいんですか?

ということを会社の人に言われて、CSS書きました。

Markdownのプレビューがこうなります。(AtomのREADME参考にちょっと追記してます。)

Kobito.8Htn0r.png

styles.less に以下のコードを追記します。

styles.less
.markdown-preview {
  background: white !important;
  p, h1, h2, h3, h4, h5, h6, li, th, td, strong {
    color: black !important;
  }
}

Settings - Themesからyour stylesheetのリンクをクリック。あるいはSettings - Open config folderから.atom ディレクトリ内にあるstyles.lessを選択。

背景を白く。最低限のテキストを黒くしてるだけ(リンクなどは変更なし)です。

みなさまAtomに移行しましょーというメッセージ込です。

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
45