Render markdown in title #1801

New Issue

bolgrov · 2021-07-08T10:00:55Z

bolgrov commented

2021-07-08 10:00:55 +00:00

Vikunja has markdown support for comments, however it does not currently support it for Tasks titles.
It would be beneficial to support this not only for aesthetic purposes but more importantly for better usability.
I tend to use a lot of links in the Tasks titles: [site](link) and in Todoist this renders a clickable site but in Vikunja it just shows the unrendered markdown.

Thank you !

Vikunja has markdown support for comments, however it does not currently support it for Tasks titles. It would be beneficial to support this not only for aesthetic purposes but more importantly for better usability. I tend to use a lot of links in the Tasks titles: ` [site](link)` and in Todoist this renders a clickable `site` but in Vikunja it just shows the unrendered markdown. Thank you !

👍 1

konrad added the

kind/feature

label 2021-07-09 15:54:37 +00:00

konrad commented

2021-07-09 15:56:50 +00:00

I can see how this would be useful, but would this really be faster than putting the link in a comment or the task description?

konrad referenced this issue

2021-07-09 15:59:41 +00:00

Automatically fetch site title from url #913

bolgrov referenced this issue

2021-07-09 20:09:47 +00:00

Automatically fetch site title from url #913

jln commented

2021-10-13 07:14:33 +00:00

Hi,

I totally agree with bolgrov, I think it's really faster to click on a link in title, than to look for this link in comments.

Moreover, markdown support in comments would allow to use bold and italic, thus to improve readibility of some important information.

Hi, I totally agree with bolgrov, I think it's really faster to click on a link in title, than to look for this link in comments. Moreover, markdown support in comments would allow to use bold and italic, thus to improve readibility of some important information.

dpschen commented

2021-10-13 09:19:17 +00:00

I would love to have the option to use markdown links in a task title.

Moreover, markdown support in comments would allow to use bold and italic, thus to improve readibility of some important information.

Isn't markdown already supported in comments?

I would argue that using markdown to format bold and italic might leed to some problems because it decreases options our options to show other meta information next to the task in a list. What I mean by that is e.g. if you allow italic inside the task title then it's harder to see the due date, since it's currently italic as well (see attachment). Also default markdown syntax supports normal HTML which we probably don't want in titles.

Because of that I think it makes sense to create an allowlist of what syntax is supported. Currently I think that would only include markdown links. We don't want to have animated graphics in task titles

Maybe this could also be implemented in stages:

support only markdown urls in titles

cherry on top:

add api for automatic title fetching
create link by pasting url over marked text

Related with all of that is the discussion reagarding the implementation of a new editor

I would love to have the option to use markdown links in a task title. > Moreover, markdown support in comments would allow to use bold and italic, thus to improve readibility of some important information. Isn't markdown already supported in comments? I would argue that using markdown to format bold and italic might leed to some problems because it decreases options our options to show other meta information next to the task in a list. What I mean by that is e.g. if you allow italic inside the task title then it's harder to see the due date, since it's currently italic as well (see attachment). Also default markdown syntax [supports normal HTML](https://daringfireball.net/projects/markdown/syntax#html) which we probably don't want in titles. Because of that I think it makes sense to create an allowlist of what syntax is supported. Currently I think that would _only_ include markdown links. We don't want to have [animated graphics](https://github.com/sindresorhus/css-in-readme-like-wat) in task titles Maybe this could also be implemented in stages: - support _only_ markdown urls in titles cherry on top: - add [api for automatic title fetching](https://kolaente.dev/vikunja/api/issues/913) - create link by pasting url over marked text --- Related with all of that is the [discussion reagarding the implementation of a new editor](https://kolaente.dev/vikunja/frontend/issues/781)

Screenshot 2021-10-13 at 11.01.14.png

11 KiB

jln commented

2021-10-13 09:45:08 +00:00

Isn't markdown already supported in comments?

There are but from my point of view, it's a huge gain in fluidity to avoid opening and reading the comments again and again, and be able to read important information in task title itself.

I would argue that using markdown to format bold and italic might leed to some problems because it decreases options our options to show other meta information next to the task in a list. What I mean by that is e.g. if you allow italic inside the task title then it's harder to see the due date, since it's currently italic as well (see attachment).

I understand. For me, it is the user's responsibility to use formatting wisely. If the user is bothered by the fact that his italicized text is confused with the due date, it is up to him not to use italics at the end of the title. But this should not prevent the use of italics elsewhere in the title.

(This is the choice made by other tools like Quire.io for example. The latter allows you to use links, italic, bold, and even css to modify the text color, the text size, the background color… in task title)

> Isn't markdown already supported in comments? There are but from my point of view, it's a huge gain in fluidity to avoid opening and reading the comments again and again, and be able to read important information in task title itself. > I would argue that using markdown to format bold and italic might leed to some problems because it decreases options our options to show other meta information next to the task in a list. What I mean by that is e.g. if you allow italic inside the task title then it's harder to see the due date, since it's currently italic as well (see attachment). I understand. For me, it is the user's responsibility to use formatting wisely. If the user is bothered by the fact that his italicized text is confused with the due date, it is up to him not to use italics at the end of the title. But this should not prevent the use of italics elsewhere in the title. (This is the choice made by other tools like Quire.io for example. The latter allows you to use links, italic, bold, and even css to modify the text color, the text size, the background color… in task title)

dpschen commented

2021-10-13 09:55:36 +00:00

There are but from my point of view, it's a huge gain in fluidity to avoid opening and reading the comments again and again, and be able to read important information in task title itself.

I think the magnitude of that issue might be reduced if we find a way to show tasks non blocking (not as a popup) in a good way.

What also comes to my mind is something recently introduces in todoist: they show the first line of the description cut of after some characters. See the two attached images:

task in normal list after added
task in detail view

What I think is noteworthy is that they decided to remove line breaks in the preview. Not sure if I like that 🤷‍♂️

@jln What do you think? :)

> There are but from my point of view, it's a huge gain in fluidity to avoid opening and reading the comments again and again, and be able to read important information in task title itself. I think the magnitude of that issue might be reduced if we find a way to show tasks non blocking (not as a popup) in a good way. What also comes to my mind is something recently introduces in todoist: they show the first line of the description cut of after some characters. See the two attached images: 1) task in normal list after added 2) task in detail view What I think is noteworthy is that they decided to remove line breaks in the preview. Not sure if I like that 🤷‍♂️ @jln What do you think? :)

konrad commented

2021-10-13 11:01:59 +00:00

I think we could do this with an allowlist to allow only the usual formatting and links, no images or anything else. Then it would be up to the user if they want to do all kinds of confusing formatting with it.

Implementation-wise we'll also have to sanitze the input before rendering, not sure about the effect this has on the total bundle size.

I think we could do this with an allowlist to allow only the usual formatting and links, no images or anything else. Then it would be up to the user if they want to do all kinds of confusing formatting with it. Implementation-wise we'll also have to sanitze the input before rendering, not sure about the effect this has on the total bundle size.

jln commented

2021-10-16 15:11:58 +00:00

I don't know todoist very well. I am more familiar with Quire.io which provides, in my opinion, the best UX I have ever used.

Here is a very short capture that shows the fluidity of the tool. A due date or a tag can be applied in 2 clicks, without opening any popup or new window. Access to a more feature-rich panel is done via a click, or a simple press on the space bar. This panel can be pinned if needed.

Finally, to come back to Markdown which is the subject of this issue (sorry for the off-topic!), it can be applied when creating the task or when editing it (editing takes only one click!)

I don't know todoist very well. I am more familiar with Quire.io which provides, in my opinion, the best UX I have ever used. Here is a very short capture that shows the fluidity of the tool. A due date or a tag can be applied in 2 clicks, without opening any popup or new window. Access to a more feature-rich panel is done via a click, or a simple press on the space bar. This panel can be pinned if needed. Finally, to come back to Markdown which is the subject of this issue (sorry for the off-topic!), it can be applied when creating the task or when editing it (editing takes only one click!)

quire.gif

585 KiB

dpschen commented

2021-10-16 15:19:11 +00:00

Thanks for the video :) really interesting to see.

I like the pinnable sidepanel a lot :)

What I don't get from the video:
How do you open the sidepanel vs edit the text?
Do you have to click on the text vs somewhere else in the line?

Thanks for the video :) really interesting to see. I like the pinnable sidepanel a lot :) What I don't get from the video: How do you open the sidepanel vs edit the text? Do you have to click on the text vs somewhere else in the line?

jln commented

2021-10-16 16:13:28 +00:00

The first time, I opened the sidepanel by pressing the space key, then I opened it by clicking the icon.

To edit task title, I double-clicked it.

The first time, I opened the sidepanel by pressing the space key, then I opened it by clicking the icon. To edit task title, I double-clicked it.

👍 1

jln commented

2021-10-16 17:47:01 +00:00

In fact, you can also open the panel by clicking on a blank space of the task (on the right of the title itself).

I've recorded a more complete screenshot showing how it's possible to create and edit task without leaving the main tasks list.

In fact, you can also open the panel by clicking on a blank space of the task (on the right of the title itself). I've recorded a more complete screenshot showing how it's possible to create and edit task without leaving the main tasks list.

quire2.gif

2.6 MiB

konrad referenced this issue from a commit

2024-02-07 14:00:33 +00:00

chore(deps): update dependency vue-tsc to v0.34.2 (#1801)

Sign in to join this conversation.