새로운 사이드바 사용자 정의 CSS

개발
1

Try out the new sidebar and notification menus!에서 이어지는 토론입니다:

@Canapin 무지한 질문을 용서해 주세요. 메타에 온 지 꽤 시간이 지났고, 지난 몇 년간 인스턴스에 CSS 변경을 거의 하지 않았거든요.

사이드바에서 읽지 않음/새 글/임시 저장 항목을 커스터마이즈하는 데 어떤 CSS를 사용하셨나요? 찾아보았지만 무엇을 사용해야 할지 모르겠어요.

미리 감사드립니다.

2

사이드바에 아무런 변경 사항을 넣지 않았기 때문에 당연한 반응입니다. :smile:
다른 사용자들도 읽지 않은 숫자가 표시되는 비슷한 화면을 보고 있습니다. Try out the new sidebar and notification menus! - #240 by MarcP

이제 점(dot)으로 표시되는 것을 확인했습니다.

image
image204×525 5.15 KB

그래서 개발 과정 중 어느 시점에 사이드바 코드가 변경되었을 것 같습니다.

3

네, 여기서는 변경되었습니다 :slightly_smiling_face:

4

흥미롭네요. 분기된 토픽 중 하나에서 사용자가 점(dot) 또는 읽지 않은 항목 수를 설정할 수 있다고 지적하고 있습니다. 이 설정은 설정 > 사이드바 > 내비게이션에서 찾을 수 있습니다. 관리자가 기본값으로 설정할 수 있으면 좋겠습니다. 제 인스턴스의 사용자는 기술에 익숙하지 않아서 해당 설정을 찾거나 존재하는지 알 가능성이 거의 없습니다.

여기 meta.discourse와 제 인스턴스 모두에서 제 화면에는 다음과 같이 회색 텍스트로 표시됩니다.

New-sidebar-custom-CSS-support-Discourse-Meta
New-sidebar-custom-CSS-support-Discourse-Meta245×639 15.3 KB

다른 색상의 텍스트를 사용하면 훨씬 더 잘 보일 것 같습니다.

5

안녕하세요,

새로운 사이드바를 소개하는 주제를 만드는 것이 좋은 해결책이 될 수 있다고 생각합니다. /my/ 매개변수를 사용하여 링크로 사용자를 올바른 위치로 쉽게 안내할 수 있습니다. :slightly_smiling_face:

yoursite.com/my/preferences/sidebar

이렇게요: https://meta.discourse.org/my/preferences/sidebar

네, 링크처럼 보이지 않도록 회색으로 처리되어 있습니다. 컴포넌트에 CSS를 추가하여 변경할 수 있습니다. :slightly_smiling_face:

예를 들어:

Common > CSS

// Sidebar new/unread color

.sidebar-section-link-wrapper {
  .sidebar-section-link {
    .sidebar-section-link-content-badge {
      color: var(--tertiary);
    }
  }
  // don't change the review link color
  .sidebar-section-link-review {
    .sidebar-section-link-content-badge {
      color: var(--danger);
    }
  }
}
6

좋네요, 감사합니다. 왜 그걸 생각하지 못했는지 모르겠어요. :person_facepalming:t5:

훌륭네요! 제가 찾던 바로 그거였어요!