Thank you for this extension...it is exactly what I needed. I modified the code to add a bar graph, for anyone who wants it:
Please note that the Tag must have a custom color set in order for it to show. I have the % in the js file at 1% because my forum has small # of posts. For larger forums, just leave it at % and delete the 1 (or even add decimal places, as necessary).
js:
(() => {
var e = {
n: (t) => {
var o = t && t.__esModule ? () => t.default : () => t;
return e.d(o, { a: o }), o;
},
d: (t, o) => {
for (var n in o) e.o(o, n) && !e.o(t, n) && Object.defineProperty(t, n, { enumerable: !0, get: o[n] });
},
o: (e, t) => Object.prototype.hasOwnProperty.call(e, t),
r: (e) => {
"undefined" != typeof Symbol && Symbol.toStringTag && Object.defineProperty(e, Symbol.toStringTag, { value: "Module" }), Object.defineProperty(e, "__esModule", { value: !0 });
},
},
t = {};
(() => {
"use strict";
e.r(t);
const o = flarum.core.compat["forum/app"];
var n = e.n(o);
const r = flarum.core.compat["common/extend"],
a = flarum.core.compat["tags/components/TagLinkButton"];
var c = e.n(a);
const s = flarum.core.compat["tags/components/TagsPage"];
var i = e.n(s);
const l = flarum.core.compat["common/utils/classList"];
var u = e.n(l);
const d = flarum.core.compat["tags/common/helpers/tagIcon"];
var f = e.n(d);
const p = flarum.core.compat["common/components/Link"];
var g = e.n(p);
const v = flarum.core.compat["tags/common/utils/sortTags"];
var T = e.n(v);
n().initializers.add("datlechin/flarum-discussion-count", function () {
(0, r.override)(c().prototype, "view", function () {
var e = this.attrs.model,
t = e && e.description(),
o = u()(["TagLinkButton", "hasIcon", this.attrs.className, e.isChild() && "child"]);
return m(
g(),
{ className: o, href: this.attrs.route, style: e ? { "--color": e.color() } : "", title: t || "" },
m("div", {"class":"captivation","style":{"background-color": e.color(),"width": e.discussionCount() + "1%", "border-radius":"3px 0px 0px 3px", "padding": "5px"}},f()(e, { className: "Button-icon" }),f()(e, { className: "Button-icon" }),
m("span", { className: "Button-label" }, e ? e.name() : n().translator.trans("flarum-tags.forum.index.untagged_link"), " (", e.discussionCount(), ")"))
);
}),
(0, r.extend)(i().prototype, ["oncreate"], function () {
var e = this.tags;
document.querySelectorAll(".TagTile-info").forEach(function (t) {
var o = t.querySelector(".TagTile-name").innerText,
n = e.find(function (e) {
return e.name() === o;
}),
r = T()(n.children() || []),
a = n.discussionCount();
t.querySelectorAll(".TagTile-children a").forEach(function (e) {
var t = e.innerText,
o = r.find(function (e) {
return e.name() === t;
}),
n = o.discussionCount();
e.innerText = t + " (" + n + ")";
}),
(t.querySelector(".TagTile-name").innerText += " (" + a + ")");
});
});
});
})(),
(module.exports = t);
})();
//# sourceMappingURL=forum.js.map
css (you can change styling according to your own needs):
.IndexPage .TagLinkButton{
font-weight: bold !important;
color:#000 !important;
}
.IndexPage .TagLinkButton when (@config-dark-mode =true){
color:#fff!important;
}
.IndexPage span.Button-label{
color: white;
text-shadow: 2px 2px 5px black, 0 0 2px black, 0 0 2px black;
}
