커버에 아바타를 오버레이하기

[Gonerdot]

비슷한 방식으로 배너 위에 아바타를 겹쳐 놓을 수 있을까요? 가능하다면, 동시에 배너를 숨길 수 있는 기능을 비활성화해야 합니다.

[Arkshine]

이 CSS를 시도해 보시겠어요? 테마나 새 컴포넌트의 CSS에 삽입하면 됩니다.

.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);
    }
}

어떤 테마를 사용 중이세요? 몇 가지 조정이 필요할 수 있습니다.

[Gonerdot]

FKB Pro 테마.
여기서 CSS를 추가하거나 변경하는 방법은 무엇인가요?

[Arkshine]

권장하는 방법은 새 컴포넌트를 생성한 후 테마에 연결하는 것입니다. 그러면在那里 CSS/HTML 편집을 수행할 수 있습니다.

[Gonerdot]

고마워요! 잘 작동합니다.

하지만 커버가 숨겨져 있으면 아바타도 표시되지 않아요. 커버를 숨기는 기능을 비활성화하는 방법은 무엇인가요?

[Arkshine]

위쪽의 CSS를 업데이트했습니다. 다시 시도해 주시겠어요?

제 쪽에서는 이제 잘 보입니다:

[Gonerdot]