# 최근 업데이트 후 카테고리 로고 이미지에 텍스트가 겹칩니다

**URL:** https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656
**Category:** Bug
**Created:** [10월 22, 2022, 7:32오전 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656 "2022-10-22T07:32:32Z")
**Posts on this page:** 18
**Page:** 1

<div class="post-metadata">

### Author: ![Amicable](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/amicable/32/68902_2.png) [@Amicable](https://meta.discourse.org/u/Amicable)
#### Post date: [10월 22, 2022, 7:32오전 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656/1 "2022-10-22T07:32:32Z")

</div>

최근 업데이트(지난 몇 주 사이) 이후로 모든 카테고리 이미지에 텍스트가 겹쳐서 표시됩니다. 사이트는 2.9.0 beta 10을 실행 중이며, 플러그인 없이 기본 테마를 사용하고 있습니다.

이 문제는 모든 기기에서 발생하며, 아래 예시를 참조하십시오:

 ![Screenshot_20221022-102328](https://global.discourse-cdn.com/meta/original/4X/1/6/4/164cc8206d04b9c7b57415402139a2debbacb866.jpeg)

가끔 겹치는 부분에는 스레드 제목이 하나나 둘 포함되기도 합니다. 구독 회원만 볼 수 있는 사이트이므로 여기에서 링크를 제공할 수 없습니다.

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [10월 22, 2022, 7:37오전 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656/2 "2022-10-22T07:37:50Z")

</div>

최근 이 문제에 대한 보고가 몇 건 있었는데, 새로운 다크/라이트 카테고리 로고 기능 때문인 것 같습니다. 이 주제에서 몇 가지 수정 방법이 제안되었습니다:

> [@업데이트 후 이상한 레이아웃](https://meta.discourse.org/t/weird-layout-after-update/241873/5?u=jammydodger):
>
> Here I see the images look like @renato’s screenshot on Chrome, but like the OP’s on Safari. This is certainly a regression, apologies about that. It doesn’t look like you have any customizations, but you do have some very large images as category logos, for example the one in the OP is 2657x2657. So, two ways to fix: Upload smaller images. You can try with a 150x150 image, that one should work well. (This also makes the pages load faster, with the smaller images.) If you don’t want to reuplo…

---

<div class="post-metadata">

### Author: ![Don](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/don/32/228726_2.png) [@Don](https://meta.discourse.org/u/Don)
#### Post date: [10월 22, 2022, 7:59오전 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656/3 "2022-10-22T07:59:09Z")

</div>

안녕하세요,

최근 이 섹션에 몇 가지 업데이트가 있었습니다. [https://github.com/discourse/discourse/commit/ab217d8ae0b06ae4a9ce94aa2ff200aa84789189](https://github.com/discourse/discourse/commit/ab217d8ae0b06ae4a9ce94aa2ff200aa84789189) 와 [https://github.com/discourse/discourse/commit/c937b6dd36ace3c1fb005eba2c6fee83d5b1e073](https://github.com/discourse/discourse/commit/c937b6dd36ace3c1fb005eba2c6fee83d5b1e073)

사이트를 업데이트해 보실 수 있을까요? 아마 이 문제를 해결할 수 있을 것입니다. 🙂

---

<div class="post-metadata">

### Author: ![Amicable](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/amicable/32/68902_2.png) [@Amicable](https://meta.discourse.org/u/Amicable)
#### Post date: [10월 22, 2022, 8:04오전 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656/4 "2022-10-22T08:04:17Z")

</div>

최신 버전인 2.9.0 베타 10으로 업데이트했습니다. 이렇게 하면 문제가 해결되었어야 하는 건가요? UI에서 업데이트를 진행했습니다.

---

<div class="post-metadata">

### Author: ![Amicable](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/amicable/32/68902_2.png) [@Amicable](https://meta.discourse.org/u/Amicable)
#### Post date: [10월 22, 2022, 8:12오전 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656/5 "2022-10-22T08:12:20Z")

</div>

그건 우리가 가진 가로형 카테고리 이미지는 수정해 주지만, 세로형 이미지는 그렇지 않아요. 세로형 이미지는 638 X 1024 크기로, 요즘 기준으로 보면 크게 느껴지지 않네요 🙁

---

<div class="post-metadata">

### Author: ![Don](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/don/32/228726_2.png) [@Don](https://meta.discourse.org/u/Don)
#### Post date: [10월 22, 2022, 8:20오전 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656/6 "2022-10-22T08:20:51Z")

</div>

죄송합니다, 제가 오해한 것 같습니다

> [@Amicable](#):
>
> 최근 업데이트(지난 몇 주 사이)

이 업데이트들은 1~2일 전에 적용되었습니다. 따라서 몇 주 전에 업데이트를 했다면 현재 사용 중인 Discourse 버전에는 해당 기능이 포함되어 있지 않을 가능성이 큽니다.

* * *

사이트가 공개되어 있다면 확인해 드릴 수 있도록 URL을 공유해 주시겠어요? 🙂

---

<div class="post-metadata">

### Author: ![Amicable](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/amicable/32/68902_2.png) [@Amicable](https://meta.discourse.org/u/Amicable)
#### Post date: [10월 22, 2022, 8:22오전 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656/7 "2022-10-22T08:22:41Z")

</div>

해당 문제는 최근에 발생했지만 사이트는 최신 상태입니다. 공개되어 있지 않습니다.

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [10월 22, 2022, 8:24오전 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656/8 "2022-10-22T08:24:21Z")

</div>

링크를 공유할 수 없는 경우 대시보드에서 정확한 버전 번호를 복사하여 붙여넣을 수도 있습니다. 👍

 ![Untitled](https://global.discourse-cdn.com/meta/original/4X/d/d/9/dd92bff16baaf1e48a7e0366c37d09a048b6405d.png)

---

<div class="post-metadata">

### Author: ![Amicable](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/amicable/32/68902_2.png) [@Amicable](https://meta.discourse.org/u/Amicable)
#### Post date: [10월 22, 2022, 8:27오전 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656/9 "2022-10-22T08:27:58Z")

</div>

> **[Commits · discourse/discourse](https://github.com/discourse/discourse/commits/c85e3e80838d75d8eec132267e2903d729f12aa4)**
>
> A platform for community discussion. Free, open, simple. - Commits · discourse/discourse

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [10월 22, 2022, 8:37오전 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656/10 "2022-10-22T08:37:39Z")

</div>

그 수정 사항들이 이미 포함되어 있는 것 같습니다. 너비(width)는 반영되었지만 높이(height)는 반영되지 않은 경우가 있을 수 있습니다. 🤔 팀원 대부분은 주말이지만, @Don 님이 타이핑하는 것을 볼 수 있으니, 그 사이 커뮤니티에서 수정 사항을 마련해 주실 수 있기를 바랍니다. 🤞 🙂

---

<div class="post-metadata">

### Author: ![Don](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/don/32/228726_2.png) [@Don](https://meta.discourse.org/u/Don)
#### Post date: [10월 22, 2022, 8:40오전 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656/11 "2022-10-22T08:40:57Z")

</div>

안전 모드에서 시도해 볼 수 있을까요? 불행히도 제 테스트 사이트에서는 재현이 되지 않습니다. 해당 환경에서 직접 확인하지 못한 상황에서 제가 드릴 수 있는 최선의 조언은, 특정 컴포넌트의 사용자 정의 코드 때문일 수 있다는 것입니다.

---

<div class="post-metadata">

### Author: ![Amicable](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/amicable/32/68902_2.png) [@Amicable](https://meta.discourse.org/u/Amicable)
#### Post date: [10월 22, 2022, 9:47오전 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656/12 "2022-10-22T09:47:56Z")

</div>

안전 모드에서도 변경이 없습니다. 사이트는 소셜 로그인 플러그인 몇 개를 제외하면 순수한 상태입니다.

---

<div class="post-metadata">

### Author: ![pmusaraj](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pmusaraj/32/119489_2.png) [@pmusaraj](https://meta.discourse.org/u/pmusaraj)
#### Post date: [10월 24, 2022, 1:42오후 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656/15 "2022-10-24T13:42:26Z")

</div>

@Amicable 저도 이 문제를 재현할 수 없습니다. 이미지의 스크린샷을 찍어 로컬 카테고리에 업로드해 봤는데, 레이아웃은 정상적으로 보입니다:

 ![image](https://global.discourse-cdn.com/meta/original/4X/4/c/b/4cb6dcd0c8266403a5e3280f156ed7329ea5d943.jpeg)

~~원본 이미지의 크기는 얼마인가요?~~

게시하신 이미지는 638x1024이고, 제가 사용한 이미지는 770x1144로 매우 유사합니다.

다시 재빌드(rebuild)를 시도해 보시는 건 어떨까요? 그래도 해결되지 않으면, 현재 사용 중인 플러그인의 전체 목록을 공유해 주시겠습니까? 해당 플러그인 중 하나가 카테고리 템플릿을 덮어쓰고 있어서 코어에서 업데이트된 스타일과 충돌을 일으킬 수 있습니다.

---

<div class="post-metadata">

### Author: ![Amicable](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/amicable/32/68902_2.png) [@Amicable](https://meta.discourse.org/u/Amicable)
#### Post date: [10월 25, 2022, 7:55오전 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656/18 "2022-10-25T07:55:11Z")

</div>

아마도 웹 인터페이스를 통한 업그레이드와 관련이 있을 것 같습니다. 이전에도 CSS 문제로 이런 일이 있었습니다. 오래된 스타일시트가 다시 남아 있는 걸까요?

현재 실행 중인 플러그인은 도커 매니저 하나뿐입니다.

다시 자리를 비우게 되어 이번 주 후반에 돌아올 때까지 서버에서 업그레이드를 진행할 수 없습니다. 오늘 웹 UI로 업그레이드를 시도했지만 문제가 해결되지 않았습니다.

한 번 더 말씀드리자면, 가로형 카테고리 이미지에 대한 CSS 수정은 적용되어 정상적으로 작동하고 있습니다.

---

<div class="post-metadata">

### Author: ![Amicable](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/amicable/32/68902_2.png) [@Amicable](https://meta.discourse.org/u/Amicable)
#### Post date: [10월 26, 2022, 4:43오후 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656/19 "2022-10-26T16:43:25Z")

</div>

CSS 컴포넌트 수정에 세로형 카테고리 이미지 처리를 위한 한 줄을 추가했습니다. 이제 카테고리 이미지 CSS 컴포넌트는 다음과 같습니다:

```plaintext
@supports (--custom: property) {
  body .category-logo.aspect-image {
    max-width: 150px;
    max-height: 300px;
  }
}

```

이것으로 제 문제는 일시적으로 해결되었지만, 웹 UI를 통해 업그레이드할 때 스타일시트가 유지되는 더 큰 문제는 여전히 남아 있습니다.

@pmusaraj 이 이상한 동작을 확인하기 위해 CSS의 어떤 부분을 검사해야 하는지 알려주시면 결과를 보고하겠습니다. 이전에 제공했던 것처럼 DM으로 로그인 정보도 제공할 수 있습니다.

---

<div class="post-metadata">

### Author: ![Amicable](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/amicable/32/68902_2.png) [@Amicable](https://meta.discourse.org/u/Amicable)
#### Post date: [1월 20, 2023, 12:29오후 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656/20 "2023-01-20T12:29:22Z")

</div>

이 문제를 해결하기 위한 빠른 업데이트입니다. 최근에 CSS 컴포넌트 수정 사항을 제거했는데, 더 이상 문제가 발생하지 않습니다. 정확히 어떤 커밋이 문제를 해결했는지 알 수는 없지만, 10월부터 현재 사이에 Discourse 팀이 진행한 업그레이드 중 하나일 것입니다.

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [1월 20, 2023, 2:11오후 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656/21 "2023-01-20T14:11:55Z")

</div>

업데이트 감사합니다. 👍 근본 원인을 찾지 못한 건 아쉽지만, 해결되어서 다행입니다. 🙂

---

<div class="post-metadata">

### Author: ![JammyDodger](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jammydodger/32/254611_2.png) [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [1월 23, 2023, 8:00오전 UTC](https://meta.discourse.org/t/category-logo-image-overlaid-by-text-after-recent-update/242656/22 "2023-01-23T08:00:23Z")

</div>

이 주제는 2일 후 자동으로 닫혔습니다. 더 이상 답변을 남길 수 없습니다.
