Signed-off-by: Conrad Zelck <git@simpel.cc>

The dialog itself now get's the onclick event to close on every click.

Signed-off-by: Conrad Zelck <git@simpel.cc>

All actions push a convert immediately except changes in the input
field. That's because every new character would do a conversion what
makes a lot of traffic. But to give a hint that a new conversion could
be useful the convert button will be enabled if the content is differ-
ent from the last conversion. All other actions trigger the conversion
and disable the convert button.

Signed-off-by: Conrad Zelck <git@simpel.cc>

The label refered to a textarea before. This was replaced with a div.
A div can't be reference by a label. Some make it a p and set for a11y
aria-labelledby onto #input and #output.

Signed-off-by: Conrad Zelck <git@simpel.cc>

Use a div with attribute:
 - contenteditable="true"

It fixes a lot of issues:
 - height of #input needs no javascript to adapt to content
 - therefor no complex styles are needed
 - width will no longer exceed the given width by grid-template-column
 - styling etc. can be handled like the #output div next to it

You have to set two attributes for a11y:
 - role="textbox"
 - aria-multiline="true"

Signed-off-by: Conrad Zelck <git@simpel.cc>

Signed-off-by: Conrad Zelck <git@simpel.cc>

There are a lot of stati where it's not good to have those bottons en-
abled. So check it on every bodies load, change, click or keyup.

Signed-off-by: Conrad Zelck <git@simpel.cc>

Signed-off-by: Conrad Zelck <git@simpel.cc>

Signed-off-by: Conrad Zelck <git@simpel.cc>

A working website w/o file in- or output.

Signed-off-by: Conrad Zelck <git@simpel.cc>