체크박스가 비정렬 목록 항목과 함께 작동하지 않음

[xiasummer]

체크리스트가 "*"와 함께 제대로 작동하지 않는 것 같습니다.
"1."를 사용하면 정상적으로 작동합니다.

1. [] 1단계 작업

    * [] 1 수행 (여기서 검은 점이 사라집니다)

    * [] 2 수행

1. [] 2단계 작업

1. 1단계 작업

   • 1 수행 (여백은 괜찮지만, 점이 사라집니다)

   • 2 수행

2. 2단계 작업

[tobiaseigen]

요즘에도 그걸 눈치챘는데, 의도적인 것 같고 사실 이렇게 하는 게 더 마음에 들어. *나 -를 쓰면 불릿 포인트라는 불필요한 요소 없이 체크리스트 항목을 구조화된 리스트로 들여쓰기할 수 있거든.

- [] 마일스톤 1
   - [] 작업 1 
   - [] 작업 2
   - [] 작업 3
- [] 마일스톤 2 
   - [] 작업 1 
   - [] 작업 2
   - [] 작업 3

• 마일스톤 1
  • 작업 1
  • 작업 2
  • 작업 3
• 마일스톤 2
  • 작업 1
  • 작업 2
  • 작업 3

vs

[] 마일스톤 1
   [] 작업 1 
   [] 작업 2
   [] 작업 3
[] 마일스톤 2 
   [] 작업 1 
   [] 작업 2
   [] 작업 3

마일스톤 1
작업 1
작업 2
작업 3
마일스톤 2
작업 1
작업 2
작업 3

[xiasummer]

데모를 확인해 보니, 예제에서는 "서브 체크리스트"가 정상적으로 작동하지만 제 경우에는 그렇지 않습니다.

첫 번째 레벨이 "번호 매긴 목록(ordered list)"이고, 두 번째 레벨이 "번호 없는 목록(unordered list)"인 경우, 제대로 작동하지 않습니다.

또한, 저는 보통 매우 긴 문장을 작성합니다. 이렇게 되면, 제 예제처럼 체크리스트 항목이 짧지(몇 단어 수준) 않기 때문에, "점(dot)"이 없으면 보기 좋지 않습니다.

[tobiaseigen]

음, 한번 보자…

- [] 여러 단어로 설명되어 여러 줄로 넘어가는 마일스톤 1. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아. 
   - [] 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 1. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아. 
   - [] 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 2. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아. 
   - [] 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 3. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아. 
- [] 여러 단어로 설명되어 여러 줄로 넘어가는 마일스톤 2. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아. 
   - [] 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 1. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아. 
   - [] 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 2. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아. 
   - [] 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 3. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아. 

• 여러 단어로 설명되어 여러 줄로 넘어가는 마일스톤 1. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아.
  • 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 1. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아.
  • 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 2. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아.
  • 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 3. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아.
• 여러 단어로 설명되어 여러 줄로 넘어가는 마일스톤 2. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아.
  • 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 1. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아.
  • 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 2. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아.
  • 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 3. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아.

1. [] 여러 단어로 설명되어 여러 줄로 넘어가는 마일스톤 1. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아. 
   - [] 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 1. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아. 
   - [] 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 2. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아. 
   - [] 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 3. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아. 
2.  [] 여러 단어로 설명되어 여러 줄로 넘어가는 마일스톤 2. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아. 
   - [] 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 1. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아. 
   - [] 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 2. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아. 
   - [] 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 3. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아. 

1. 여러 단어로 설명되어 여러 줄로 넘어가는 마일스톤 1. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아.
   • 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 1. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아.
   • 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 2. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아.
   • 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 3. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아.
2. 여러 단어로 설명되어 여러 줄로 넘어가는 마일스톤 2. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아.
   • 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 1. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아.
   • 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 2. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아.
   • 여러 단어로 설명되어 여러 줄로 넘어가는 태스크 3. 그래도 긴, 긴, 긴 줄을 계속 써야지. 이 정도면 충분할 것 같아.

[tobiaseigen]

번호가 있는 목록과 볼릿 목록을 조합한 뒤 체크리스트 항목을 추가하면, 볼릿이 표시되지 않아 예상대로 들여쓰기가 적용되지 않는다는 점을 확인했습니다.

개인적으로는 위 예시처럼 볼릿 목록과 체크리스트를 함께 사용하는 방식을 선호합니다. 이렇게 하면 볼릿이 실제로 표시되지 않으면서도 깔끔하게 들여쓰기가 적용됩니다. 하지만 이 경우에도 예상대로 표시되지 않습니다.

두 가지 현상의 원인은 동일할 수 있습니다.

[Canapin (Coin-coin le Canapin)]

필요하다면 @xiasummer 를 위한 이런 해킹식 CSS 수정안이 있습니다:

불릿 표시

.cooked ol ul li.has-checkbox {
    margin-left: 1em;
    list-style-type: initial;
    .list-item-checkbox {
        left: 0;
        position: relative;
    }
}

불릿 숨기기:

.cooked ol ul li.has-checkbox {
    margin-left: 1em;
}