Blaze Dark theme

[Anastaise]

I was wondering if I could change the banner area to be black, while still maintaining the ~1/4" grey border like the rest of the forum.  My Banner image is black and it looks weird when it suddenly stops and it's grey to the right of it.  I'm not a coder, but my guess is that I would need a black narrow image that could be repeated?  I don't know if this would be hard/easy to do.

http://www.fatality-gaming.com/forum/index.php?action=forum

[Crip]

Hi,
let me take a quick look.. [end]

[Crip]

You can control the Forums Background for the entire Theme here:
css/index.css Find & Change

Code Select Expand


/* This division wraps the entire forum when a forum width is set. */
div#wrapper
{
margin: 0 auto;
min-width: 764px;
max-width: 2300px;
border: 2px solid  #540708 !important;
padding: 5px; ==> background: #161616; <== border: 3px solid #313131; -moz-border-radius: 10px; -khtml-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; box-shadow: 0 0 5px #000000; -moz-box-shadow: 0 0 5px #000000; -webkit-box-shadow: 0 0 5px #000000; }


[Anastaise]

Does that allow me to change only the color above the menu?  Sorry - I'm a newb...

[Crip]

It does / it changes The Entire Theme to your color , but not just the Logo / menu Area .. Can you make a Transparent Banner?..that would help..

[Crip]

With FireBug it doesn't look bad #background: 000;

[Anastaise]

I could possibly figure out how to make the text area between the 2 images transparent, but that would look like crap with a different color behind the text and then 2 black/red square images on either side.  That is why I was hoping to modify the logo area background just above the menus.

I did the images and background color in photoshop elements and then copied them into powerpoint so I could get the text customized the way I wanted it and then saved it as a png file.  Photoshop elements has very limited text customization (at least that I could find).

[Crip]

Check your PM's ..

[Crip]

You can try this Banner..?

[Anastaise]

I still like the black better - I went ahead and changed the background to black - which looks good except for a strange grey bar that's poking out above the menu area.

[Crip]

I will check that..brb.

[Crip]

Go here: css/index.css and change:

Code Select Expand

#toolbar { font-size: 90%; background: #161616 url(../images/theme/toolbar.gif) repeat-x; height: 32px; margin-left: 20px; margin-right: 20px; margin-bottom: 25px; }

To:

Code Select Expand

#toolbar { font-size: 90%; background: #000000 url(../images/theme/toolbar.gif) repeat-x; height: 32px; margin-left: 20px; margin-right: 20px; margin-bottom: 25px; }

[Crip]

Found 2 more places that also can be Changed:
css/index.css
===========

Code Select Expand


/* Styles for the general looks for the Curve theme.
------------------------------------------------------- */

/* the framing graphics */
#header
{
background: #161616;   <==========
}
#header div.frame
{
background: #161616;   <==========
display: block;
}


[ZarPrime]

Crip,

You could also find that 12px under Doom Styles, or whatever it is and change it to 0px.

ZP

[Crip]

Yes sir , you could do that too

[ZarPrime]

Here it is, almost at the very bottom ...

Code Select Expand

/* Doom Styles.
--------------------------------------------------------- */
#header { height: 12px;}


[Anastaise]

ok - made the edits - what do you think?

I also changed the banner image to only have it on the left since on smaller screen it bled over into the log-in area.

edit:  now i'm thinking I would like to make that grey bit on the right left edge to be black too...

[Crip]

It looks fine to me  , it was only a few color changes..

[Crip]

totally up to you.

[Anastaise]

which part would I need to edit to make that strip of grey to each side black?

See my attachment with the horrible yellow paint to see what i'm referring to...

[ZarPrime]

That would be as follows ...

Code (Find This) Select Expand


/* the content section */
#content_section
{
background: #161616;
padding-left: 20px;
padding-right: 20px;
}


Code (and Replace with This) Select Expand


/* the content section */
#content_section
{
background: #000000;
padding-left: 20px;
padding-right: 20px;
}


[Anastaise]

it's perfect - i love it

Thank you so much for all of the help.  You are the best.

btw - I love your themes Crip 

[ZarPrime]

No problem, that's what we are here for.  I will go ahead and mark this topic solved.

ZarPrime

[Crip]

Good solution indeed ZP.

[ZarPrime]

Thank you Sir. I take that as a complement, especially since it came from the Theme Master.

ZP