Restyling the quoted text

[Orioni]

Hi people. I'm thinking of adding some style to the way a quote is presented here on the form. Right now a quoted text on this forum looks like this.

 

 

While this is clear to read, I was thinking of make it a bit more stylish. From what I know is possible with CSS styling, you can make this look like a real piece of paper. For example, look at the background of these:

 

http://codepen.io/mlms13/pen/LKFoy (my favourite)

http://codepen.io/claudericke/pen/VLGmWL (still ok)

 

Still readible. Looks unique. Will work rightaway for all old post and new ones. And I can always undo.

 

My only real concern is what to do with quotes in quotes in quotes. To solve that problem, I know the number of nested quotes can be limited. Either that, or I can style the double quotes a different way. But this last bit is still just theory in my head.

 

So, what do you think?

[Suverina]

I say we go ahead and beta-test it for a few days and then evaluate. It looks good.

[Adaptus]

In the context of the type of forum we are. The first suggestion seems good. Most people use quotes on our forums, and those on the NS site, not quite as intended. And use them as more of a reply or to address someone IC.

 

In regards to tackling quotes in quotes. From a developer point of view, limiting nested quotes would be the easiest. Stops long lines of quotes in a post, and also leaves a much tidier CSS sheet. Keep it simple to save headaches later on down the road.

[Orioni]

Thank you both. I can agree with the idea of Suverina to go ahead and test it. The additional agreement by Adaptus to limit the number of nested quotes makes things pretty obvious. I'll take some time on Tuesday to give this a go. I have another holiday left. Added to my agenda for that day.

[Orioni]

Going to give this a try and see how it works out.

 

This is a quote with a name

 

This is a quote without a name

 

This is a quote with a name

 

This is a nested quote with a name

 

This is a quote with a name

 

This is a nested quote without a name

[Orioni]

I do think this worked very well. For example, have a look at the messages being sent in this thread: http://z7.invisionfree.com/Europa/index.php?showtopic=3955

 

If you manage to stumble upon a bug, I'd be grateful if you shared a screenshot and your browser version. This way I can work to ensure an optimal experience for everyone.

[Orioni]

It's been a week since I launched this test. Any feedback?

[Jilderen]

I'm liking the new look

[Adaptus]

+1 to what Jilderen said.

 

Top work!

[Orioni]

Just discovered there was a slight error in the way these quotes were styled. That has been fixed now. (Who knew CSS could be this case-sensitive as well.)

[Orioni]

Testing my lovely new button

This text is inside

Whooptiedoo!

It works like a charm. 

This text is outside again.

For those of you reading this. There is a new button in the toolbar, just for creating this stack-of-papers style. Please use it only once. I won't be responsible if you destroy your own content by nesting too much of these, one inside the other. Thanks!