Темы и Сообщения в строку. Node stats - Статистика узла.

[nond]

Пытаюсь разобраться, как переделать отображение "Темы" "Сообщения" из табличного вида в строку и разместить их под .node-description дополнительного описания узла.

По умолчанию выглядит так:

Темы Сообщения
2 3

Требуется:

Темы: 23 Сообщения: 152

Если через node.less скрыть отображение статистики узла

.node--id14 .node-stats {
display: none;
}

То освободившееся пространство можно использовать для вывода подфорумов в два-три столбика.
Ограничение пространства справа даёт .node-extra, .node-extra-row, где выводится информация о последней теме, авторе, дате, времени создания.


А вообще .node-stats и .node-extra можно "поднять вверх", чтобы .node-subNodeFlatList расширить на всю ширину?
Тогда длинные названия подфорумов не будут переноситься на 2 строки.
Во вложении вторая картинка с желаемым итогом.

 

[Hope]

Что это было? Мысли вслух? Вопрос? Почему тема в разделе модификаций шаблонов? Разве это готовое решение?

 

[nond]

Что это было? Мысли вслух? Вопрос? Почему тема в разделе модификаций шаблонов? Разве это готовое решение?

Это вопрос.

 

[CMTV]

Пытаюсь разобраться, как переделать отображение "Темы" "Сообщения" из табличного вида в строку и разместить их под .node-description дополнительного описания узла.

В шаблоне extra.less:

.node-stats {
    .pairs.pairs--rows {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        
        dd {
            margin-left: 10px; // Отстпуп чисел от обозначений
        }
    }
}

Далее в шаблоне node_list_forum найдите блок:

<xf:if is="!{$extras.privateInfo}">
    <div class="node-stats">
        <dl class="pairs pairs--rows">
            <dt>{{ phrase('threads') }}</dt>
            <dd>{$extras.discussion_count|number}</dd>
        </dl>
        <dl class="pairs pairs--rows">
            <dt>{{ phrase('messages') }}</dt>
            <dd>{$extras.message_count|number}</dd>
        </dl>
    </div>
</xf:if>

И перенесите его сразу под следующую строку в том же шаблоне:

<xf:if is="$descriptionDisplay != 'none' && $node.description">
    <div class="node-description {{ $descriptionDisplay == 'tooltip' ? 'node-description--tooltip js-nodeDescTooltip' : '' }}">{$node.description|raw}</div>
</xf:if>

 

[nond]

CMTV, я понял. Теперь кто подскажет, чтобы сделать модификацию шаблона, можно избежать постинга портянки кода НЕ простой заменой, а через регулярное выражение?
т.е. по-сути надо найти кусок кода, вырезать его и вставить в другое место.

[B]<xf:if is="$descriptionDisplay != 'none' && $node.description">
                    <div class="node-description {{ $descriptionDisplay == 'tooltip' ? 'node-description--tooltip js-nodeDescTooltip' : '' }}">{$node.description|raw}</div>
                </xf:if>[/B]

                <div class="node-meta">
                    <xf:if is="!{$extras.privateInfo}">
                        <div class="node-statsMeta">
                            <dl class="pairs pairs--inline">
                                <dt>{{ phrase('threads') }}</dt>
                                <dd>{$extras.discussion_count|number}</dd>
                            </dl>
                            <dl class="pairs pairs--inline">
                                <dt>{{ phrase('messages') }}</dt>
                                <dd>{$extras.message_count|number}</dd>
                            </dl>
                        </div>
                    </xf:if>

                    <xf:if is="$depth == 2 AND property('nodeListSubDisplay') == 'menu'">
                        <xf:macro template="forum_list" name="sub_nodes_menu"
                            arg-children="{$children}"
                            arg-childExtras="{$childExtras}"
                            arg-depth="{{ $depth + 1 }}" />
                    </xf:if>
                </div>

                <xf:if is="$depth == 2 AND property('nodeListSubDisplay') == 'flat'">
                    <xf:macro template="forum_list" name="sub_nodes_flat"
                        arg-children="{$children}"
                        arg-childExtras="{$childExtras}"
                        arg-depth="{{ $depth + 1 }}" />
                </xf:if>

                <xf:if is="$bonusInfo is not empty">
                    <div class="node-bonus">{$bonusInfo}</div>
                </xf:if>
            </div>

           <xf:if is="!{$extras.privateInfo}">
                <div class="node-stats">
                    <dl class="pairs pairs--rows">
                        <dt>{{ phrase('threads') }}</dt>
                        <dd>{$extras.discussion_count|number}</dd>
                    </dl>
                    <dl class="pairs pairs--rows">
                        <dt>{{ phrase('messages') }}</dt>
                        <dd>{$extras.message_count|number}</dd>
                    </dl>
                </div>
            </xf:if>

К такому виду:

<xf:if is="$descriptionDisplay != 'none' && $node.description">
<div class="node-description {{ $descriptionDisplay == 'tooltip' ? 'node-description--tooltip js-nodeDescTooltip' : '' }}">{$node.description|raw}</div>
</xf:if>

<xf:if is="!{$extras.privateInfo}">
<div class="node-stats">
<dl class="pairs pairs--rows">
<dt>{{ phrase('threads') }}</dt>
<dd>{$extras.discussion_count|number}</dd>
</dl>
<dl class="pairs pairs--rows">
<dt>{{ phrase('messages') }}</dt>
<dd>{$extras.message_count|number}</dd>
</dl>
</div>
</xf:if>

<div class="node-meta">
<xf:if is="!{$extras.privateInfo}">
<div class="node-statsMeta">
<dl class="pairs pairs--inline">
<dt>{{ phrase('threads') }}</dt>
<dd>{$extras.discussion_count|number}</dd>
</dl>
<dl class="pairs pairs--inline">
<dt>{{ phrase('messages') }}</dt>
<dd>{$extras.message_count|number}</dd>
</dl>
</div>
</xf:if>

<xf:if is="$depth == 2 AND property('nodeListSubDisplay') == 'menu'">
<xf:macro template="forum_list" name="sub_nodes_menu"
arg-children="{$children}"
arg-childExtras="{$childExtras}"
arg-depth="{{ $depth + 1 }}" />
</xf:if>
</div>

<xf:if is="$depth == 2 AND property('nodeListSubDisplay') == 'flat'">
<xf:macro template="forum_list" name="sub_nodes_flat"
arg-children="{$children}"
arg-childExtras="{$childExtras}"
arg-depth="{{ $depth + 1 }}" />
</xf:if>

<xf:if is="$bonusInfo is not empty">
<div class="node-bonus">{$bonusInfo}</div>
</xf:if>
</div>

 

[CMTV]

Если без регулярного выражения, то можно через две модификации шаблонов. Первой убираем существующий блок. Затем второй добавляем его же, но уже в нужное место.

 

[nond]

Если без регулярного выражения, то можно через две модификации шаблонов. Первой убираем существующий блок. Затем второй добавляем его же, но уже в нужное место.

Ну, я так и предполагал, что в два приёма.
Кстати, "поехали" цифры вниз (перенос на вторую строку) из-за размера ячейки 170px. Необходимо увеличивать.

.node-stats {
display: table-cell;
width: 170px;
vertical-align: middle;
text-align: center;
padding: 10px 0;