Not using active syntax theme
batjko opened this issue · 24 comments
Hi,
This is a great package.
One little issue to note would be that the preview doesn't seem to use the actual syntax theme, in terms of the font and colors:
Any chance this can be adopted?
Any chance this can be adopted?
Absolutely. I originally tried to get https://github.com/atom/highlights working however it complained with errors when I installed it so I used another package, see #1. Maybe @kevinsawicki could give me a hand in where I should look for how the EditorView renders syntax highlighting :).
There is an API on the EditorView to build HTML for a given text chunk using the current theme.
The Markdown preview package uses it to colorize code blocks in markdown files.
You can get the JS grammar by doing atom.syntax.grammarForScopeName('source.js') and then do the following to build the HTML: https://github.com/atom/markdown-preview/blob/17dd86ede2d6a270fecc39b696282937c67fb3ae/lib/renderer.coffee#L97-L100
Is this what you are looking for?
Looks like exactly what I need! Thank you @kevinsawicki!
I should be able to whip this up quickly later tonight :).
Great, let me know if you have any issues, very cool package 👍
Great stuff! Thank you both.
Pushed :).
Yup, that looks pretty now!
The font size isn't catching up yet, but the theme is working very nicely now!
Whaaat? I even fixed the font-size before I pushed. It updates the font-size every time it renders the new preview.
https://github.com/Glavin001/atom-coffeescript-preview/blob/master/lib/coffeescript-preview-view.coffee#L135-L141
@kevinsawicki any ideas / alternatives to syncing the font-size?
Sorry, mate.
I tried closing the preview, then changing the coffee's size, then re-loading the preview, still not adapting.
No errors in the console, btw.
Just tried it with mine. It is working, because the tab change event is triggered when I got back from Atom Settings tab back to the coffeescript editor, and it reloads the view and re-applies the font-size.
How are you setting the font size?
Ah, yea I'm not using the settings view for it, rather the Ctrl+= and Ctrl+- key binding for adjusting the size.
But even changing it in the Settings View doesn't do it for the preview.
@batjko I have pushed and published a patch that fixes the issues you described and I tested with Ctrl+= and Ctrl+- key binding for adjusting the size. Hope it works well for you, too :).
Yup, now it changes font size as I change it. Purrs like a kitten!
Well done, and thanks for the quick turn-around!
You're very welcome! Thank you for your support and let me know if you have any other ideas to make it even better!
Hi guys, this works fine for the inbuilt themes of Atom, but when trying something different (Monokai) it just shows grey text. Any idea where the problem might be?
@daniocean, like this?
Yes, exactly :)
I have been using the editor-colors class, and these other themes that are not working appear to be just using editor with editor-colors. However, it could also be an issue with the latest Atom updates -- I am finding that the font-size is also incorrectly rendered now even though the CSS says font-size: 16px for both.
Tested Themes:
- Atom Dark
- Base16
- Monokai
- Solarized Dark
@daniocean just published a patch. Let me know if it works for you as well.
Also, I recommend everyone slowly migrates over to using https://github.com/Glavin001/atom-preview :).
Works great, thanks!
I'll probably move to "preview" as soon as this fix is in it :)
Cheers!
Excellent!
Sounds good. I'll have to make the fix on Preview later tonight after work.
Continued development will likely only continue on with Preview and deprecate CoffeeScript-Preview very soon.
Thanks for your support! Enjoy.