Automattic / simplenote-electron

Simplenote for Web, Windows, and Linux
https://app.simplenote.com
GNU General Public License v2.0
4.78k stars 557 forks source link

UI buttons and hotkeys to easy edit text in markdown mode #2781

Open bodamat opened 3 years ago

bodamat commented 3 years ago

What

Add UI buttons and hotkeys to easily edit some text in markdown mode. For example, just select some text and click the bold UI button or hotkey for bold action. So at right and left selected text add ' ** ' to do text bolder as in markdown style. It would be so good for the all-supported markdown style and for all supported os. Now we have only for a checklist.

Why

This is easy and quick to write some text. We don't need to distract from remembering how to format text and what symbols we need to use or just waste our time.

How

This functionality we can see everywhere. Even where I write now, like in the GitHub issue description editor. It's a very good example.

alessandro-antonelli commented 2 years ago

Simplenote totally needs this! I understand that the userbase is mainly made by developers, but formatting is something that should be accessible also to laymen. ATM, to their eyes, SimpleNote doesn't offer formatting at all. Moreover, many non-US keyboard layouts don't include characters needed for markdown syntax, thus requiring a tiring "copy that char from somewhere else" labor.

This would also make less compelling the need for a WYSIWYG editor (as in #2909 ), which would require more work and would make the app less "simple" -- especially if #2850 / #2065 will be delivered too.

It should be easy to implement the feature, and there are many examples from which one can draw inspiration from (Wikipedia's original source editor for wikicode; post editing in phpBB forums for BBCode; Whatsapp, Telegram clients for limited markdown, etc).

Beside toolbar buttons and hotkeys, I would add these commands also to the right-click menu. More complex or parameterized markdown elements could show a small popup window with a form-like set of textboxes/checkboxes for each of the element's attributes, and an "add" button.