58 replies to this topic

[MordyT]

We have ibProArcade2.7.0+ installed, but the skin isn't working so well.....
Anyone made a correct skin?

[Sean James]

The problem is not with this skin, but the CSS within the ibproarcade, vbulletin.org i believe has a fix for this

[MordyT]

Could you link me to this fix? I search vb.org and found something but nothing seems to work.
I used firebug, changed the code on like 3 things and it looks perfect...

[acco]

Sean said:

The problem is not with this skin, but the CSS within the ibproarcade, vbulletin.org i believe has a fix for this

Sean was the fix to do with fixing the boxes around the games? If so I used that fix myself which done the job but if you see the attached pic I think you'll see what I think MordyT is going on about.. This is what it looks like in my forum.

[ATTACH=CONFIG]1958[/ATTACH]

I've highlighted the txt on the lefthand side just in case you were not sure what I was going on about, also if you check the members list, this to can be very hard on the eyes.

Attached Thumbnails

• 

[Sean James]

Send me a link to one of your arcades if you can, i will use firebug to find the CSS and then post what u need to add to your additional CSS template

[Bluepearl Fan]

I have this Arcade and the link in the navbar is now gone since installing BP-Black.

Please help.

[Sean James]

ok the problem is the arcade uses custom CSS which works fine if your using a white template, but for darker templates its not so good.

.alt2, .alt2Active {
background-color: #e1e4f2;
background-image: none;
background-repeat: repeat;
background-attachment: scroll;
background-position: 0% 0%;
color: #000000;
}

.alt1, .alt1Active {
background-color: #f5f5ff;
background-image: none;
background-repeat: repeat;
background-attachment: scroll;
background-position: 0% 0%;
color: #000000;
}

So in your additional CSS template add this:

.alt2, .alt2Active {
background-color: #1a1a1a;
background-image: none;
background-repeat: repeat;
background-attachment: scroll;
background-position: 0% 0%;
color: #fff;
}

.alt1, .alt1Active {
background-color: #000;
background-image: none;
background-repeat: repeat;
background-attachment: scroll;
background-position: 0% 0%;
color: #fff;
}

[acco]

Sean said:

ok the problem is the arcade uses custom CSS which works fine if your using a white template, but for darker templates its not so good.

.alt2, .alt2Active {
background-color: #e1e4f2;
background-image: none;
background-repeat: repeat;
background-attachment: scroll;
background-position: 0% 0%;
color: #000000;
}

.alt1, .alt1Active {
background-color: #f5f5ff;
background-image: none;
background-repeat: repeat;
background-attachment: scroll;
background-position: 0% 0%;
color: #000000;
}

So in your additional CSS template add this:

.alt2, .alt2Active {
background-color: #1a1a1a;
background-image: none;
background-repeat: repeat;
background-attachment: scroll;
background-position: 0% 0%;
color: #fff;
}

.alt1, .alt1Active {
background-color: #000;
background-image: none;
background-repeat: repeat;
background-attachment: scroll;
background-position: 0% 0%;
color: #fff;
}

Did not work for me that but I manage to take the info you give and alter the ARCADE.css and all looks well now thanking you very much for your support :)
here is the new altered ARCADE.css to suits your BP-black skins.

.tborder {
background-color:{vb:stylevar doc_backgroundColor};
    border: 1px solid #c4c4c4;
    font-size: {vb:stylevar font-size};
}
.tcat {
    font:{vb:stylevar blockhead_font};
    color:{vb:stylevar blockhead_color};
    background:{vb:stylevar blockhead_background};
    padding:{vb:stylevar blockhead_padding};
    border:{vb:stylevar blockhead_border};
    -moz-border-radius-top{vb:stylevar right}: {vb:stylevar border_radius};
    -moz-border-radius-top{vb:stylevar left}: {vb:stylevar border_radius};
    -webkit-border-top-{vb:stylevar right}-radius: {vb:stylevar border_radius};
    -webkit-border-top-{vb:stylevar left}-radius: {vb:stylevar border_radius};
}
.tcat a:link, .tcat_alink
{
    color: #ffffff;
    text-decoration: none;
}
.tcat a:visited, .tcat_avisited
{
    color: #ffffff;
    text-decoration: none;
}
.tcat a:hover, .tcat a:active, .tcat_ahover
{
    color: #FFFF66;
    text-decoration: underline;
}
.alt1, .alt1Active
{
    background: #000;
    color: #fff;
}
.alt2, .alt2Active
{
    background: #1a1a1a;
    color: #fff;
}
/* ***** small padding on 'thead' elements ***** */
td.thead, th.thead, div.thead { padding: 4px; }
/* ***** basic styles for multi-page nav elements */
.pagenav a { text-decoration: none; }
.pagenav td { padding: 2px 4px 2px 4px; }
.tcat .shade, .thead .shade, .tfoot .shade { color: #DDDDDD; }
/* ***** define margin and font-size for elements inside panels ***** */
.fieldset { 
    padding: 5px;
    font-size: {vb:stylevar font-size};
         border: 1px solid #c4c4c4;
         margin: 0 2px;
}
.fieldset, .fieldset td, .fieldset p, .fieldset li { font-size: 11px; }

@ Bluepearl Fan, you need to go back to the arcade installation instructions and do the edits for the new skins you've added ;)

[Bluepearl Fan]

I redid the edit for the link and it didn't work. That prompted my question about it. And, the other edits for the arcade are for the posbit/postbit legacy and they are totally wrong and not working correctly. There's a discussion about it on vb.org.

Secondly, arcade.css would be the file to fix as per the posts above this one? I don't understand the "additional css template" comments.

[Sean James]

Additional CSS section allows template designers to add custom CSS to templates which overwrite any previous CSS properties.

You can find this template via style manager, css templates

[acco]

Bluepearl Fan said:

I redid the edit for the link and it didn't work. That prompted my question about it. And, the other edits for the arcade are for the posbit/postbit legacy and they are totally wrong and not working correctly. There's a discussion about it on vb.org.

Secondly, arcade.css would be the file to fix as per the posts above this one? I don't understand the "additional css template" comments.

The way I have my skins setup up, is to have a parent skin & then any other skin added I have as a child following the parent.
I don't bother with the Postbit Templates edits for arcade so for me it was a simple revert of navbar template to get the arcade link back in the new skins.


to get the navbar link back it should be find in navbar template:

<li><a href="calendar.php{vb:raw session.sessionurl_q}">{vb:rawphrase calendar}</a></li>

and below it add:

<li><a href="arcade.php{vb:raw session.sessionurl_q}">Arcade</a></li>

[MordyT]

acco said:

Did not work for me that but I manage to take the info you give and alter the ARCADE.css and all looks well now thanking you very much for your support :)
here is the new altered ARCADE.css to suits your BP-black skins.

.tborder {
background-color:{vb:stylevar doc_backgroundColor};
    border: 1px solid #c4c4c4;
    font-size: {vb:stylevar font-size};
}
.tcat {
    font:{vb:stylevar blockhead_font};
    color:{vb:stylevar blockhead_color};
    background:{vb:stylevar blockhead_background};
    padding:{vb:stylevar blockhead_padding};
    border:{vb:stylevar blockhead_border};
    -moz-border-radius-top{vb:stylevar right}: {vb:stylevar border_radius};
    -moz-border-radius-top{vb:stylevar left}: {vb:stylevar border_radius};
    -webkit-border-top-{vb:stylevar right}-radius: {vb:stylevar border_radius};
    -webkit-border-top-{vb:stylevar left}-radius: {vb:stylevar border_radius};
}
.tcat a:link, .tcat_alink
{
    color: #ffffff;
    text-decoration: none;
}
.tcat a:visited, .tcat_avisited
{
    color: #ffffff;
    text-decoration: none;
}
.tcat a:hover, .tcat a:active, .tcat_ahover
{
    color: #FFFF66;
    text-decoration: underline;
}
.alt1, .alt1Active
{
    background: #000;
    color: #fff;
}
.alt2, .alt2Active
{
    background: #1a1a1a;
    color: #fff;
}
/* ***** small padding on 'thead' elements ***** */
td.thead, th.thead, div.thead { padding: 4px; }
/* ***** basic styles for multi-page nav elements */
.pagenav a { text-decoration: none; }
.pagenav td { padding: 2px 4px 2px 4px; }
.tcat .shade, .thead .shade, .tfoot .shade { color: #DDDDDD; }
/* ***** define margin and font-size for elements inside panels ***** */
.fieldset { 
    padding: 5px;
    font-size: {vb:stylevar font-size};
         border: 1px solid #c4c4c4;
         margin: 0 2px;
}
.fieldset, .fieldset td, .fieldset p, .fieldset li { font-size: 11px; }

@ Bluepearl Fan, you need to go back to the arcade installation instructions and do the edits for the new skins you've added ;)

Bingo! This did it for me...

acco said:

Sean was the fix to do with fixing the boxes around the games? If so I used that fix myself which done the job but if you see the attached pic I think you'll see what I think MordyT is going on about.. This is what it looks like in my forum.

[ATTACH=CONFIG]1958[/ATTACH]

I've highlighted the txt on the lefthand side just in case you were not sure what I was going on about, also if you check the members list, this to can be very hard on the eyes.

That is exactly what I was looking to do....

Funny part is, I took firebug and "fixed it with just three color code changes, but could not figure out which file to edit with them...

[Bluepearl Fan]

acco said:

The way I have my skins setup up, is to have a parent skin & then any other skin added I have as a child following the parent.
I don't bother with the Postbit Templates edits for arcade so for me it was a simple revert of navbar template to get the arcade link back in the new skins.


to get the navbar link back it should be find in navbar template:

<li><a href="calendar.php{vb:raw session.sessionurl_q}">{vb:rawphrase calendar}</a></li>

and below it add:

<li><a href="arcade.php{vb:raw session.sessionurl_q}">Arcade</a></li>

I reverted and nothing was fixed.

- Will either add code as you mentioned

or

- found a hack

[Bluepearl Fan]

OK I got the link back but the background with the lettering makes it difficult to read.

Please advise

see screenshot

Attached Thumbnails

• 

[Bluepearl Fan]

Here's the actual screenshot corresponding to the above post.

Attached Thumbnails

• 

[Sean James]

Did you follow the instructions that came with the arcade?

Quote

@ Bluepearl Fan, you need to go back to the arcade installation instructions and do the edits for the new skins you've added ;)

Apparently you have to do template edits to make the arcade work properly with templates

[Bluepearl Fan]

I have done the template edits already. I will re-check myself.

[Bluepearl Fan]

OK, this is fixed! Thanks to everyone!!

[InternetMafia]

acco said:

Did not work for me that but I manage to take the info you give and alter the ARCADE.css and all looks well now thanking you very much for your support :)
here is the new altered ARCADE.css to suits your BP-black skins.

.tborder {
background-color:{vb:stylevar doc_backgroundColor};
    border: 1px solid #c4c4c4;
    font-size: {vb:stylevar font-size};
}
.tcat {
    font:{vb:stylevar blockhead_font};
    color:{vb:stylevar blockhead_color};
    background:{vb:stylevar blockhead_background};
    padding:{vb:stylevar blockhead_padding};
    border:{vb:stylevar blockhead_border};
    -moz-border-radius-top{vb:stylevar right}: {vb:stylevar border_radius};
    -moz-border-radius-top{vb:stylevar left}: {vb:stylevar border_radius};
    -webkit-border-top-{vb:stylevar right}-radius: {vb:stylevar border_radius};
    -webkit-border-top-{vb:stylevar left}-radius: {vb:stylevar border_radius};
}
.tcat a:link, .tcat_alink
{
    color: #ffffff;
    text-decoration: none;
}
.tcat a:visited, .tcat_avisited
{
    color: #ffffff;
    text-decoration: none;
}
.tcat a:hover, .tcat a:active, .tcat_ahover
{
    color: #FFFF66;
    text-decoration: underline;
}
.alt1, .alt1Active
{
    background: #000;
    color: #fff;
}
.alt2, .alt2Active
{
    background: #1a1a1a;
    color: #fff;
}
/* ***** small padding on 'thead' elements ***** */
td.thead, th.thead, div.thead { padding: 4px; }
/* ***** basic styles for multi-page nav elements */
.pagenav a { text-decoration: none; }
.pagenav td { padding: 2px 4px 2px 4px; }
.tcat .shade, .thead .shade, .tfoot .shade { color: #DDDDDD; }
/* ***** define margin and font-size for elements inside panels ***** */
.fieldset { 
    padding: 5px;
    font-size: {vb:stylevar font-size};
         border: 1px solid #c4c4c4;
         margin: 0 2px;
}
.fieldset, .fieldset td, .fieldset p, .fieldset li { font-size: 11px; }

@ Bluepearl Fan, you need to go back to the arcade installation instructions and do the edits for the new skins you've added ;)

Where does one find the ARCADE.css

Actually any .css file for that matter. When I try to add the ones to the theme it says they obsolete and dont give me the option to edit

Edited by InternetMafia, 13 February 2010 - 09:27 AM.

[InternetMafia]

Ok, figured out where to change the css. Thanks.