주요 추천 작품 이모지 오류

안녕하세요, Sergey입니다 :slight_smile:

조금 오래된 버그이지만, 어쨌든:

Blenderartists 포럼을 둘러보다 작은 버그 하나를 발견했습니다. 웹사이트 상단에는 6개의 추천 우수 작품을 볼 수 있는 섹션이 있습니다. 그 중 하나에 마우스를 올리면 제목이 표시됩니다. 제가 눈치챈 점은 제목에 이모지가 포함된 경우(아래 스크린샷 참조) 마우스를 올리지 않아도 이모지가 계속 표시된다는 것입니다.

제가 직접 조금 조사해 보았더니 이 문제를 해결하는 데 도움이 될 수 있는 다음 CSS 규칙을 찾았습니다.

이 추천 행 이미지의 제목에는 다음과 같은 규칙이 적용됩니다:

.featured-topic h3 a {
    font-size: 14px;
    color: transparent;
    transition: color .6s,text-shadow .6s
}

"color: transparent"은 이 작업을 수행하는 적절한 방법이 아니라고 생각합니다. 그래서 텍스트에는 영향을 미치지만 이모지 자체에는 영향을 미치지 않습니다. 이모지는 “img” 태그로 감싸져 있기 때문입니다.

따라서 "color: transparent"를 제거하고 다음과 같은 방식으로 처리하는 것이 더 나은 방법이라고 생각합니다:

.featured-topic h3 {
    position: absolute;
    top: 0;
    padding-top: 0;
    left: 5%;
    width: 90%;
    text-align: left;
    visibility: hidden;
}

.featured-topic:hover h3 {
    visibility: visible;
}

따라서 최종 코드는 다음과 같이 보일 것입니다:

도움이 되기를 바랍니다 :slight_smile:

세르게이님, 안녕하세요!

리포트해 주셔서 감사합니다. 다만, 제가 틀릴 수도 있지만, 이것은 홈페이지 기능 컴포넌트의 기본 CSS가 아닙니다. :thinking: 제가 보는 바로는, 사용자 정의 설정 때문입니다. :smile:

4개의 좋아요

안녕하세요, @Arkshine!

그걸 몰랐네요. 그게 Discourse의 기능인 줄 알았어요. 실례했어요 :slight_smile:

1개의 좋아요

관리자에게 알려주세요. 감사합니다!

이 이슈를 닫겠습니다.

1개의 좋아요

이 주제는 13시간 후 자동으로 닫혔습니다. 더 이상 새로운 답변을 작성할 수 없습니다.