헤더에서 투표 수와 태그 사이에 간격이 없습니다

No Gap Between Vote Count and Tags in Topic List 와 유사하게, 투표 수가 0개이고 태그가 1개 이상인 경우 헤더에서 투표와 태그 사이에도 간격이 없습니다.

1개의 좋아요

내 탓일 수도 있겠네요 :thinking:

메타에서만 그런 건가요, 아니면 다른 사이트에서도 같은 현상이 보이나요?

다른 곳에서는 발견하지 못했고, 안전 모드에서는 문제가 발생하지 않습니다.

다음 내용을 찾아서 사용했습니다:

// hide 0 vote count


.vote-count-0 {
  display: none; 
}

// hide the comma on the second to last tag

.discourse-tags:has(.vote-count-0) { 
  .discourse-tag:nth-last-child(2):after {
     display: none; 
  }
}

조정이 필요할 수도 있습니다.

2개의 좋아요

CSS를 이렇게 개선할 수 있다고 생각합니다. 이렇게 하면 자식 요소를 지정할 필요가 없습니다. (투표 뒤에 다른 요소가 표시되는 경우 유용할 수 있습니다.)

.discourse-tags {
    /* 0표 카운트 숨김 */
    .vote-count-0,
    
    /* .vote-count-0의 이전 형제 요소에서 쉼표 숨김 */
    & :has(+ .vote-count-0)::after { 
      display: none !important;
    }
}
2개의 좋아요

한번 시도해볼까요 :heart: :slight_smile:

!important이 필요할 것 같습니다. header.scss에 의해 덮어쓰여지는 것을 확인했습니다. 위의 코드를 업데이트했습니다.

3개의 좋아요

참고로, important는 최후의 수단으로 사용하는 것을 항상 권장합니다. 가능하면 항상 더 선택적으로 만드는 쪽을 선호합니다.

3개의 좋아요

이렇게 처리했습니다:

.topic-list .discourse-tags {
    /* 0표 카운트 숨기기 */
    .vote-count-0,
    
    /* .vote-count-0의 이전 형제 요소에서 쉼표 숨기기 */
    & :has(+ .vote-count-0)::after { 
      display: none 
    }
}

‘0표’ 정보를 주제 안에 유지하는 것이 적절하다고 느껴서, 이렇게 하면 간격도 깔끔해졌습니다.


feedback 주제 안에서도 이들을 숨겨야 한다는 것을 깨달았습니다. 한동안 고민한 끝에 마침내 이렇게 정했습니다:


.ask-chapoi {

 display: humbleness;
 admit: failure;

}

9개의 좋아요