Topic: custom CSS for blocks help

[daphat]

SMF 2.0R4
SP 2.3.3

I would like to first thank anyone who is going to lend a hand on this. Im not 100% sure about how CSS works into this so ill make this as clear as i can.


I am programing a guild website and we play multiple games. I was going to customeize themes so it looked different based on the game you play and you can change it at any time. I like to use a backround image in my blocks and would like this to change each time a different theme is selected.

I am makeing an assumption that to do this i will have to make some custome CSS setups and use the Custom Body Class option. And in the templates i would need the Custom Body Class = the same name. Currently i have "background: transparent url('/images/riftbackrdgraysmall.jpg') top center no-repeat;" typed in the Custome Body Style option. How can i make a custome class that would reflect that and were would i put it in the css files? I would like the custom class to be something like "RG_Block_BR" or something along the lines of that.
Again i am making the assumption that as long as I add the new style option to each template the back round will change based on the template selected?

The Whos Online block shows the custom backround along with the login and calendar blocks
my site is
\Removed URL

---- EDIT___

Another idea is there a way to reference the theme directory for images? Like a variable i can put in the custom code block like $theme? so the block would change to $variable/image/backrounimage.jpg?

Thanks in advance
Charles

[AngelinaBelle]

If your site is using multiple themes, you can add your custom simpleportal theme definitions to the portal.css file in each of your themes.
 
You can give it a generic name like "portal_block_header" and "portal_block_body", and use exactly the same background image in every single CSS file -- just supply different images in each Themes images directory, all with the same filename.  You can play with the different background colors in the different CSS files, so each one is different.
 
This is really a themes and graphics question, so I've moved it.

[daphat]

TY much for the quick reply.

Is it posible you can give me an example of what i would add to the portal.css file? and does it matter were I add it at?

[daphat]

so i added this to the end of the portal.css file in my custom theme directory. doesnt seem to work what could i be missing?

/* ************************************* */
/* RG STYLES ADDED                       */
/* ************************************* */

.rgwidnowsbg1
{
background: url(../images/riftbackrd.jpg) top center no-repeat;
}

[AngelinaBelle]

I see that, on your portal page, you use titlebg for block titles and windowbg and windowbg2 for the bodies.
 
So, it seems like you don't have to do anything.
 
If you install a second theme, and it has have different background images for the body, titlebg, windowbg, and windowbg2 (and the topslice and botslice for both windowbg and windowbg2), then, automatically, everything will look different when users choose a different theme.
 
How many themes do you now have installed?
 
Are you actually using class=rgwidnowsbg1 anywhere?  (widnows?)
 
 

[daphat]

Yea i changed them back to put the images back in.

Thanks a lot i cant belive i missed that type. I read it 3 times and for some reason i didnt catch that.

after the change the custome ccs works. Your awsomesacue thanks for your assistance

[AngelinaBelle]

Congratulations!
marked solved.