Download Collapsible User Extras 1.0

Compatibilité XF

2.2.x

Description courte: This template mod will hide the extra user info in messages by default

This template mod will hide the extra user info in messages by default. Stats can be shown by simply clicking the expand arrow.

I will only support default styles, no 3rd party styles will receive support. Along with that if you use a Pixel Exit style this is already built into each style. 😛

Template

post_macros

Find:

Code:

<xf:macro template="message_macros" name="user_info" arg-user="{$post.User}" arg-fallbackName="{$post.username}" arg-dateHtml="{$dateHtml}" arg-linkHtml="{$linkHtml}" />

Add below:

Code:

<span id="collapse-{$post.post_id}" class="collapseTrigger collapseTrigger--block" data-xf-click="toggle" data-target="#js-post-{$post.post_id} .message-userExtras"></span>

Template

message_macros

Find:

Code:

<div class="message-userExtras">

Replace with:

Code:

<div class="message-userExtras message-userExtras-body message-userExtras--collapsible">

Add to extra.less template:

CSS:

/* User Extras Collapse */
.message-userExtras-body
{
    .m-listPlain();
    &.message-userExtras--collapsible
    {
        .has-no-js & { display: block; }
        .m-transitionFadeDown();
    }
}
.message-cell
{
    .collapseTrigger
    {
        text-align: center;
        &.is-active:before
        {
            transform: rotate(-180deg);
        }
        &:before
        {
            content: "\f13a";
            color: @xf-linkColor;
            transition: ease-in transform .3s;
            width: auto;
        }
        &.collapseTrigger--block:before
        {
            float: none;
        }
    }
}
@media (max-width: @xf-responsiveNarrow)
{
    .message-cell
    {
        .collapseTrigger
        {
            display: none;
        }
    }
}

Auteur: axtona

Vues: 377

Première publication: Mai 22, 2023

Dernière mise à jour: Mai 22, 2023

Évaluations 0.00 étoile(s) 0 évaluations

Rejoindre le fil de discussion

Link was Broken? Please Envoyer un message à l’équipe NP et nous vous aiderons rapidement !

Soutenez le développeur Si vous êtes satisfait du test ou que votre projet vous a rapporté de l’argent, cliquez sur le bouton « Plus d’informations » pour soutenir le développeur en achetant.

Partager cette ressource