Add text area to process and process the input

[thepushkarp]

Changelog

• Restrict dragging beyond the canvas element
• Add text input to the right of the window
• Process input and segregate it into information for a single group (with a title, subtitle, text and images)
• Send the information object to the parent element
• Convert current vanilla markdown preview to preview desired for this project
• Add tooltip for users to understand how to enter text

Resolves #13

[thepushkarp]

@tyagi-iiitv the tasks for this PR are completed.

The way of entering the information is:

• '#' for entering title as well as for starting a new visual group. The title can be empty. Just a single # would start a new group
• '##' for entering label. It would be displayed with brackets in front of the title
• '' for entering images
• Text in a new line to add new lines of text to the group

The elements of a group are displayed together and two groups are separated by a line so that the elements can be distinguished from one group to another.

Images:

The Input:

The Output (this is a scrolled screenshot):

Tooltip to keep the format of writing the information handy to the user:

[tyagi-iiitv]

Thanks for the work!