Allow resizing of images

[fzeiser]

Feature request: Possibility to resize images for rendering

In the legacy version it was (easily) possible to resize an image. I tried the same type of command now, but without success. Is it (still) possible to resize images for rendering (if so, how?) or can this be implemented with the current Markdown renderer?

Current behavior

Expected behavior

Steps to reproduce

1. Create a note with an image, here it was called aa79a1eb-khvynnn3.png (sorry for the name)

Image:  
![img](aa79a1eb-khvynnn3.png)

2. In the precious version, this snippet would then show it resized (here: width to 300x)

Trying to rescale (width):  
![img](aa79a1eb-khvynnn3.png =300x)

Environment

Desktop/Web

• Boost Note.next version:
• OS version and name:

[guneskaan]

Looks like Markdown does not have a standard for image resizing. Discussions have taken place in the past on how image resizing in Markdown should be handled:

• Feature request: image scaling gnab/remark#72
• How does this not support sizes? :) remarkjs/remark-images#3
• https://stackoverflow.com/questions/14675913/changing-image-size-in-markdown

We have a few options for how we can integrate image resizing to our current implementation of Markdown parsing using unified.js and remark.js:

1. Writing custom remark plugin to extend the parser and allow resizing inside paranthesis: https://github.com/remarkjs/remark/tree/main/packages/remark-parse#extending-the-parser
2. Using remark-shortcodes to allow sizing inside brackets with attributes: https://github.com/djm/remark-shortcodes.
3. Not supporting this in Markdown, and giving users the ability to use HTML <img> tag to specify custom style or size attributes

The PR I opened (#738) will give users the ability to use option 3.

I would like to hear what other developers think image rendering should be handled in BoostNote. @Rokt33r

[Rokt33r]

@guneskaan @fzeiser 3. should be the best in my opinion. I'll close this after #738 is merged.