From 736f4a1880dd3de9021c66f33958477baa1dca53 Mon Sep 17 00:00:00 2001 From: awesomerobot Date: Thu, 2 Nov 2023 14:50:21 -0400 Subject: [PATCH 1/5] REFACTOR: update for core badge style removal --- common/common.scss | 23 ++++-- .../discourse/initializers/category-icons.js | 82 ++++++++----------- 2 files changed, 46 insertions(+), 59 deletions(-) diff --git a/common/common.scss b/common/common.scss index 38e0162..7b0d506 100644 --- a/common/common.scss +++ b/common/common.scss @@ -1,20 +1,25 @@ -span.category-badge-icon { +.badge-category.--has-icon { + // hide default bullet when icon is set + &:before { + display: none; + } +} + +.badge-category__icon { display: inline-flex; align-self: center; + color: var(--category-badge-color); .d-icon { - opacity: 1; - font-size: 1.3em; + color: inherit; + font-size: var(--font-up-2); } } -.categories-list .category h3 .d-icon, -.badge-wrapper .badge-category .d-icon, -.select-kit .select-kit-header .selected-name .name .badge-wrapper .d-icon { - margin-right: 5px; - margin-left: 0px; +.categories-list .category h3 .d-icon { + margin-right: 0.25em; + margin-left: 0; } -.badge-wrapper.bullet span.category-badge-icon .d-icon, .categories-list .category .category-icon .d-icon { color: inherit; } diff --git a/javascripts/discourse/initializers/category-icons.js b/javascripts/discourse/initializers/category-icons.js index dfdaad2..9920a57 100644 --- a/javascripts/discourse/initializers/category-icons.js +++ b/javascripts/discourse/initializers/category-icons.js @@ -32,11 +32,6 @@ export default { lockIcon, }); - function categoryStripe(color, classes) { - let style = color ? "style='background-color: #" + color + ";'" : ""; - return ""; - } - function getIconItem(categorySlug) { if (!categorySlug) { return; @@ -45,7 +40,7 @@ export default { let categoryThemeItem = categoryThemeList.find((str) => str.indexOf(",") > -1 ? categorySlug.indexOf(str.substr(0, str.indexOf(","))) > -1 - : "" + : "", ); if (categoryThemeItem) { @@ -62,13 +57,13 @@ export default { function buildTopicCount(count) { return `× ${count}`; } function categoryIconsRenderer(category, opts) { let siteSettings = helperContext().siteSettings; - let description = get(category, "description_text"); + let descriptionText = get(category, "description_text"); let restricted = get(category, "read_restricted"); let url = opts.url ? opts.url @@ -81,53 +76,38 @@ export default { let html = ""; let parentCat = null; let categoryDir = ""; + let dataAttributes = category + ? `data-category-id="${get(category, "id")}"` + : ""; + + /// Add custom category icon from theme settings + let iconItem = getIconItem(category.slug); if (!opts.hideParent) { parentCat = Category.findById(get(category, "parent_category_id")); } - const categoryStyle = opts.categoryStyle || siteSettings.category_style; - if (categoryStyle !== "none") { - if (parentCat && parentCat !== category) { - html += categoryStripe( - get(parentCat, "color"), - "badge-category-parent-bg" - ); - } - html += categoryStripe(color, "badge-category-bg"); - } - - let classNames = "badge-category clear-badge"; + let classNames = `badge-category ${iconItem ? "--has-icon" : ""}`; if (restricted) { classNames += " restricted"; } - let style = ""; - if (categoryStyle === "box") { - style = `style="color: #${get(category, "text_color")};"`; + if (parentCat) { + classNames += ` --has-parent`; + dataAttributes += ` data-parent-category-id="${parentCat.id}"`; } - html += - `"; - - /// Add custom category icon from theme settings - let iconItem = getIconItem(category.slug); + html += ``; if (iconItem) { - let itemColor = iconItem[2] - ? iconItem[2].match(/categoryColo(u*)r/) - ? `style="color: #${color}"` - : `style="color: ${iconItem[2]}"` - : ""; + let itemColor = iconItem[2] ? `style="color: ${iconItem[2]}"` : ""; let itemIcon = iconItem[1] !== "" ? iconHTML(iconItem[1]) : ""; - html += `${itemIcon}`; + html += `${itemIcon}`; } /// End custom category icon @@ -140,9 +120,10 @@ export default { if (restricted) { html += iconHTML(lockIcon); } - html += `${categoryName}`; + html += `${categoryName}`; + html += ""; - if (opts.topicCount && categoryStyle !== "box") { + if (opts.topicCount) { html += buildTopicCount(opts.topicCount); } @@ -150,15 +131,16 @@ export default { href = ` href="${href}" `; } - extraClasses = categoryStyle - ? categoryStyle + extraClasses - : extraClasses; - let afterBadgeWrapper = ""; - if (opts.topicCount && categoryStyle === "box") { - afterBadgeWrapper += buildTopicCount(opts.topicCount); + + if (opts.plusSubcategories && opts.lastSubcategory) { + afterBadgeWrapper += ` + ${I18n.t("category_row.plus_subcategories", { + count: opts.plusSubcategories, + })} + `; } - return `<${tagName} class="badge-wrapper ${extraClasses}" ${href}>${html}${afterBadgeWrapper}`; + return `<${tagName} class="badge-category__wrapper ${extraClasses}" ${href}>${html}${afterBadgeWrapper}`; } api.replaceCategoryLinkRenderer(categoryIconsRenderer); From ebe7c5f1a26adaabc83dd3f59b9b5013206f26bb Mon Sep 17 00:00:00 2001 From: awesomerobot Date: Thu, 2 Nov 2023 14:53:52 -0400 Subject: [PATCH 2/5] prettier --- javascripts/discourse/initializers/category-icons.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/javascripts/discourse/initializers/category-icons.js b/javascripts/discourse/initializers/category-icons.js index 9920a57..00fe30a 100644 --- a/javascripts/discourse/initializers/category-icons.js +++ b/javascripts/discourse/initializers/category-icons.js @@ -40,7 +40,7 @@ export default { let categoryThemeItem = categoryThemeList.find((str) => str.indexOf(",") > -1 ? categorySlug.indexOf(str.substr(0, str.indexOf(","))) > -1 - : "", + : "" ); if (categoryThemeItem) { @@ -57,7 +57,7 @@ export default { function buildTopicCount(count) { return `× ${count}`; } From 42876959afe9da7c155b4c583a7563223dd0cef7 Mon Sep 17 00:00:00 2001 From: awesomerobot Date: Thu, 2 Nov 2023 15:07:07 -0400 Subject: [PATCH 3/5] remove color --- javascripts/discourse/initializers/category-icons.js | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/javascripts/discourse/initializers/category-icons.js b/javascripts/discourse/initializers/category-icons.js index 00fe30a..a4021dd 100644 --- a/javascripts/discourse/initializers/category-icons.js +++ b/javascripts/discourse/initializers/category-icons.js @@ -40,7 +40,7 @@ export default { let categoryThemeItem = categoryThemeList.find((str) => str.indexOf(",") > -1 ? categorySlug.indexOf(str.substr(0, str.indexOf(","))) > -1 - : "" + : "", ); if (categoryThemeItem) { @@ -57,7 +57,7 @@ export default { function buildTopicCount(count) { return `× ${count}`; } @@ -72,7 +72,6 @@ export default { let tagName = opts.link === false || opts.link === "false" ? "span" : "a"; let extraClasses = opts.extraClasses ? " " + opts.extraClasses : ""; - let color = get(category, "color"); let html = ""; let parentCat = null; let categoryDir = ""; From 7fc0d70d678ced4ad8596ed1ae35f676a2c4f189 Mon Sep 17 00:00:00 2001 From: awesomerobot Date: Thu, 2 Nov 2023 15:08:34 -0400 Subject: [PATCH 4/5] prettier again --- javascripts/discourse/initializers/category-icons.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/javascripts/discourse/initializers/category-icons.js b/javascripts/discourse/initializers/category-icons.js index a4021dd..863d4e9 100644 --- a/javascripts/discourse/initializers/category-icons.js +++ b/javascripts/discourse/initializers/category-icons.js @@ -40,7 +40,7 @@ export default { let categoryThemeItem = categoryThemeList.find((str) => str.indexOf(",") > -1 ? categorySlug.indexOf(str.substr(0, str.indexOf(","))) > -1 - : "", + : "" ); if (categoryThemeItem) { @@ -57,7 +57,7 @@ export default { function buildTopicCount(count) { return `× ${count}`; } From c2f0c5d91bbf662ac2c10bfb9cd53f0386990e70 Mon Sep 17 00:00:00 2001 From: awesomerobot Date: Mon, 13 Nov 2023 10:15:26 -0500 Subject: [PATCH 5/5] pin older discourse versions --- .discourse-compatibility | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/.discourse-compatibility b/.discourse-compatibility index 7d87347..2f04d7e 100644 --- a/.discourse-compatibility +++ b/.discourse-compatibility @@ -1,2 +1,2 @@ +< 3.2.0.beta4-dev: 7afb20ed5730b268b39fb922cb595d446bdc37bc 3.1.999: d6844589085e842d59be06dfcf98e315d172d114 -