Typora Side-by-side

A CSS theme extension for Typora that enables side-by-side view for certain blocks. It is built to be used on top of whatever theme your are already using (see Installation).

Pull requests are welcome here 👍 if you have any ideas that would make this theme extension better.

I made this because I thought it was lacking in Typora and it was mentioned a lot in typora-issues (#70, #4215, #3453, #3709, #4154, ...)

Screenshots

Math environment (theme Panda):

Installation

You can refer to Typora custom CSS documentation page in order to add this custom css to your editor. Everything that you need is in the _.user.css file. You can find this file in the Releases tab of this repository.

Name the css file:

• base.user.css if you want it to be applied by default on top of all your themes
• <theme-name>.user.css if you want it to be applied only on top of a particular theme

and place it inside the Typora themes directory (see Typora theme documentation).

⚠️ If the file already exists, append the content of _.user.css at the end of it!

Currently supported blocks

• Math blocks ($$)
• (Mermaid in development)

Themes compatibility

Compatibility tested with following Typora themes:

• GitHub Night
• GitHub
• Hivacruz
• Newsprint
• Night
• Nord
• Onedark
• Panda (initially built on top of this theme)
• Pixyll
• Quartz Milky
• Whitey
• Xydark
• Xydark focus
• Xylight

Please send me a message if you see that my extension works with a theme that is not present above so that I can add it to the list.