keypress on the form updates a byte counter

(related to #148)

* adds a `<small>` tag with an approximation of the bytes used by the
  message
* the overhead tends to be ~300 bytes so that's why the counter says `of
  ~724 bytes`

There might be a better way to do this? This seemed pretty straight
forward though. Suggestions are welcome!

I thought about adding a model because it seems like the mercury-way but it felt 
a little bit of overkill, thoughts?

GIF:

![](http://g.recordit.co/DEjreG7bEj.gif)