사용자 승인 검토 대기열에서 사용자 정의 필드 1개만 표시

제품 지원
1

CSS 관련해서 도와주실 분 계신가요?

우리 포럼에는 사용자 정의 필드(UCF)가 많이 있는데, 그중 가입 시 사용되는 필드는 단 하나뿐입니다. 이 필드는 승인 여부를 결정하는 데 매우 중요합니다.

따라서 이제 검토 대기열에서 해당 필드(우연히 첫 번째에 위치해 있습니다)를 제외한 나머지를 모두 숨기려고 합니다. 그래야 제 고생하는 moderator들이 새로운 사용자 승인 시마다 빈 필드들을 일일이 볼 필요가 없게 되니까요.

지금까지 이렇게 진행했습니다:

.reviewable-user-details.user-field{
     display: none;
    /*검토 대기열에서 UCF를 숨기려는 시도 - 현재는 모두 숨겨짐*/
}

이렇게 하면 모든 필드가 숨겨지는데, 첫 번째 필드는 표시해야 합니다. &:nth-of-type(1)을 시도해 보았지만 여기서는 작동하지 않습니다. HTML 구조 때문에 그런 것 같습니다. 해당 요소들에 클래스가 없거든요.

어떤 조언이 있을까요?

6

여러분의 &:nth-of-type(1) CSS가 작동할 수 있도록 작은 수정을 했습니다. CSS가 적용되지 않도록 막고 있던 불필요한 감싸는 div가 하나 있었습니다. 몇 시간 내에 사이트를 업데이트하시면 이 변경 사항이 적용될 것입니다.

7

정말 대단하세요!!! 감사합니다!!!

8

ember div가 이제 사라진 것을 확인할 수 있습니다. 감사합니다.

하지만 여전히 CSS가 작동하지 않고, 모든 요소가 숨겨집니다. 여러 가지 변형을 시도해 보았지만, 아마도 제가 어리석은 실수를 하고 있는 것 같습니다. 또한, 제가 원하는 대로 실제로 작동하게 된다면 어떻게 될지 궁금합니다. 승인 요청이 필요한 2번째나 3번째 사용자의 모든 필드가 숨겨지는 것 아닙니까?

다음은 제가 시도해 본 코드입니다:

.reviewable-user-details.user-field {
    display: none;
            &:nth-of-type(1){
            display: block;
        }
}
9

아 맞다, 그건 안 되는데… 당연한 거지… 나는 항상 nth-of-type가 클래스가 아니라 요소에 초점을 맞춘다는 걸 잊어버려.

그러니까 이 경우 요소가 없고 클래스 이름만 있어서 동작하지 않는 거야. 하지만 요소를 추가하면(이 경우 div), 첫 번째 div 형제 요소에도 .user-field 클래스가 있을 때만 매칭되게 돼(이 부모 요소 안에는 user-field보다 앞에 다른 div들이 있어서 그렇지 않아).

어쨌든, 결론부터 말하면… 여기서는 일반 형제 조합자(general sibling combinator)가 대신 동작해. .reviewable-user-fields 안에서 이는 첫 번째 .user-field의 형제인 모든 .user-field를 선택해.

.reviewable-user-fields .user-field ~ .user-field {
    display: none;
}
10

무슨 말씀인지 전혀 모르겠네요 - 하지만 잘 작동합니다. 감사합니다!

@Angus님, 가입 시 Custom Wizard 플러그인에 의존하는 비공개 포럼의 다른 분들에게도 도움이 될 수 있을 것 같습니다.

두 번째 또는 세 번째 .user-field를 어떻게 노출할 수 있을까요? 지금은 필요하지 않지만(현재로서는) 나중에 필요해질 수도 있을 것 같습니다.