Badges

Badges 1.0.6

No permission to download

Ozzy47

Well-known member
Not too difficult to do, I use grids throughout my site for different addons. Something like this should work

Code:
[data-template="help_page"] .badge-category .block-body {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    grid-gap: 6px;
}
[data-template="help_page"] .badge-category .block-body .block-row.block-row--separated {
    padding-top: 25px;
    border-radius: 5px;
}
[data-template="help_page"] .badge-category .block-body .contentRow {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}
[data-template="help_page"] .badge-category .block-body .contentRow .contentRow-figure {
    margin-bottom: 10px;
}
[data-template="help_page"] .badge-category .block-body .contentRow .contentRow-main {
    padding-left: 0px;
}
a.extra-item.badge-awarded {
    background: #4f5d73;  /// change as required ///
    padding: 5px 10px;
    border-radius: 5px;
    color: #fff; /// change as required ///
}

Nice when people share their tweaks to the community. :)
 

Faust

Well-known member
Not too difficult to do, I use grids throughout my site for different addons. Something like this should work

Code:
[data-template="help_page"] .badge-category .block-body {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    grid-gap: 6px;
}
[data-template="help_page"] .badge-category .block-body .block-row.block-row--separated {
    padding-top: 25px;
    border-radius: 5px;
}
[data-template="help_page"] .badge-category .block-body .contentRow {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}
[data-template="help_page"] .badge-category .block-body .contentRow .contentRow-figure {
    margin-bottom: 10px;
}
[data-template="help_page"] .badge-category .block-body .contentRow .contentRow-main {
    padding-left: 0px;
}
a.extra-item.badge-awarded {
    background: #4f5d73;  /// change as required ///
    padding: 5px 10px;
    border-radius: 5px;
    color: #fff; /// change as required ///
}

Does not work when I did put the code on extra less.
 

VersoBit

Well-known member
This addon appears to be available on GitHub as a MIT Licensed Project. Seeing as there has not been much activity and I have attempted to contact CMTV (May 6, 2020; and June 1, 2020) to ask about seeing the repo updated to 1.0.6 for patching and received no response.

We have forked this project from the Repo that was available at: https://github.com/CMTV/XF2A-Badges

It looks like the repo is behind a minor version from the released version; If you would like to see any of the bugs fixed in this addon that have not been fixed; please drop an issue here: https://github.com/VersoBit/XF-Badges

I will also be reviewing the thread for any issues reported and integrating the posted fixes with Credit applied. I will contact anyone who has posted fixes in this thread for their GitHub username.

We rely on this addon for some functionality on our site and we need certain things fixed to continue its use. We plan to make this addon fork a drop-in replacement for 1.0.6.
I am almost done implementing most of the fixes needed on XF2.1 before I swap over to adding XF2.2 compatibility; There is a pre-release for XF2.1.x series (download here). INSTALL AT YOUR OWN RISK

As a reminder, if there is anything you'd like to report that has not already been fixed or added to our issue list, feel free to contribute. (see fixed list here)

This fork of @CMTV's badges will continue as its own resource on Xenforo once 1.0.7 is ready to release.
 

koraldon

Member
This addon's template modification with the modification key "CMTV_Badges_member_tooltip" needs the Find pattern updated for XF 2.2.1 (probably 2.2 as well) to:
XML:
<xf:if contentcheck="true">
                        <div class="memberTooltip-blurb">
                        <xf:contentcheck>
                            <xf:userblurb user="$user" tag="div" />
                        </xf:contentcheck>
                        </div>
                    </xf:if>
Doesn't seem to solve the issue.
It only seem to add some spaces to the lines and after changing it on my site and rebuilding the extension, the tooltip still doesn't work.
 

Gemma

Well-known member
Well. Probably I need to try again. As I tried and messed up all code which I had.
Did you get the code working? I've reverted the post back to the original code as I've double-checked and actually installed it on a Themehouse style (UI.X 2) without any issues.
 

Faust

Well-known member
Did you get the code working? I've reverted the post back to the original code as I've double-checked and actually installed it on a Themehouse style (UI.X 2) without any issues.

Yes I did. Works fine, but not what I was expecting. I was looking to be shown in proper grid, each individual badge to be wrapped.
 

Brettflan

Active member
Doesn't seem to solve the issue.
It only seem to add some spaces to the lines and after changing it on my site and rebuilding the extension, the tooltip still doesn't work.
Not sure what to tell you, then. That specific template modification for this addon was no longer working/matching (which is indicated in the template modification list) due to the spacing changes made to that template by the XF devs. Correcting that Find pattern for that template modification based on the slightly changed source template now shows it as active again, and it is working for me.
No need to rebuild the addon after that change, by the way; XenForo recompiles the appropriate output template when you make changes to a template modification.

EDIT:
Ah, I see. For some reason the Code block here on the XF Forums converted tabs to spaces. Let me try this again:

This addon's template modification with the modification key "CMTV_Badges_member_tooltip" needs the Find pattern updated for XF 2.2.1 (probably 2.2 as well) to:
Code:
<xf:if contentcheck="true">
						<div class="memberTooltip-blurb">
						<xf:contentcheck>
							<xf:userblurb user="$user" tag="div" />
						</xf:contentcheck>
						</div>
					</xf:if>
There, that's correct. For some reason, here on the official XF forums, I had to switch to raw BBCode view to paste in that code and not have it replace tabs with spaces.

I would fix the original post with this, but I am unable to edit or delete that post now.
 
Last edited:

VersoBit

Well-known member
I can't make this add-on work. It's letting me manually award a badge to a user, but it won't automatically award a badge according to the criteria set - user is a member of group {X}. I've run the CRON rebuild job... still badges aren't showing up for members of the group specified.
This will be resolved in 1.0.7, see ACP addition here: https://github.com/VersoBit/XF-Badges/issues/10
For those asking to disable the emails...
This will (also) be resolved in 1.0.7, see ACP addition here: https://github.com/VersoBit/XF-Badges/issues/9
A Global Disable has been added, and should you not globally disable, 1.0.7 will also implement checking for the users alert setting. (see issue)

Anything else (issue wise) I should resolve for xf-2.1.x before I add xf-2.2.x compatibility? (bonus points if you add it as an issue on the git 😉)

I would suggest to change two lines in CMTV_Badges_featured_badges.less, so the last row would be also centered.
Fix applied for v1.0.7 (see issue)

Users can now define alert preferences, and are overridden by the global. (see issue)

I will now be prepping to release.
 
Last edited:

VersoBit

Well-known member
v1.0.7 has been released

This version is a drop-in replacement for CMTV-Badges.

Expect to see branding changes on the addon, it will be renamed from "Badges" to "[VersoBit] Badges"

This version is the last version that will support XenForo 2.1.x


Change Log​

  • Missing Phrase: alert_opt_out.badge_award #6
  • Stop checking for badges if user is deleted #7
  • Honor User Preferences for Email Notifications #8
  • Globally Disable Email Notifications #9
  • Badges are not assigned to users who have not been recently active #10
  • CSS flex instead of grid for featuredBadges class #15
Please use the new addon's discussion thread for issues, or raise them on the GitHub repo if you would like credit for the fix. (bonus points if you add a PR).

Thanks everyone, hope this release works for everyone.
 

btmgreg

Well-known member
Not too difficult to do, I use grids throughout my site for different addons. Something like this should work

Code:
[data-template="help_page"] .badge-category .block-body {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
    grid-gap: 6px;
}
[data-template="help_page"] .badge-category .block-body .block-row.block-row--separated {
    padding-top: 25px;
    border-radius: 5px;
}
[data-template="help_page"] .badge-category .block-body .contentRow {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
}
[data-template="help_page"] .badge-category .block-body .contentRow .contentRow-figure {
    margin-bottom: 10px;
}
[data-template="help_page"] .badge-category .block-body .contentRow .contentRow-main {
    padding-left: 0px;
}
a.extra-item.badge-awarded {
    background: #4f5d73;  /// change as required ///
    padding: 5px 10px;
    border-radius: 5px;
    color: #fff; /// change as required ///
}

@Russ Any tips for getting this working on XenBase? :D
 

Brad P

Well-known member
You can try this code @btmgreg from my site https://chatbanter.com/help/badges/ i had it made but looking at my extra.less template i found the below.
Code:
[data-template="help_page"] {
    .block-header {
        display: flex;
        &:before {
            font-family: 'Font Awesome 5 Pro';
             margin-right: 10px;
        }
    }
    .p-body-sideNav {
        display: none;
    }
    .p-body-main--withSideNav .p-body-content {
            padding-left: 0;
        display: block;
    }
    .p-body-main {
        width: unset;
        display: block;
    }
    .badge-category  {
        .block-container {
            background: transparent;
        }
        .block-body {
                display: grid;
                grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
            grid-gap: 20px;
            margin-top: 20px;
            .block-row.block-row--separated {
                padding-tp: 24px;
                background-color: #fff;
                border-radius: 5px;
            }
            .contentRow {
                flex-direction: column;
                justify-content: center;
                align-items: center;
                text-align: center;
                .contentRow-figure {
                    margin-bottom: 10px;
                }
                .contentRow-main {
                    padding-left: 0px;
                }
            }
        }
    }
    .badge-category--2 {
        .block-header:before {
            content: "\f4fc";
        }
    }
    .badge-category--1 {
        .block-header:before {
            content: "\f2b9";
        }
    }
    .badge-category--4 {
        .block-header:before {
            content: "\f0c0";
        }
    }
}
 

btmgreg

Well-known member
I don't see why it wouldn't work, make sure you're editing the right style. I believe Gemma uses that edit on our styles just fine.
I'm editing Xenbase - Extra.css - The same code. I wonder if @Gemma can shed any light?

Many thanks :)

This is the result
1607376448575.png
 

btmgreg

Well-known member
You can try this code @btmgreg from my site https://chatbanter.com/help/badges/ i had it made but looking at my extra.less template i found the below.
Code:
[data-template="help_page"] {
    .block-header {
        display: flex;
        &:before {
            font-family: 'Font Awesome 5 Pro';
             margin-right: 10px;
        }
    }
    .p-body-sideNav {
        display: none;
    }
    .p-body-main--withSideNav .p-body-content {
            padding-left: 0;
        display: block;
    }
    .p-body-main {
        width: unset;
        display: block;
    }
    .badge-category  {
        .block-container {
            background: transparent;
        }
        .block-body {
                display: grid;
                grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
            grid-gap: 20px;
            margin-top: 20px;
            .block-row.block-row--separated {
                padding-tp: 24px;
                background-color: #fff;
                border-radius: 5px;
            }
            .contentRow {
                flex-direction: column;
                justify-content: center;
                align-items: center;
                text-align: center;
                .contentRow-figure {
                    margin-bottom: 10px;
                }
                .contentRow-main {
                    padding-left: 0px;
                }
            }
        }
    }
    .badge-category--2 {
        .block-header:before {
            content: "\f4fc";
        }
    }
    .badge-category--1 {
        .block-header:before {
            content: "\f2b9";
        }
    }
    .badge-category--4 {
        .block-header:before {
            content: "\f0c0";
        }
    }
}
Aw. Thank you - but it doesn't seem to make any changes for some reason.
 
Top