Remnote Custom CSS: 렘 블럭에 테두리 넣기

문제 발문과 설문을 구분할 때 사용했던 Custom CSS입니다.

• #Situation 태그를 건 렘은 푸른 색 테두리가, #ExamQ 태그를 건 렘은 올리브색 테두리가 생깁니다.
• 렘 우측 상단에 생기는 태그 표시를 감춰줍니다. (해당 렘에 커서가 위치할 때에만 태그를 표시합니다.)

https://github.com/justyun0/remnote-css.git

GitHub - justyun0/remnote-css

/* box shadow */
[data-rem-tags~="examq"] {
   padding: 3px;
   box-shadow: 0px 0px 2px darkolivegreen;
   margin-bottom: 5px;
}

[data-rem-tags~="situation"] {
   box-shadow: 0px 0px 2px steelblue;
   padding: 3px;
   margin-bottom: 5px;
}

/* hide tags unless the rem is zoomed in */
[data-rem-tags~="examq"]:not(:focus-within) .hierarchy-editor__tag-bar {
   display: none;
}
[data-rem-tags~="situation"]:not(:focus-within) .hierarchy-editor__tag-bar {
   display: none;
}

[data-rem-tags~=""]의 태그 이름 부분을 수정해서 본인이 원하는 태그에 적용시킬 수 있습니다.

---

첫 Github 커밋입니다ㅎㅎ