Inserting CSS inside a JS script, in diferent skins, for ProBoards Forums

[Charmed]

Hello.
I am new here.
And I have a forum hosted by proboards.
http://www.CharmedSkins.co.nr

ProBoards has a feature to allow members to choose diferent skins (forum layouts), that are created by the admins of the forums.
You can see what skin you are using.
Just go to Source Code > Find "var pb_skinid = X;"
X = number of the skin.
You, as a guest, will see "var pb_skinid = 1;"
But I only have one skin too.

They also allow us to costumize our pages with anything we would like to add to the body of the page. They have something called headers/footers option, where we can insert JS, CSS, HTML, etc, into the forum pages.

A bad thing about ProBoards, is that they do not have headers/footers for diferent skins. If we put a CSS code to make a: hover links go black, all the hover links, in all skins will go black.

Which is why some people came to a nice solution for JS for diferent skins:
<script type="text/javascript">
<!--

if(pb_skinid == 1){

// gigantic masses of code here

}else if(pb_skinid == 2){

// more gigantic masses of code

}

// -->
</script>
That way we have diferent JS for diferent skins.

But the problem is, I do not know how to do that in CSS. So, instead of having to host files, I would like to know, if is it possible to put CSS inside a Javascript code ?

I have already tried this:
<script type="text/javascript">
<!--
var thecss = 'all css in here';
document.write(thecss);
//-->
</script>
And also tried:
<script type="text/javascript">
<!--
document.write('all the css in here');
//-->
</script>
But nothing works.

Does anyone know how do I insert CSS inside JS ? :)

Thank you :)

[Ascendancy]

Uhm, as far as I know no, you can't have a script tag inside of a script tag. The only Idea is that you could have separate stylesheets for the different skins, or you could just add the JavaScript into the CSS?

[Charmed]

Really ? I can do that ?

How can I have diferent CSS for diferent skins ? :)

And how do I put JS into CSS ? :)

[Ascendancy]

Well, the first option is considerably easier, but what you do is you could save the CSS as different files, most easiest to the server. Then it is called whenever you load the skin. Are you sort of following me?

[Charmed]

I know what your talking about,
but the main reason of all this thread is for me not to have to host files.
I don't like that, dunno why, maybe some sort of cyber-phobia (in this case, outside hosted file-phobia).
What I'd really like would be a way to add all the CSS in the forum, with ways of going each to each skin (like that JS code I posted)
Are you sort of understanding me ?

[Ascendancy]

Well the thing is, you have the variable as the css text, but then where are you going to put it? You can't have a separate stylesheet access the JavaScript there, and it would probably be easier to just make different CSS styles anyways.

I know what your saying, but it really would be so much easier to just use different CSS styles. I like your idea, though.

[Charmed]

Thanks :)

Well, I kinda found a way. :D

In this code:
<script type="text/javascript">
<!--

if(pb_skinid == 1){

// gigantic masses of code here

}else if(pb_skinid == 2){

// more gigantic masses of code

}

// -->
</script>
I can add this:
<script type="text/javascript">
<!--

if(pb_skinid == 1){

// the css of skin 1

document.write('<style type="text/css"> a:hover { color: #000000; } </style>');

// gigantic masses of code here

}else if(pb_skinid == 2){

// the css of skin 2

document.write('<style type="text/css"> a:hover { color: #FFFFFF; } </style>');

// more gigantic masses of code

}

// -->
</script>
What do you think ? :)