Change new user group banner color

[Thedunes]

Hello,

I created a new user group called Founding Member and wanted to change the banner colors, is there a way to create a user group so it shows up as an option in the Pixel Exit style so I can change the colors with the drop-down menu like I can for registered users or do any new users groups pull the style info from Xenforo and not my Pixel Exit style?

I know I can add custom CSS but I was hoping it would sync back to the Nova style so I could use the menu instead of learning CSS if it can't be done is there a third-party add-on you recommend?

Thanks,

John

 

[Russ]

Hello,

I hope I'm understanding correctly. We do have an option to easily change banners / prefix colors in our style properties. I mention prefix because it works the same way.

When you set a banner style in the usergroup as I've done (royalBlue):

If you go to Style properties -> User banners -> Royal Blue Banner, this will let you adjust the background/border/text colors here.

Is that what you were after?

 

[Thedunes]

Russ,
You are understanding correctly, unfortunately, I had already made a few changes provided by another Xenforo user and I made those changes to extra.less. I'm not sure if those changes get saved to the parent or Nova style but the changes did remove the background from the banner.

When I removed the background color it left the border outline, at least the way I did it. If I wanted to remove the border from your example above would I just remove the code in the color box under border changes?

My forum is starting to slowly grow and just when I start to feel comfortable I come across something that I am probably making more complicated than it should be. I do appreciate how easy your style is to use, I know it's me

Thanks,

John

 

[Russ]

First and foremost, make sure all of your edits are being done inside the child style. The parent Nova has the words "DO NOT EDIT" in it for a reason. You'll lose any edits you make directly in the Nova style when you upgrade.


The border with is set globally in the banners under that "Default banner base". You can change the border-width to 0 and it will make it so none of the banners have a border. You could also do banner specific edits and change the border width there. You can undo the extra.less edits and use our properties if you want. Editing extra.less is fine, we just have properties for those so might as well use them if you can.

 

[Tracy Perry]

I know I can add custom CSS but I was hoping it would sync back to the Nova style so I could use the menu instead of learning CSS if it can't be done is there a third-party add-on you recommend?

It's not THAT hard to do it in in CSS/LESS.

.label
{ 
    &:after
    {
        padding-left: 4px;
        .m-faBase();
    }   
    &:before
    {
        padding-right: 4px;
        .m-faBase();
    }

    &.label--
    {       
/* User Banner custom configs */
       
        &site_owner:before
        {
            .m-faContent(@fa-var-telescope);
            font-size: 15px;
            color: #f6a17b;
        }
        &site_member:before
        {
            .m-faContent(@fa-var-meteor);
        }
        &site_member5:before
        {
            .m-faContent(@fa-var-moon-stars);
            font-size: 15px;
            color: #f7bd61;
        }
       
        &site_founding_member:before
        {
            .m-faContent(@fa-var-galaxy);
            color: #872402;
            font-size:15px;
        }
       
    }
}

/* User Banner modifications */
.label.label--site_owner {
    color: #fff;
    background: #720f94;
    border-color: #9821ce;
}
.label.label--site_member {
    color: #050505;
    background: #a47909;
    border-color: #ce9521;
}
.label.label--site_member5 {
    color: #f3efef;
    background: #223d89;
    border-color: #403b9d;
}
.label.label--site_founding_member {
    background: #7eb5e8;
    color: #35354b;
    border-color: #140f66;
}
/* End User Banner modifications */

No, you can't select them via a drop down... but assigning them via the user groups works as well.
If you notice, I assign specific FA icons to each group.

 

[Thedunes]

@Tracy Perry Thanks for the detail and photos that helped out a lot.

 

[Tracy Perry]

@Tracy Perry Thanks for the detail and photos that helped out a lot.

Let out the appropriate tag to use in the group profile.

 

[Thedunes]

@Tracy Perry I had never coded before or started a forum but the forums available for us had become so full of trolls I decided to create one myself at www.speedutv.net, if it weren't for the Pixel Exit style I would be in real trouble. I started to try and learn CSS so I could understand what the changes actually do. The Xenforo platform is good but it assumes some level of skill before you dive in.

Thanks again for taking the time to reply.

 

[Tracy Perry]

@Tracy Perry I had never coded before or started a forum but the forums available for us had become so full of trolls I decided to create one myself at www.speedutv.net, if it weren't for the Pixel Exit style I would be in real trouble. I started to try and learn CSS so I could understand what the changes actually do. The Xenforo platform is good but it assumes some level of skill before you dive in.

Thanks again for taking the time to reply.

It takes time... just don't get frustrated.
And the styles here are REALLY easy to work with. My site (an astronomy/astrophotgraphy niche) has several tweaks done to Bolt.... I also have Blackened Pro as a dark option... but prefer Bolt.
Russ & Co. are a great group of folks to deal with... and they have some of the best styles there are as far as features go. Support is also fantastic.