Comment Box Border/BG colo

Feature Discussion
1

Hello!
The comment box element is impossible to distinguish from the background. You have to know it’s there-- I see the formatting controls but having no way to immediately visually distinguish the text field from the backgrounds adds unnecessary cognitive load until you’ve spent a while with the interface, and I don’t see the benefit of it. I’ve done a bit of interface design and understand the balance between visual structure and visual clutter, but I think this adds beneficial visual structure that helps users visually orient themselves in the interface using layout paradigms they’re used to.

I am happy to contribute some ideas if there are other considerations this would clash with. Screenshot attached with what I’m proposing. Obviously it would change from theme to theme, but in this case, I just set the div to rgba(255,255,255,.125) and added a 1rem margin at the top.

image
image2465×1130 205 KB

2

Or something like this:

image
image2120×1129 190 KB

3

Or even something like this I adapted from some CSS I grabbed off of SO:

image
image2244×1203 207 KB

4

I like the second idea, but not sure about the margin. We would need to change it in all other places where we’re using the editor so that it is consistent.

5

When I get a moment I’ll look at the layout different places where the editor is used and play around with some stuff.

2 Likes