nodebb-plugin-composer-default 10.0.41 → 10.0.43

package/library.js

@@ -96,6 +96,7 @@ plugin.getFormattingOptions = async function () {
 			name: 'thumbs',
 			title: '[[topic:composer.thumb_title]]',
 			className: 'fa fa-address-card-o',
+			badge: true,
 			visibility: {
 				...defaultVisibility,
 				reply: false,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nodebb-plugin-composer-default",
-  "version": "10.0.41",
+  "version": "10.0.43",
   "description": "Default composer for NodeBB",
   "main": "library.js",
   "repository": {

package/static/lib/composer/autocomplete.js

@@ -71,12 +71,14 @@ define('composer/autocomplete', [
 			return;
 		}
 		var editor;
-		if (targetEl.nodeName === 'TEXTAREA') {
+		if (targetEl.nodeName === 'TEXTAREA' || targetEl.nodeName === 'INPUT') {
 			editor = new TextareaEditor(targetEl);
 		} else if (targetEl.nodeName === 'DIV' && targetEl.getAttribute('contenteditable') === 'true') {
 			editor = new ContenteditableEditor(targetEl);
 		}
-
+		if (!editor) {
+			throw new Error('unknown target element type');
+		}
 		// yuku-t/textcomplete inherits directionality from target element itself
 		targetEl.setAttribute('dir', document.querySelector('html').getAttribute('data-dir'));
 

package/static/lib/composer.js

@@ -867,7 +867,9 @@ define('composer', [
 
 				if (thumbs.length) {
 					const formatEl = postContainer.find('[data-format="thumbs"]');
-					formatEl.attr('data-count', thumbs.length);
+					formatEl.find('.badge')
+						.text(thumbs.length)
+						.toggleClass('hidden', !thumbs.length);
 				}
 			});
 		}

package/static/scss/composer.scss

@@ -77,23 +77,6 @@
 				color: $gray-200;
 			}
 		}
-
-		.formatting-group {
-			li {
-				&[data-format="thumbs"][data-count]:after {
-					content: attr(data-count);
-					background: $info;
-					color: $white;
-					font-weight: 600;
-					position: absolute;
-					top: 5px;
-					left: 2.5em;
-					padding: 0px 5px;
-					border-radius: 5px;
-					font-size: 0.75em;
-				}
-			}
-		}
 	}
 
 	.tags-container {

package/static/templates/partials/composer-formatting.tpl

@@ -6,8 +6,11 @@
 			{{{ else }}}
 			{{{ if (./visibility.desktop && ((isTopicOrMain && ./visibility.main) || (!isTopicOrMain && ./visibility.reply))) }}}
 			<li class="small">
-				<a href="#" class="btn btn-sm btn-link text-reset" tabindex="-1" data-format="{./name}" title="{./title}">
+				<a href="#" class="btn btn-sm btn-link text-reset position-relative" tabindex="-1" data-format="{./name}" title="{./title}">
 					<i class="{./className}"></i>
+					{{{ if ./badge }}}
+					<span class="px-1 position-absolute top-0 start-100 translate-middle-x badge rounded text-bg-info"></span>
+					{{{ end }}}
 				</a>
 			</li>
 			{{{ end }}}