change CODE and PHP tags design

change CODE and PHP tags design

Mod Version: 1.00, by Mohammad Kamal

vB Version: 5.0.0 Beta 24	Rating: (0 vote - 0 average)	Installs: 6
Released: 15 Jan 2013	Last Update: Never	Downloads: 0
Not Supported Template Edits

Hello,

New Simple design for CODE and PHP tags

I posted a similar thread for vBulletin 3 before shortly

new simple design for [php] [code] tags

*Take a backup before editing any template.

Open css_global.css template

find:

Code:

.bbcode_container .bbcode_code {
	font-family:Courier,'Courier New',Monaco,Monospace;
	font-size: {vb:stylevar bbcode_code_fontsize};
	background: {vb:stylevar autosuggest_background};
	border: 1px solid {vb:stylevar form_dropdown_border_color};
	overflow: auto;
	padding: 6px;
	width: 100%;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

replace it with:

Code:

.bbcode_container .bbcode_code {
font-family: Courier,'Courier New',Monaco,Monospace;
overflow: auto;
padding: 6px;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
border: 1px solid #8CC8FF;
width: 700px;
max-height: 400px;
font-size: 13px;
background-color: #CDE7FF;
}

then in the same template, find:

Code:

.bbcode_container .bbcode_description {
	margin-top:10px;
}

and replace it with:

Code:

.bbcode_container .bbcode_description {
margin-top: 10px;
color: #8CC8FF;
padding: 6px;
display: block;
border: 1px solid;
background-color: #CDE7FF;
width: 686px;
font-size: 14px;
font-weight: bold;
}

Done

Download

No files for download.

Screenshots

vBulletin LTS