2005 Chat Bubble theme >>>> by spaceant

[mad7]

Hi there, I am currently running this template for my forum and I love it. But I am a dummie towards these stuff, and seeking some help.

The forum looks like this : hxxp:www.mad-7.com [nonactive]


And I want to change the forum's colors to look like this : hxxp:www.fnk.ca [nonactive]


so from the brown/bronze color to RED

and the light light brown or baige background color to WHITE.






Anyone think they got the html code for me to copy and paste?

Hehehe, thanks!   =)

[mad7]

I also wonder if I can get the forum to be centered in the screen like hxxp:www.fnk.ca [nonactive], instead of widescreen fitting the entire screen like hxxp:www.mad-7.com [nonactive]


Many thanks.

[forsakenlad]

First of all you can change the colour by modifying the style.css file and recolouring some certain images in the images folder of your theme. To make the forum have a standart width add a master table and set to width to something you like

[mad7]

Hi there, thanks, but I do not understand, I am a real dummie lol.



Here is the HTML that probably caused the entire forum to look like this in color :













/* Normal, standard links. */
a:link, a:visited
{
   color: #000000;
   text-decoration: underline;
}
a img { border: none; }
a:visited:hover, a:hover
{
   color: #FF0000;
   text-decoration: underline;
}

/* Navigation links - for the link tree. */
.nav, .nav:link, .nav:visited
{
   color: #000000;
   text-decoration: none;
}
a.nav:hover
{
   font-weight: bold;
   color: #FF0000;
   text-decoration: underline;
}

/* Tables should show empty cells too. */
table
{
   empty-cells: show;
}

/* By default (td, body..) use Tahoma in black. */
body, td
{
   color: #000000;
   font-size: small;
   font-family: Tahoma, arial, helvetica, serif;
}

body { font-size: 10pt; font-family: Arial, Verdana, Helvetica, sans-serif; background: #FFFFFF; color: #000000; }

img.left { float: left; }
img.right { float: right; }

td.chattopleft { background-image: url("images/layout/top_left.gif"); background-repeat: no-repeat; }
td.chattop { background-image: url("images/layout/top.gif"); background-repeat: repeat-x; }
td.chattopright { background-image: url("images/layout/top_right.gif"); background-repeat: no-repeat; }
td.chatleft { background-image: url("images/layout/left.gif"); background-repeat: repeat-y; }
td.chatright { background-image: url("images/layout/right.gif"); background-repeat: repeat-y; }
td.chatbottomleft { background-image: url("images/layout/bot_left.gif"); background-repeat: no-repeat; }
td.chatspeakleft { background-image: url("images/layout/bot_left_speak.gif"); background-repeat: no-repeat; }
td.chatbottom { background-image: url("images/layout/bottom.gif"); background-repeat: repeat-x; }
td.chatbottomright { background-image: url("images/layout/bot_right.gif"); background-repeat: no-repeat; }
td.chatspeakright { background-image: url("images/layout/bot_right_speak.gif"); background-repeat: no-repeat; }
td.chatinside { background-color: #FFFFCC; }

/* Input boxes - just a bit smaller than normal so they align well. */
input, textarea, button
{
   font-size: 9pt;
   color: #000000;
   font-family: Tahoma, arial, helvetica, serif;
}

/* Checkboxes shouldn't have a background color. */
input.check
{
}

/* Selects are a bit smaller, because it makes them look even better . */
select
{
   font-size: 8pt;
   font-weight: normal;
   color: #000000;
   font-family: Tahoma, arial, helvetica, serif;
}

/* Standard horizontal rule.. */
hr, .hrcolor
{
   height: 1px;
   border: 0;
   color: #000000;
   background-color: #666666;
}

/* A quote, perhaps from another post. */
.quote
{
   color: #000000;
   background-color: #FFFFFF;
   border: 1px solid #000000;
   margin: 1px;
   padding: 1px;
   font-size: x-small;
}

/* A code block - maybe even PHP . */
.code
{
   color: #000000;
   background-color: #FFFFFF;
   border: 1px solid #000000;
   padding: 1px;
   font-family: "courier new", helvetica, "times new roman", serif;
   font-size: x-small;
   width: 99%;
   margin: 1px auto 1px auto;
   white-space: nowrap;
   overflow: auto;
}

/* The "Quote:" and "Code:" header parts... */
.quoteheader, .codeheader
{
   color: #000000;
   text-decoration: none;
   font-style: normal;
   font-weight: bold;
   font-size: x-small;
}

/* Generally, those [?] icons. */
.help
{
   cursor: help;
}

/* /me uses this a lot. */
.meaction
{
   color: red;
}

/* The main post box - this makes it as wide as possible. */
.editor
{
   width: 96%;
}

/* Highlighted text - such as search results. */
.highlight
{
   background-color: yellow;
   font-weight: bold;
   color: black;
}

/* Alternating backgrounds... */
.windowbg
{
   color: #000000;
   background-color: #CCCC99;
}
.windowbg2
{
   color: #000000;
   background-color: #FFFFCC;
}

/* Titles - such as table headers. */
.titlebg, tr.titlebg td, .titlebg a:link, .titlebg a:visited
{
   color: black;
   font-style: normal;
   background-color: #999966;
}
.titlebg a:hover
{
   color: #dfdfdf;
}

/* The category headers, page indexes, and such things - catbg2 is used for "new" posts. */
.catbg, .catbg2
{
   font-weight: bold;
   background-color: #999966;
   color: #000000;
}

/* The borders around things. */
.bordercolor
{
   background-color: #000000;
}
.tborder
{
   border: 1px solid #000000;
   background-color: #000000;
   padding: 1px;
}

/* Default font sizes. */
.smalltext
{
   font-size: x-small;
   font-family: Tahoma, arial, helvetica, serif;
}
.normaltext
{
   font-size: small;
}
.largetext
{
   font-size: large;
}

/* This is for the special header boxes on the top - it's not used elsewhere. */
.headertitles
{
   background-color: #999966;
   border: 1px solid #999966;
}
.headerbodies
{
   border: 1px solid #000000;
   background-color: #EFEFEF;
   background-repeat: repeat-x;
   background-position: bottom;
}









and I hope to change it to look like : www.fnk.ca   in color.

Thanks!!!!!

[forsakenlad]

Do you want it to look like the fnk.ca main site or the forums?

[mad7]

forum =)

just the coloring, cuz i wanna keep my talking bubbles style hehe. just the colors. like the parts they have in red, I also wanna have those parts red, and the background to be white on the parts they have white.


If you can hook up an html to copy and paste that would be great =)


Thanks for your time and replies^^
Much appreciated!

[mad7]

Hello? Anyone?

lol   

[forsakenlad]

The easiest way would be to take a screenshot, then with a clour picker choosing the parts of the theme you would like to change and selecting it from the style.css and modifying it