토픽 카드


현재 홈페이지가 삼성 S23 울트라에서 올바르게 표시되지 않고 있습니다. 특정 게시물 하나 때문에 텍스트가 넘치며 전체 레이아웃이 깨지는 문제가 발생합니다.

이 문제는 해당 게시물 자체 때문인지, 테마 컴포넌트 버그 때문인지 궁금합니다.

감사합니다!

1개의 좋아요

확인해 본 결과, 이 문제는 게시글 내의 Google Maps 링크로 인해 발생하는 것으로 확인되었습니다.

링크가 maps.google.com 형식인 경우 정상적으로 작동합니다.

2개의 좋아요

토픽 카드(Topic Cards) 구성 요소가 https://meta.discourse.org/t/upcoming-topic-list-changes-how-to-prepare-themes-and-plugins/343404에 언급된 내용을 위해 준비되고 있는 건가요? 방금 디스코스를 업그레이드했는데, 이 구성 요소를 업데이트해야 한다는 관리자용 알림을 받았습니다.

이미 업데이트가 완료되었으므로 경고 메시지가 표시되지 않아야 합니다. 해당 컴포넌트의 공식 최신 버전을 실행 중인지, 포크 버전은 아닌지 다시 한번 확인해 주시겠습니까?

1개의 좋아요

아, 맞다! 내 실수였어. 우리가 GitHub - communiteq/discourse-topic-cards: This changed the topic list into cards with a modified layout, and a thumbnail if available. · GitHub 를 사용하고 있다는 걸 잊고 있었네. https://github.com/communiteq/discourse-topic-cards

@RGJ 죄송하지만 지금 네 포크와 메인 저장소 사이의 차이가 뭔지 알아?

2개의 좋아요

네, 메인 저장소는 제대로 유지보수되고 있습니다… 다음 주 초에 이 문제를 처리하겠습니다.

2개의 좋아요

모바일 버전이 ‘주제 요약’ 구성 요소를 활성화했을 때, 그리고 비활성화했을 때도 어떤 이유에서인지 깨져 있습니다 (해당 구성 요소를 포함하고 포함하지 않는 두 가지 테마를 사용 중인데, 둘 다 깨져 있습니다) ¯\_(ツ)_/¯ 그래서 이 CSS가 충분합니다

P.S. 관리자 대시보드의 모바일 SCSS에 이 코드를 붙여넣으세요

.topic-card__excerpt-text {
    display: -webkit-box !important;
    -webkit-line-clamp: 3 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    max-width: 100% !important;
    word-wrap: break-word !important;
    white-space: normal !important; 
}

.topic-card__excerpt {
    max-width: 100% !important;
    overflow: hidden !important;
}

.topic-list-item {
    overflow: hidden !important;
    max-width: 100% !important;
    white-space: normal !important;
}

td {
    max-width: 100% !important;
    overflow: hidden !important;
    white-space: normal !important;
}

2개의 좋아요

이것은 토픽 섬네일처럼 특정 카테고리 하나 또는 카테고리 목록에만 적용할 수 있는 방법은 무엇인가요?

1개의 좋아요

컴포넌트에 해당 로직을 추가해야 합니다. 공식 로드맵에 포함되어 있지 않다면 포크를 통해서만 가능합니다.

네, 저희도 분명히 필요할 것 같습니다. @jordan-violet @manuel 이 제안한 대로 하신 거죠…

이걸 할 수 있는 기술적인 지식이 없어요. :disappointed_face:

1개의 좋아요

우리는 더 마음에 드는 다른 방향으로 진행했습니다. Topic List Thumbnails를 사용하고, 원하는 대로 보이거나 작동하도록 하기 위해 자체 CSS를 추가했습니다. 여기서 실제 모습을 볼 수 있습니다:

5개의 좋아요

좋아 보입니다

1개의 좋아요

야, 네가 그렇게 말해줘서 정말 기뻐! 고마워!

1개의 좋아요

일부 제목은 검정색이고, 다른 제목은 파란색인 이유가 뭐일까요? 세 주제 모두 제가 읽었거든요.

아! 글을 올린 직후 바로 스스로 답을 찾았네요. 검은색은 읽지 않은 답글을 나타냅니다. 하지만 이미 # 배지가 있는 만큼, 색상으로 강조할 필요는 없을 것 같네요.

1개의 좋아요

토픽 카드 자체의 색상을 나머지 배경과 다르게 만들려면 어떤 CSS를 수정해야 하나요?

또한 언급되어 있지는 않지만, Topic Cards 플러그인이 일괄 작업 아이콘을 숨깁니다. 이를 다시 표시할 수 있을까요?
토픽에 일괄 업데이트를 적용할 때마다 이 기능을 계속 끄고 있습니다.

1개의 좋아요

수정하려는 요소를 마우스 오른쪽 버튼으로 클릭하고 '검사’를 선택하세요. 브라우저 개발자 도구가 열리며 CSS 선택자를 확인할 수 있습니다.

1개의 좋아요

감사합니다. 아래 내용을 추가했습니다:

.topic-card.has-max-height {
    background: #e6ecf2
}
.topic-card.has-max-height:hover {
    background: #ddecf7
}

기본 ‘Shades of Blue’ 팔레트와 완벽하게 작동합니다.

자, 2부입니다. 두 가지 색상 팔레트에 맞게 수정하는 방법은 무엇일까요? 브라우저가 다크 모드로 전환될 때까지는 괜찮아 보였거든요.

다시 한번 제 질문에 스스로 답을 드립니다…

어젯밤에 @media (prefers-color-scheme: light/dark)에 대해 알게 되어, 이제 모든 것이 해결되었습니다.

1개의 좋아요

@eisammy 님, 정말 감사합니다!!!
이 문제로 고생하고 있었는데, 머리가 빠질 지경이었어요!
어떤 이유인지 외부 링크가 onebox에 표시되지 않아서, 발췌문에 있는 긴 링크가 텍스트를 박스 밖으로 밀어내며 사이트 UI를 망쳐놓았거든요. 도움을 주셔서 해결되었습니다!

1개의 좋아요

이 컴포넌트에 문제가 있는 것 같습니다. Discourse에서 예상대로 페이지로 이동한 후에도 주제 제목을 클릭하면 페이지가 다시 로드됩니다. 즉, 처음에는 로드가 정상적으로 이루어지지만, 그 후 아무런 이유 없이 페이지가 다시 로드됩니다. 최근 현재 버전으로 업데이트한 후 여러 가지 가능성을 여러 번 테스트해 보았는데, 컴포넌트를 비활성화한 후에야 비로소 이러한 비정상적인 동작이 멈췄습니다.

Discourse 3.5.0.beta7-dev - https://github.com/discourse/discourse version 773ae006b7d4315c01a37170b1ebad27332d515e

1개의 좋아요

이 기능이 곧 추가될 예정일까요?