Ticket #3399 - Comments, Likes, Views. Related core changes.

modules/boonex/artificer/data/template/bx_timeline/css/view.css

@@ -59,8 +59,4 @@ div.bx-tl-view-timeline div.bx-tl-item-circle .sys-icon {
 /*--- Item Activity (Actions and Manage are different menus) ---*/
 div.bx-tl-item div.bx-tl-item-activity .bx-menu-custom.bx-menu-custom-hor {
     flex-wrap: wrap;
-}
-
-div.bx-tl-item div.bx-tl-item-activity .bx-menu-custom.bx-menu-custom-hor .sys-action {
-    height: 1.5rem;
 }

modules/boonex/artificer/data/template/bx_timeline/item_outline.html

@@ -75,8 +75,8 @@
                 </bx_if:show_menu_item_actions>
                 <bx_if:show_manage>
                     <div class="__style_prefix__-item-manage">
-                        <a href="javascript:void(0)" onclick="__onclick__">
-                            <span class="bx-menu-item-icon bx-def-align-center"><i class="sys-icon ellipsis-v"></i></span>
+                        <a class="group flex items-center p-1 px-2 border border-transparent rounded-full space-x-1 text-gray-500 hover:text-gray-700 dark:text-gray-500 dark:hover:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700" href="javascript:void(0)" onclick="__onclick__">
+                            <span class="bx-menu-item-icon bx-def-align-center"><i class="sys-icon ellipsis-h"></i></span>
                         </a>
                     </div>
                 </bx_if:show_manage>

modules/boonex/artificer/data/template/bx_timeline/item_timeline.html

@@ -83,8 +83,8 @@
             </bx_if:show_menu_item_actions>
             <bx_if:show_manage>
                 <div class="__style_prefix__-item-manage">
-                    <a href="javascript:void(0)" onclick="__onclick__">
-                        <span class="bx-menu-item-icon bx-def-align-center"><i class="sys-icon ellipsis-v"></i></span>
+                    <a class="group flex items-center p-1 px-2 border border-transparent rounded-full space-x-1 text-gray-500 hover:text-gray-700 dark:text-gray-500 dark:hover:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700" href="javascript:void(0)" onclick="__onclick__">
+                        <span class="bx-menu-item-icon bx-def-align-center"><i class="sys-icon ellipsis-h"></i></span>
                     </a>
                 </div>
             </bx_if:show_manage>

modules/boonex/artificer/data/template/bx_timeline/menu_custom_hor.html

@@ -1,4 +1,4 @@
-<ul id="__html_id__" class="bx-menu-custom bx-menu-custom-hor bx-menu-hor-inline<bx_if:show_more_auto_class> bx-menu-more-auto</bx_if:show_more_auto_class> bx-menu-object-__object__ flex justify-between items-start space-x-4">
+<ul id="__html_id__" class="bx-menu-custom bx-menu-custom-hor bx-menu-hor-inline<bx_if:show_more_auto_class> bx-menu-more-auto</bx_if:show_more_auto_class> bx-menu-object-__object__ flex justify-between items-start">
     <bx_repeat:menu_items>
         <li class="bx-menu-item bx-menu-item-__name____class__">__item__</li>
     </bx_repeat:menu_items>

modules/boonex/artificer/data/template/bx_timeline/menu_custom_item_hor.html

@@ -1,4 +1,4 @@
 <span class="__class_wrp__">
-    <a class="__class_link__" href="__link__" onclick="__onclick__" title="__title_attr__"__attrs__><span class="bx-def-valign-center"><bx_if:icon><span class="bx-menu-item-icon bx-def-align-center"><i class="sys-icon __icon__"></i></span></bx_if:icon><bx_if:image><img style="background-image:url(__icon_url__)" src="<bx_icon_url:spacer.gif />" /></bx_if:image><bx_if:title><span class="bx-menu-item-title bx-def-margin-sec-left-auto">__title__</span></bx_if:title></span></a>
+    <a class="__class_link__ group flex items-center p-1 px-2 border border-transparent rounded-full space-x-1 text-gray-500 hover:text-gray-700 dark:text-gray-500 dark:hover:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700" href="__link__" onclick="__onclick__" title="__title_attr__"__attrs__><span class="flex items-center"><bx_if:icon><span class="bx-menu-item-icon text-center"><i class="sys-icon __icon__"></i></span></bx_if:icon><bx_if:image><img style="background-image:url(__icon_url__)" src="<bx_icon_url:spacer.gif />" /></bx_if:image><bx_if:title><span class="bx-menu-item-title bx-def-margin-sec-left-auto">__title__</span></bx_if:title></span></a>
     <bx_if:addon>__addon__</bx_if:addon>
 </span>

modules/boonex/artificer/data/template/system/comment_counter.html

@@ -1 +1 @@
-<div id="__id__" class="__class__"><a class="flex items-center" href="__href__"<bx_if:show_onclick> onclick="__onclick__"</bx_if:show_onclick>><bx_repeat:profiles>__icon__</bx_repeat:profiles><bx_if:show_icon><div class="sys-action-counter-icon __sp__-counter-icon bx-def-icon-size flex items-center justify-center h-8 w-8 mr-2 ring-1 ring-white dark:ring-gray-800 bg-gray-300 group-hover:bg-gray-500 rounded-full"><i class="__sp__-counter-icon sys-icon comment"></i></div></bx_if:show_icon>__content__</a></div>
+<div id="__id__" class="__class__"><a class="group flex items-center p-1 border-none rounded-full text-gray-500 hover:text-gray-700 dark:text-gray-500 dark:hover:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700" href="__href__"<bx_if:show_onclick> onclick="__onclick__"</bx_if:show_onclick>><bx_repeat:profiles>__icon__</bx_repeat:profiles><bx_if:show_icon><div class="sys-action-counter-icon __sp__-counter-icon bx-def-icon-size flex items-center justify-center h-8 w-8 mr-2 ring-1 ring-white dark:ring-gray-800 bg-gray-300 group-hover:bg-gray-500 rounded-full"><i class="__sp__-counter-icon sys-icon comment"></i></div></bx_if:show_icon>__content__</a></div>

modules/boonex/artificer/data/template/system/css/menu.css

@@ -58,4 +58,9 @@ div.bx-sliding-menu-main.sys-add-content ul {
 }
 .bx-menu-ver.bx-menu-object-sys_profile_followings li.bx-menu-item-collapsed .bx-menu-item-subitems {
     display: none;
+}
+
+/*--- Interactive Menu ---*/
+li.bx-menu-inter-hidden {
+    display: none;
 }

modules/boonex/artificer/data/template/system/css/view.css

@@ -0,0 +1,12 @@
+/*--
+import url(../../../../../../../template/css/view.css);
+--*/
+
+/*--- Viewed By ---*/
+div.bx-view-by-list {}
+div.bx-view-by-list-cnt {}
+div.bx-view-by-items {
+    max-height: 12.5rem;
+    min-width: 13.75rem;
+    overflow: auto;
+}

modules/boonex/artificer/data/template/system/css/vote.css

@@ -0,0 +1,183 @@
+/*--
+import url(../../../../../../../template/css/vote.css);
+--*/
+
+
+/*--------------------------------------*/
+/*--- Reactions based Element Styles ---*/
+/*--------------------------------------*/
+.bx-vote-counter-wrapper-reactions .bx-vote-counter {
+    display: inline-block;
+}
+.bx-vote-counter-wrapper-reactions.bx-vote-counter-wrapper-reactions-compound {
+    position: relative;
+}
+.bx-vote-counter-wrapper-reactions.bx-vote-counter-wrapper-reactions-compound .bx-vote-counter {
+    display: block;
+}
+.bx-vote-counter-wrapper-reactions.bx-vote-counter-wrapper-reactions-divided a.bx-vote-counter {
+    margin-right: 0.5rem;
+}
+.bx-vote-counter-wrapper-reactions.bx-vote-counter-wrapper-reactions-compound a.bx-vote-counter.total-count,
+.bx-vote-counter-wrapper-reactions.bx-vote-counter-wrapper-reactions-compound span.bx-vote-counter.total-count {
+    width: auto;
+    height: auto;
+    margin-left: 0.5rem;
+}
+.bx-vote-counter-wrapper-reactions.bx-vote-counter-wrapper-reactions-compound a.bx-vote-counter.total-count .sys-action-counter-text:first-child,
+.bx-vote-counter-wrapper-reactions.bx-vote-counter-wrapper-reactions-compound span.bx-vote-counter.total-count .sys-action-counter-text:first-child {
+    margin-left: 0;
+}
+.bx-vote-counter-wrapper-reactions.bx-vote-counter-wrapper-reactions-compound span.bx-vote-counter:not(.total-count) {
+    margin-left: -0.5rem;
+}
+.bx-media-phone .bx-vote-counter-wrapper-reactions.bx-vote-counter-wrapper-reactions-compound span.bx-vote-counter:not(.total-count),
+.bx-media-tablet .bx-layout-column-thin .bx-vote-counter-wrapper-reactions.bx-vote-counter-wrapper-reactions-compound span.bx-vote-counter:not(.total-count),
+.bx-media-tablet .bx-layout-column-half .bx-vote-counter-wrapper-reactions.bx-vote-counter-wrapper-reactions-compound span.bx-vote-counter:not(.total-count) {
+    margin-left: -1.0rem;
+}
+.bx-vote-counter-wrapper-reactions.bx-vote-counter-wrapper-reactions-compound span.bx-vote-counter:not(.total-count) span.bx-vote-counter-text {
+    display: none;
+}
+.bx-vote-counter-wrapper-reactions.bx-vc-hidden,
+.bx-vote-counter-wrapper-reactions .bx-vote-counter.bx-vc-hidden {
+    display: none;
+}
+.bx-menu-object-sys_vote_reactions_do li .sys-icon {
+    font-size: 1.5rem;
+}
+
+/*--- Voted By ---*/
+div.bx-vote-by-list {}
+div.bx-vote-by-list-cnt {
+    max-height: 12.5rem;
+    min-width: 13.75rem;
+    overflow: auto;
+}
+div.bx-vote-by-list div.bx-base-pofile-unit {
+    float: none;
+    margin-right: 0px;
+    margin-bottom: 0px;
+}
+.bx-vote-bls-header {
+    display: -webkit-flex;
+    display: flex;
+
+    margin: -1.25rem -1.25rem 0 -1.25rem;
+    
+    border-bottom-color: #e6f0fa;
+    border-bottom-width: 2px;
+}
+.bx-vote-bls-content {
+    margin-left: -0.5rem;
+    margin-right: -0.5rem;
+}
+.bx-vote-bls-title,
+.bx-vote-bls-submenu {
+    -webkit-flex: 0 1 auto; 
+    -ms-flex:  0 1 auto; 
+    flex:  0 1 auto;
+    line-height: 3.125rem;
+}
+.bx-vote-bls-title,
+.bx-vote-bls-submenu-cnt,
+.bx-vote-bls-filler {
+    height: 3.125rem;
+}
+.bx-vote-bls-title,
+.bx-vote-bls-filler {
+    -webkit-flex-grow: 3;
+    flex-grow: 3;
+
+    border-bottom: 2px solid rgba(232, 232, 232, 1.0);
+}
+.bx-vote-bls-title {
+    display: none;
+
+    white-space: nowrap;
+    font-size: 1rem;
+    font-weight: 400;
+}
+.bx-vote-bls-submenu {
+    overflow-x: auto;
+    overflow-y: hidden;
+
+    -webkit-overflow-scrolling: touch;
+}
+.bx-vote-bls-submenu-cnt {
+    box-sizing: border-box;
+    padding: 0 0.5rem;
+    border-bottom: 2px solid rgba(232, 232, 232, 1.0);
+}
+.bx-vote-bls-submenu::-webkit-scrollbar {
+    width: 0.5rem;
+}
+.bx-vote-bls-submenu::-webkit-scrollbar-track {
+    -webkit-border-radius: 0.5rem;
+    border-radius: 0.5rem;
+
+    background-color: rgba(0, 0, 0, 0.1); 
+}
+.bx-vote-bls-submenu::-webkit-scrollbar-thumb {
+    -webkit-border-radius: 0.5rem;
+    border-radius: 0.5rem;
+
+    background: rgba(255, 255, 255, 0.9); 
+    -webkit-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.5);
+}
+.bx-vote-bls-submenu::-webkit-scrollbar-thumb:window-inactive {
+    background: rgba(255, 255, 255, 0.4); 
+}
+.bx-vote-bls-submenu-cnt ul {
+    display: -webkit-flex;
+    display: flex;
+}
+.bx-vote-bls-submenu-cnt ul li {
+    -webkit-flex: 0 1 auto; 
+    -ms-flex:  0 1 auto; 
+    flex:  0 1 auto;
+    box-sizing: border-box;
+    height: 3.125rem;
+
+    border-bottom: 2px solid rgba(232, 232, 232, 1.0);
+    border-radius: 0;
+
+    line-height: 3.125rem;
+    white-space: nowrap;
+}
+.bx-vote-bls-submenu-cnt ul li div {
+    padding: 0 0.625rem;
+}
+.bx-vote-bls-submenu-cnt ul li.bx-menu-inter-act {
+    border-bottom-color: #364f6b;
+}
+.bx-vote-bls-submenu-cnt ul li.bx-menu-inter-act > div {
+    font-weight: bold;
+}
+.bx-vote-bls-content .bx-vote-by-list:not(.bx-vote-bl-summary) {
+    display: none;
+}
+.bx-vote-bls-content .bx-vote-by-items {
+    padding-left: 0.5rem;
+    padding-right: 0.5rem;
+}
+.bx-vote-bls-content .bx-vote-by-item {
+    position: relative;
+    display: -webkit-flex;
+    display: flex;
+    -webkit-justify-content: space-between;
+    justify-content: space-between;
+    -webkit-align-items: center;
+    align-items: center;
+}
+.bx-vote-bls-content .bx-vote-by-item:first-child {
+    padding-top: 1rem;
+}
+.bx-vote-bls-content .bx-vote-by-item:last-child {
+    padding-bottom: 0;
+}
+
+.bx-vote-bls-content .bx-vote-by-item:before,
+.bx-vote-bls-content .bx-vote-by-item:after {
+    display: none;
+}

modules/boonex/artificer/data/template/system/view_by_list.html

@@ -0,0 +1,20 @@
+<div class="__style_prefix__-by-list">
+    <div class="__style_prefix__-by-list-cnt">
+        <div class="__style_prefix__-by-items">
+            <bx_repeat:list>
+                <div class="__style_prefix__-by-item p-2">
+                    <div class="__style_prefix__-user flex items-center">
+                        <div class="__style_prefix__-user-avatar h-10 w-10">__user_unit__</div>
+                        <div class="__style_prefix__-user-info ml-4">
+                            <div class="__style_prefix__-user-name text-sm text-gray-500 dark:text-gray-400">
+                                <a href="__user_url__" class="__style_prefix__-user-name" title="__user_title__">__user_name__</a>
+                                <bx_if:show_user_info><br /><span class="__style_prefix__-user-info">__user_info__</span></bx_if:show_user_info> 
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </bx_repeat:list>
+        </div>
+        <div class="__style_prefix__-by-paginate">__paginate__</div>
+    </div>
+</div>

modules/boonex/artificer/data/template/system/view_counter.html

@@ -0,0 +1,2 @@
+<bx_if:show_text><span class="__class__" <bx_repeat:attrs>__key__="__value__"</bx_repeat:attrs>>__content__</span></bx_if:show_text><bx_if:show_link><a class="__class__ group flex items-center p-1 border-none rounded-full text-gray-500 hover:text-gray-700 dark:text-gray-500 dark:hover:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700" <bx_repeat:attrs>__key__="__value__"</bx_repeat:attrs>>__content__</a></bx_if:show_link>
+__script__

modules/boonex/artificer/data/template/system/view_counter_label.html

@@ -0,0 +1 @@
+<span class="__style_prefix__-counter-label flex items-center"><bx_if:show_icon><span class="sys-action-counter-icon __style_prefix__-counter-icon relative flex items-center justify-center ring-1 ring-white dark:ring-gray-800 h-8 w-8 bg-gray-300 group-hover:bg-gray-500 rounded-full"><i class="sys-icon __name__"></i></span></bx_if:show_icon><bx_if:show_text><span class="sys-action-counter-text __style_prefix__-counter-text ml-2">__text__</span></bx_if:show_text></span>

modules/boonex/artificer/data/template/system/vote_counter.html

@@ -0,0 +1,2 @@
+<bx_if:show_text><span class="__class__" <bx_repeat:attrs>__key__="__value__"</bx_repeat:attrs>>__content__</span></bx_if:show_text><bx_if:show_link><a class="__class__ group flex items-center p-1 border-none rounded-full text-gray-500 hover:text-gray-700 dark:text-gray-500 dark:hover:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700 box-border" <bx_repeat:attrs>__key__="__value__"</bx_repeat:attrs>>__content__</a></bx_if:show_link>
+__script__

modules/boonex/artificer/data/template/system/vote_counter_label_likes.html

@@ -0,0 +1 @@
+<span class="sys-action-counter-label __style_prefix__-counter-label flex items-center"><bx_if:show_icon><span class="sys-action-counter-icon __style_prefix__-counter-icon relative flex items-center justify-center ring-1 ring-white dark:ring-gray-800 h-8 w-8 bg-gray-300 group-hover:bg-gray-500 rounded-full"><i class="sys-icon __name__"></i></span></bx_if:show_icon><bx_if:show_text><span class="sys-action-counter-text __style_prefix__-counter-text bx-def-margin-sec-left-auto">__text__</span></bx_if:show_text></span>

modules/boonex/artificer/data/template/system/vote_counter_label_reactions.html

@@ -0,0 +1 @@
+<span class="__style_prefix__-counter-label flex items-center"><bx_if:show_icon><span class="sys-action-counter-icon __style_prefix__-counter-icon relative flex items-center justify-center ring-1 ring-white dark:ring-gray-800 h-8 w-8 bg-gray-300 group-hover:bg-gray-500 rounded-full"><i class="sys-icon __name__"></i></span></bx_if:show_icon><bx_if:show_text><span class="sys-action-counter-text __style_prefix__-counter-text ml-2">__text__</span></bx_if:show_text></span>

modules/boonex/artificer/data/template/system/vote_counter_wrapper_reactions.html

@@ -0,0 +1,3 @@
+<div id="__html_id__" class="__style_prefix__-counter-wrapper __style_prefix__-counter-wrapper-__type__ __style_prefix__-counter-wrapper-__type__-__style__ __class__">
+    <div class="__style_prefix__-counter-wrapper-cnt flex items-center"><bx_if:show_link><a class="group flex items-center p-1 pl-3 border-none rounded-full text-gray-500 hover:text-gray-700 dark:text-gray-500 dark:hover:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700" href="__href__" onclick="__onclick__" title="__title__">__counter__</a></bx_if:show_link><bx_if:show_text>__counter__</bx_if:show_text>__script__</div>
+</div>

modules/boonex/artificer/data/template/system/vote_element_inline.html

@@ -1,3 +1,3 @@
 <span id="__html_id__" class="sys-action __style_prefix__ __class__ flex items-center whitespace-nowrap"<bx_if:show_vote_data> bx_vote_data_rate="__rate__" bx_vote_data_count="__count__"</bx_if:show_vote_data>>
-    <span class="sys-action-cnt __style_prefix__-cnt __style_prefix__-do bx-def-valign-center"><bx_if:show_do_vote><span class="sys-action-element-holder __style_prefix__-element-holder">__do_vote__</span></bx_if:show_do_vote><bx_if:show_counter><span class="sys-action-counter-holder __style_prefix__-counter-holder bx-def-margin-thd-left-auto bx-btn-border"<bx_if:show_hidden> style="display:none"</bx_if:show_hidden>>__counter__</span></bx_if:show_counter></span>__script__
+    <span class="sys-action-cnt __style_prefix__-cnt __style_prefix__-do flex items-center"><bx_if:show_do_vote><span class="sys-action-element-holder __style_prefix__-element-holder group flex items-center p-1 px-2 border border-transparent rounded-full space-x-1 text-gray-500 hover:text-gray-700 dark:text-gray-500 dark:hover:text-gray-300 hover:bg-gray-100 dark:hover:bg-gray-700">__do_vote__</span></bx_if:show_do_vote><bx_if:show_counter><span class="sys-action-counter-holder __style_prefix__-counter-holder bx-def-margin-thd-left-auto bx-btn-border"<bx_if:show_hidden> style="display:none"</bx_if:show_hidden>>__counter__</span></bx_if:show_counter></span>__script__
 </span>

template/scripts/BxBaseView.php

@@ -99,15 +99,15 @@ class BxBaseView extends BxDolView
             $sClass .= ' bx-btn-height';
 
         $sContent = (int)$aView['count'] > 0 ? $this->_getCounterLabel($aView['count'], $aParams) : '';
-        return $this->_oTemplate->parseHtmlByContent($this->_sTmplContentCounter, array(
+        return $this->_oTemplate->parseHtmlByContent($this->_getTmplContentCounter(), array(
             'html_id' => $this->_aHtmlIds['counter'],
             'style_prefix' => $this->_sStylePrefix,
             'bx_if:show_text' => array(
                 'condition' => !$bAllowedViewViewViewers,
                 'content' => array(
+                    'class' => $sClass,
                     'bx_repeat:attrs' => array(
                         array('key' => 'id', 'value' => $this->_aHtmlIds['counter']),
-                        array('key' => 'class', 'value' => $sClass),
                     ),
                     'content' => $sContent
                 )
@@ -115,9 +115,9 @@ class BxBaseView extends BxDolView
             'bx_if:show_link' => array(
                 'condition' => $bAllowedViewViewViewers,
                 'content' => array(
+                    'class' => $sClass,
                     'bx_repeat:attrs' => array(
                         array('key' => 'id', 'value' => $this->_aHtmlIds['counter']),
-                        array('key' => 'class', 'value' => $sClass),
                         array('key' => 'href', 'value' => 'javascript:void(0)'),
                         array('key' => 'onclick', 'value' => 'javascript:' . $sJsObject . '.toggleByPopup(this)'),
                         array('key' => 'title', 'value' => _t('_view_do_view_by'))

template/scripts/BxBaseVote.php

@@ -103,9 +103,7 @@ class BxBaseVote extends BxDolVote
         if(!empty($aParams['class_counter']))
             $sClass .= $aParams['class_counter'];
 
-        $aTmplVarsAttrs = array(
-            array('key' => 'class', 'value' => $sClass),
-        );
+        $aTmplVarsAttrs = array();
 
         if($bShowActive)
             $aTmplVarsAttrs = array_merge($aTmplVarsAttrs, array(
@@ -125,6 +123,7 @@ class BxBaseVote extends BxDolVote
             'bx_if:show_text' => array(
                 'condition' => !$bShowActive,
                 'content' => array(
+                    'class' => $sClass,
                     'bx_repeat:attrs' => $aTmplVarsAttrs,
                     'content' => $sContent
                 )
@@ -132,10 +131,12 @@ class BxBaseVote extends BxDolVote
             'bx_if:show_link' => array(
                 'condition' => $bShowActive,
                 'content' => array(
+                    'class' => $sClass,
                     'bx_repeat:attrs' => $aTmplVarsAttrs,
                     'content' => $sContent
                 )
             ),
+            'class' => $sClass,
             'bx_repeat:attrs' => $aTmplVarsAttrs,
             'content' => $sContent,
             'script' => $bShowScript ? $this->getJsScript($aParams) : ''

template/view_counter.html

@@ -1,2 +1,2 @@
-<bx_if:show_text><span <bx_repeat:attrs>__key__="__value__"</bx_repeat:attrs>>__content__</span></bx_if:show_text><bx_if:show_link><a <bx_repeat:attrs>__key__="__value__"</bx_repeat:attrs>>__content__</a></bx_if:show_link>
+<bx_if:show_text><span class="__class__" <bx_repeat:attrs>__key__="__value__"</bx_repeat:attrs>>__content__</span></bx_if:show_text><bx_if:show_link><a class="__class__" <bx_repeat:attrs>__key__="__value__"</bx_repeat:attrs>>__content__</a></bx_if:show_link>
 __script__

template/vote_counter.html

@@ -1,2 +1,2 @@
-<bx_if:show_text><span <bx_repeat:attrs>__key__="__value__"</bx_repeat:attrs>>__content__</span></bx_if:show_text><bx_if:show_link><a <bx_repeat:attrs>__key__="__value__"</bx_repeat:attrs>>__content__</a></bx_if:show_link>
+<bx_if:show_text><span class="__class__" <bx_repeat:attrs>__key__="__value__"</bx_repeat:attrs>>__content__</span></bx_if:show_text><bx_if:show_link><a class="__class__" <bx_repeat:attrs>__key__="__value__"</bx_repeat:attrs>>__content__</a></bx_if:show_link>
 __script__