[CSS Snippet] 단락 앞과 뒤의 간격을 사용자 정의

단락 앞과 뒤의 간격을 Style Settings으로 정의하는 Css snippet입니다.

 

이 스니펫은 Things 테마의 단락조절부분만 떼내온 것으로 편집모드에서 단락을 조절할 수 있습니다. Style Settings 에서 조절할 수 있다는 장점이 있습니다.

---

예시

---

Css Snippet

body {
    --paragraph-margin-top:10px;
    --paragraph-margin-bottom:5px;
}

div:not(.HyperMD-header,.HyperMD-list-line).cm-line {
    padding-top:var(--paragraph-margin-top) !important;
    padding-bottom:var(--paragraph-margin-bottom) !important;
}

div:not(.HyperMD-header,.HyperMD-list-line).cm-line:has(.cm-fold-indicator) {
    padding-top:unset !important;
    padding-bottom:unset !important;
}
div:not(.HyperMD-header,.HyperMD-list-line).cm-line:has(.cm-hmd-frontmatter) {
    padding-top:unset !important;
    padding-bottom:unset !important;
}

/* @settings
name: 단락 간격 조정 (Things Theme optimize)
id: things-style-optimize
settings:
    -
        id: paragraph-margin-top
        title: 단락 앞 간격
        type: variable-text
        default: 5px
    -
        id: paragraph-margin-bottom
        title: 단락 뒤 간격
        type: variable-text
        default: 5px    
*/

---

관련 글

옵시디언 기초: 폰트와 가독성 향상

옵시디언을 사용하면 개인의 취향과 가독성 향상을 위해 폰트를 조정할 수 있습니다. 폰트는 텍스트의 가독성과 사용자 경험에 큰 영향을 미치므로, 옵시디언에서 적절한 폰트를 선택하는 것은

kaminik.tistory.com

테마의 설정을 바꿔주는 Style Settings 플러그인

개요 Style Settings 플러그인은 테마와 일부 플러그인의 시각적 요소를 사용자 정의할 수 있는 기능을 제공합니다. 이 플러그인의 강력한 커스터마이징 기능을 활용하여 개인적인 작업 환경을 더

kaminik.tistory.com

---