Round Quotes by BOP5
Mod Version: 1.00, by BirdOPrey5
| vB Version: 3.8.x | Rating:  (5 votes - 4.80 average) |
Installs: 23 |
| Released: 23 May 2011 | Last Update: 23 May 2011 | Downloads: 83 |
 Not Supported
 Template Edits
Re-usable Code
Translations
|
||
Now that Internet Explorer 9 supports the "border-radius" property I thought it was time to update my old style round quotes with new, pure CSS based round quotes. The old quotes used small graphics in each corner to simulate roundness and had to be edited for each color and style you used.
This solution is all CSS based and uses your forums existing colors.
In your Admin CP -> Style Manager -> Edit Templates find the template: bbcode_quote
Erase it all and replace it with:
Next - Upload the file quote_bar.png to your images/misc directory.
quote_bar.png is optimized for the default vbulletin 3.x style. If you have different colors you will probably want to make your own graphic with your own colors. Just make sure it's the same height in pixels as the original.
That should look good on any light vBulletin style. If you have a black or dark style I would make 1 change:
Find:
and change black to white or some other light color that fits your style. This will be the font color of the "Originally Posted by USERNAME" text.
If you want to uninstall simply revert the bbcode_quote template.
Demo: http://www.juot.net/forums/index.php?t=59271
Screenshot Attached.
Working and tested in the latest versions of IE, Firefox, Chrome, Opera and Safari.
NOTE: If you haven't already done so place this line at the top of your headinclude template for IE9 compatibility:
Please Mark as Installed if you use this. 
This solution is all CSS based and uses your forums existing colors.
In your Admin CP -> Style Manager -> Edit Templates find the template: bbcode_quote
Erase it all and replace it with:
HTML Code:
<div style="margin:20px; margin-top:5px; <if condition="$show['iewidthfix']">width: 100%;</if>"> <div width="100%"> <div class="alt2" style="border: 1px outset; border-color: #EEFFFF; font-style:normal; padding:$stylevar[cellpadding]px; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px;"> <div class="tcat" style="color: black; background-image:url('/forums/images/misc/quote_bar.png'); background-repeat:no-repeat; background-position: 100% 0; padding:3px; -moz-border-radius: 4px; -webkit-border-radius: 4px; border-radius: 4px; margin-bottom: 3px;"> <if condition="$show['username']"><phrase 1="$username">$vbphrase[originally_posted_by_x]</phrase> <if condition="$postid"><a href="showthread.php?$session[sessionurl]p=$postid#post$postid" rel="nofollow"><img class="inlineimg" src="$stylevar[imgdir_button]/viewpost.gif" border="0" alt="$vbphrase[view_post]" style="vertical-align: middle; position:relative; top:-2px;" /></a></if><else /> </if> </div> <div style="font-style:italic">$message</div> </div> </div> </div>
Next - Upload the file quote_bar.png to your images/misc directory.
quote_bar.png is optimized for the default vbulletin 3.x style. If you have different colors you will probably want to make your own graphic with your own colors. Just make sure it's the same height in pixels as the original.
That should look good on any light vBulletin style. If you have a black or dark style I would make 1 change:
Find:
Code:
<div class="tcat" style="color: black;
If you want to uninstall simply revert the bbcode_quote template.
Demo: http://www.juot.net/forums/index.php?t=59271
Screenshot Attached.
Working and tested in the latest versions of IE, Firefox, Chrome, Opera and Safari.
NOTE: If you haven't already done so place this line at the top of your headinclude template for IE9 compatibility:
HTML Code:
<meta http-equiv="X-UA-Compatible" content="IE=9" />
Download
BOP5 - Round Quotes.zip (6.1 KB, 101 downloads)
Screenshots
