"TIP" "style_GC_whole_network.css" Update Version 5.4

[George H. Compton IV]

This stylesheet will add styles and animation fx throughout your whole network blogs, forums, groups, latest activity, comments and a whole lot more.  :-)

I put it into a stylesheet because of the amount of code it takes to do this.  So it's really easy to add and remove from your NC custom code box

If you'd like to view the Codes in The stylesheet just click here

click here to see it live on cross roads Fellowship

just add this code to the top of your NC custom code box.

<link rel="stylesheet" type="text/css" href="http://api.ning.com:80/files/wKr*gaUtwNYGYxS1TQJ0GxQwgV-e8eRB1rKt0Twd2LHNnRi5*ZBHQlAX5k7M011-H629FQFxfuPRDWLhVLOyEEwjVgHgks54/style_GC_whole_network.css" />

 

Remember everyone results may vary because of the differences in Ning networks. But I did spend week's working on compatibility for The different ning networks, layouts and themes..

This was design on a Ning pro account and tested on many Ning Networks

If you would like me to change anything in this code or remove anything for you just ask I'll be more than happy to help

 

Editing the colors in the stylesheet. in these codes just change the word transparent to any color you want.

this code will change the group's mouse hover color

    DIV.xg_module.module_groups LI.xg_lightborder:hover{
       background-color:transparent!important;}

    These three codes will change the activity feed colors

    .xg_module_activity .feed-story-status .status-update:hover{
       background-color:Transparent !important; }


    .xg_module_activity .feed-story-status .status-update{
       background-color:Transparent !important; }

    .xg_module_activity SPAN.comments-number {
       background-color:transparent !important; }

    This code will change The forum Mouse hover color

    .module_forum div.vcard div.topic:hover{
       background-color: transparent!important;}

    and this one will change the color of the blogpost mouse hover Color

     .module_blog .blogpost:hover{
       background-color:transparent !important; }

    And this code will change the red continue button

     A.xj_expandable {
       background:transparent !important;}

This code will change the color of the text in the continue button.

A.xj_expandable {
       color:#15c708;}

All module shadows in this code you can change the ( shadow colors #ccc ) for the shadow colors change all three ( Border colors #aaa ) and (  Border thickness 2px )

.xg_module {
   border:2px solid #aaa!important; -webkit-box-shadow:6px 6px 10px
   #ccc!important;-moz-box-shadow:6px 6px 10px
   #ccc!important;box-shadow:6px 6px 10px
   #ccc!important;-ms-filter:"progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
   filter:progid:DXImageTransform.Microsoft.Shadow(Strength=4,Direction=135,Color='#000000');}


    I believe that's all the major colors there are in the stylesheet

Here's two pic's of the main page here on creators with this stylesheet virtually added

Here's a couple more snapshots of the Main page and groups page.. right click and open them in a new tab to get a better view

[Rosas † Negras]

I recommend you create test network goodnight

[George H. Compton IV]

this will fix the Google Chrome glitch in your Members modules on your main page 

This code goes at the bottom of your NC custom code box

<style>
.xg_module_body, .xg_module_body legend, .xg_module_body legend.toggle a, .xg_module_foot, ul.page_tabs li.this {
    font-size: 1.0em !important;}
</style>

This is a two frame animated Image if the animation is not working Right-click on the image and open it in a new tab to get a better view.

[Damien Hannah]

George, could I bother you one time to maybe get a code just like this, but for photo thumbnails? My photo thumbnails do this as well as the members.

(I use small round thumbnails on members now, but would like the photos thumbnail positions to be secure.)

Thank you George, I hope this wasn't something I could have done, but the reference on the above code looks a little confusing. lol.

[George H. Compton IV]

I went for your whole network with Google chrome

The only Google chrome glitch I see is on your main page members module it's not doing that but the Square icons are above the rounded borders this will fix that

add this code either to the bottom of your stylesheet or the bottom of your NC custom Code box :)

div.xg_module.module_members ul.clist li img.photo {
    border-radius:25px ;
    -moz-border-radius:25px ;
    -webkit-border-radius:25px ;
    -khtml-border-radius:25px ;
}

[Mary Jane Peterson]

Hi George

I have seen on so many Ning site that there is a vote for my site and I have also seen trophy's too, Please can you help as I would like to do have some thing like that on  on my site too, thank you so much for my theme you did, How can I do screenshots of my site for www.b-yond.co

[George H. Compton IV]

I'm not sure what to use for the trophies in the voting for your site.  I did take a few snapshots of your network for you.. :)

right click on the images and open them in a new tab to get a better view.

main page

group page

forum page

[Mary Jane Peterson]

Hi George 

Thank you so much for what you have done for me, your are a star as always :) 

[Mary Jane Peterson]

Hi George, 

I have found these trophies on line. Do you think we can use them  in the voting for our site www.b-yond.co  

Thank you so much :)

[Mary Jane Peterson]

Hi George 

Google is playing up again :( in members modules please can you help thank you www.b-yond.co 

[George H. Compton IV]

Google has destroyed Google chrome lol

This will fix that Glitch.  Put this code at the bottom of your NC custom code box.

<style>
div.xg_module.module_members ul.clist  {
padding:1px!important; }
</style>

[George H. Compton IV]

I'm not doing any more Google chrome fixes until the issue has been resolved with either Ning or Google.  The fixes that I have made may only be temporary until the actual issue with Google chrome is resolved.

So remember which Google chrome fixes you've used you may need to remove them later after the issue has been resolved

[Rosas † Negras]

I  add codes, pictures are too large and groups are not precise as you can see it posted again on the left thank you in advance