모바일 레이아웃에서 타임라인 슬라이더의 날짜가 가끔 표시되지 않음

[rahim123]

안녕하세요, Discourse에서 타임라인 슬라이더에 날짜가 표시되지 않거나 연도 없이 월만 표시되는 등 매우 무작위적인 문제가 발생하고 있습니다. 특히 모바일 모드에서 더 두드러집니다:

좁은 데스크톱 모드: 1) Firefox 로그인 상태, 2) Firefox 익명, 3) Chromium 로그인 상태, 4) Chromium 익명

모바일 모드: 1) Firefox 로그인 상태, 2) Firefox 익명, 3) Chromium 로그인 상태, 4) Chromium 익명

일반적인 폭의 데스크톱 모드에서도 타임라인에 날짜가 표시되지 않는 문제가 있었습니다. 개발자가 여기에 업로드한 CSS 수정 사항을 발견했는데, 제 Discourse에 이를 적용하면 일반 데스크톱 폭에서는 항상 월/연도가 표시되고, Android용 Firefox 모바일 모드에서는 적어도 월은 표시되지만 연도는 가끔 표시되지 않으며, Android용 Chrome 모바일 모드에서는 항상 전체 월/연도가 표시됩니다:

.timeline-container .topic-timeline .timeline-scrollarea {
    min-width: 5em;
}
.timeline-container .topic-timeline .timeline-replies,
.timeline-container .topic-timeline .timeline-ago {
    overflow: visible;
    max-width: unset;
}
.timeline-container .topic-timeline .timeline-scroller-content {
    overflow: visible;
    padding-left: 0.5em;
    max-height: 4em;
}

[awesomerobot (Kris)]

한번 확인해볼게요. 공간이 부족하면 날짜가 숨겨지는 경우가 있는데… 이번 모바일 케이스에서는 좀 지나치게 공격적인 것 같아요.

[rahim123]

확인해 주셔서 감사합니다, @awesomerobot!

@awesomerobot

공간이 부족할 때 날짜가 숨겨지기도 합니다

공간을 절약하기 위해 연도 없이 월만 표시하려 하기도 하는 건가요, 아니면 별도의 로직이거나 버그인가요? 공간 제한과 관련이 있을 것 같아서 다양한 줌 레벨을 시도해 보았지만 차이가 없어 보였고, Firefox와 Chromium 사이에 왜 일관성이 없는지 모르겠습니다. 예를 들어:

그리고 Mar 2020 (월만 표시되고 Firefox에서만 표시됨)와 Apr 2020 (연도도 표시되지만 Firefox에서만)를 표시하는 데 필요한 공간의 양이 왜 다른지 모르겠습니다:

[awesomerobot (Kris)]

위/아래쪽의 날짜와 ‘뒤로’ 버튼의 위치 및 겹침 문제를 방지하기 위해 콘텐츠는 2줄로 제한됩니다. 따라서 3번째 줄로 넘어가는 내용은 숨겨집니다.

[awesomerobot (Kris)]

이를 개선할 수 있도록 업데이트를 진행했으며, 현재 Meta에서 적용되었습니다. 문제가 여전히 발생한다면 알려 주세요.

UX: use relative units to prevent timeline crop (#20943)

[rahim123]

잘 작동하고 있어요. @awesomerobot, 정말 감사합니다!