MyBB Community Forums

G'day all,

installed MyBB last night and am liking it a lot. (Have used phpBB and SM before.)

I have searched for this setup and haven't found a thing, although I did discover how to change the background of the blockquote generally.

What I'd like to do is make the background colour and indent of multiple level quotes different to make them stand out. So if there is a quote that includes another quote, the overall quote could have a light blue background (which I've done in global.css, easy once you read the instructions here :-) and the "quoted quote" could have a light yellow background.

Would look like this:

---------------------------------------------
|Quote 1 said: (This block light blue)
|adsasddds
|dsfadsfsaf
| ---------------------------------------
| |Quote 2 said: (This block light yellow)
| |rqwerqer
| |qwerqwerq
| ---------------------------------------
--------------------------------------------

New comment

=====================================

Does that make sense? I know it can be done in phpBB, but it's got enough other stuff I don't like to not want to use it.

Thanks.

hmm good idea although i also cant find anything like this. (searched previously)

Might as well give this a bump...

I suppose this can be achieved using some CSS code, something like:

blockquote {
background: red;
}

blockquote blockquote:first-shild {
background: green;
}

blockquote blockquote:first-shild blockquote:first-shild {
background: blue;
}

But not like this, otherwise youill fill your global.css with a lot of code.

Something like "n" child or similar, I'm not very sure to as how to use it.

Thanks Omar, you were definitely in the ball park.

global.css - here's how it works (tested in FF13, IE9, Chrome 20) and it's brilliant (also with rounded corners for the quote boxes):

blockquote {
	background: #e0ebf0;
	border: 1px solid #ccc;
	border-radius: 15px;
	padding: 15px;
	margin-left: 20px;
}

blockquote blockquote {
	background-color: #FFFFE6;
}

blockquote blockquote blockquote {
	background-color: #ECFFFF;
}

blockquote blockquote blockquote blockquote {
	background-color: #FFF3FF;
}

blockquote blockquote blockquote blockquote blockquote {
	background-color: #ECFFDA;
}