Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

About Atom Personalization

I started using Atom today. It's great, but I have a couple of issues:

  • Syntax Themes: I installed some syntax themes, but I found one cannot modify editor font colors, just style and size (from the main settings pane). Is there any workaround?

  • Markdown Preview: I was unable to find out how to change preview style. I mean, markdown is rendered with arial fonts and a white background. Is there any way to change this default behaviour?

like image 628
MadHatter Avatar asked Mar 15 '23 12:03

MadHatter


2 Answers

You should be able to customize both in your user stylesheet. On Mac OS X, you can open this using Atom > Open Your Stylesheet, which will open the ~/.atom/styles.less file.

For the syntax themes: You can customize the colors in your styles.less file, simply take a look at the theme's source LESS file and then override the settings in your custom stylesheet. More details and an example can be found here.

Markdown Preview: The Markdown Preview package has an example on how to do that in your own styles.less file:

.markdown-preview.markdown-preview {
  background-color: #444;
}

Take a look at the Markdown LESS files to see some of the styles you could override:

  • Default style: https://github.com/atom/markdown-preview/blob/master/styles%2Fmarkdown-preview-default.less
  • GitHub style: https://github.com/atom/markdown-preview/blob/master/styles%2Fmarkdown-preview-github.less
like image 152
nwinkler Avatar answered Mar 21 '23 00:03

nwinkler


The markdown-preview-plus documentation now gives a different approach to styling the preview (even from the "snippet" provided in their README"):

To target Markdown-Preview-Plus rendering in general, you can do something like this in your stylesheet:

html[data-markdown-preview-plus-context] body {
 /* styles that affect mpp preview */
}

Full details (especially on further "contexts") in the MPP docs.

like image 32
Dɑvïd Avatar answered Mar 20 '23 22:03

Dɑvïd