Sovrapporre un avatar sulla copertina

[Gonerdot]

È possibile sovrapporre un avatar a un banner in modo simile? Se sì, allo stesso tempo è necessario disabilitare la possibilità di nascondere il banner

[Arkshine]

Puoi provare questo CSS? Da inserire nel tuo tema o in un nuovo CSS di componente.

.user-main:has(.has-background .user-profile-image) {
    $avatar_size: 144px;
    $avatar_margin: 20px;
    $avatar_border_size: medium;

    .user-profile-avatar {
        position: absolute;
        top: calc(-#{$avatar_size} / 2 - $avatar_margin);
        left: $avatar_margin;

        img.avatar {
            background: var(--secondary);
            border-width: $avatar_border_size;
        }
    }

    .primary-textual {
        margin-left: calc($avatar_size + $avatar_margin * 2);
    }
}

Qual è il tuo tema? Potrebbe necessitare di alcuni aggiustamenti.

[Gonerdot]

Tema FKB Pro.
Come posso aggiungere o modificare il CSS qui?

[Arkshine]

Il modo consigliato è creare un nuovo componente, allegarlo al tuo tema, quindi puoi Modificare CSS/HTML lì.

[Gonerdot]

Ty! Funziona

Ma se la copertina è nascosta, anche l’avatar non verrà visualizzato. Come posso disabilitare la possibilità di nascondere la copertina?

[Arkshine]

Ho aggiornato il CSS qui sopra, puoi riprovare?

Ora funziona bene dalla mia parte:

[Gonerdot]