jncraton/box-line-text

Hand drawn effects

mkarliner opened this issue · 3 comments

It's a very nice concept!

I feel that as it's a whiteboard, it could use
a little more of an informal feel, as in:
https://codepen.io/tmrDevelops/pen/NPXodB

I've had a go at including this, and the boxes work fine, but
I suspect that the lines may need a different technique than a
zero height box.

also, a more informal font would be nice.

Thanks for this feedback. I'll certainly give it some thought.

Right now, this would be challenging to implement, as the architecture is currently very simple and assumes that everything lives on a 64px grid. If that assumption is broken, elements would have to become aware of their neighbors in order to make everything connect properly. That can certainly be done, but it unfortunately isn't as simple as a style change.

Yes, I think svg would be the way to go, but obviously at the cost
of considerably more complexity. However, the idea is so attractive
that I think it deserves the makeover. You may look at https://github.com/pshihn/rough
I'm not really a front end person, but I'd be willing to help.

I've been playing around with implementing this. Here's the current state showing the curved CSS border concept:

https://hand-drawn--box-line-text.netlify.app/#;f1133Hello;9422;e6133World