옵시디언 가이드
추천 플러그인
노트관리방법론
플러그인 사전

다다

옵시디언 활용, 개인 지식 관리

분류 전체보기 352

로그인

로그아웃 글쓰기 관리

Homemade Source/Css Snippets 29

[CSS Snippet] 파일 탐색기 폴더 색상 변경하기 파일 탐색기 폴더 색상 변경하는 CSS Snippet입니다. 예시 CSS Snippet .theme-light, .theme-dark { --Fold0: #ffe2e2; --Fold1: #ffdee9; --Fold2: #f6e1ff; --Fold3: #e9dfff; --Fold4: #e1e5ff; --Fold5: #d4eaff; --Fold6: #cdedff; --Fold7: #ccf2f7; --Fold8: #d5f8f4; --Fold9: #d8f8da; --FoldA: #ecffdb; --FoldB: #f4fbd2; } /* ===folder-colorful-order ============ */ .nav-folder.mod-root>.nav-folder-children .nav-folder-title..
Homemade Source/Css Snippets 2024.04.02 1
[CSS Snippet] 이미지 확대기능 구현하기 이미지 확대을 CSS Snippet으로 구현 예시 CSS Snippet @media (hover: hover) { .image-embed.is-loaded img, .markdown-preview-view .internal-embed:not(:has(> img)) img { line-height: 0; background-color: transparent; } img:not(.callout-content img):not(.thumbnailImage):not( img .community-item-screenshot ) { max-width: 100%; cursor: zoom-in; } body img:active:not(.callout-content img):not(.thumbnailImage) { bac..
Homemade Source/Css Snippets 2024.04.01 0
[CSS Snippet] 선택한 텍스트의 색상 변경하기 선택한 텍스트의 색상 변경하는 CSS Snippet입니다. 예시 CSS Snippet ::selection { color: white !important; background: deeppink !important; }
Homemade Source/Css Snippets 2024.03.29 0
[CSS Snippet] 편집모드에서 현재 줄 강조하기 Obsidian의 기본 테마에는 편집 모드에서 현재 줄 강조하는 기능이 없습니다. CSS Snippet을 통해 변경할 수 있습니다. 예시 Css Snippet .markdown-source-view.mod-cm6 .cm-line.cm-active{ background-color: rgba(var(--mono-rgb-100), 0.05) } .markdown-source-view.mod-cm6 .cm-lineNumbers .cm-gutterElement.cm-active { font-weight: 600; color: grey; }
Homemade Source/Css Snippets 2024.03.24 0
[CSS Snippet] Dialogue 플러그인의 iMessage 스타일 적용하기 Dialogue 플러그인의 iMessage 스타일 적용한 Css Snippet입니다. 예시 CSS 코드 .theme-light { --imessage-blue: rgba(10, 132, 255, .9); --imessage-grey: rgba(234, 234, 234, 1); } .theme-dark { --imessage-blue: rgba(10, 132, 255, .7); --imessage-grey: var(--color-base-30); } .dialogue-plugin-message { background-color:unset; } .dialogue-plugin-message-wrapper-right { text-align: right; } .dialogue-plugin-message-title..
Homemade Source/Css Snippets 2024.03.01 0
[CSS Snippet] Task 완료시 취소선 안보이게 하기 Task 완료시 취소선 안보이게 하는 CSS Snippet입니다. 예시 CSS Snippet .markdown-source-view.mod-cm6 .HyperMD-task-line[data-task="x"], .markdown-source-view.mod-cm6 .HyperMD-task-line[data-task="X"] { text-decoration: unset !important; } ul > li.task-list-item[data-task="x"], ul > li.task-list-item[data-task="X"] { text-decoration: unset !important; }
Homemade Source/Css Snippets 2024.02.29 0
[Css Snippet] 상태바 스타일 변경하기 상태 표시줄에 투명도를 추가하여 눈에 띄지 않게 만듭니다. 마우스를 올리면 투명도가 복원됩니다. 테두리 제거, 호버 복원 예시 Css Snippet .status-bar { border-width: 0; opacity: .5; transition: all .2s linear; } .status-bar:hover { opacity: 1; border-width: var(--status-bar-border-width); }
Homemade Source/Css Snippets 2024.02.29 0
[CSS Snippet] 외부 링크 아이콘 표시하기 외부 링크 아이콘 표시하는 CSS Snippet입니다. 예시 CSS 코드 .external-link::before { padding-right: 3px; vertical-align: middle; height: 16px; width: 16px; padding-top: 0px; } .external-link[href*="."]::before { content: url("data:image/svg+xml,%3Csvg t='1631866977643' class='icon' viewBox='0 0 1024 1024' version='1.1' xmlns='http://www.w3.org/2000/svg' p-id='32115' data-darkreader-inline-fill='' width='20' height..
Homemade Source/Css Snippets 2024.02.29 0
[CSS Snippet] 탭 스타일 변경하기 옵시디언의 탭 스타일을 변경하는 CSS Snippet입니다. 예시 CSS 코드 /* Commpact Tabs Cleaner, smaller tabs with hidden buttons https://github.com/replete/obsidian-minimal-theme-css-snippets */ .workspace .mod-root .workspace-tab-header-container-inner { padding:0px 0 0px 5px; margin: 5px 0 2px -2px; } .workspace .mod-root .workspace-tab-header.is-active { background: none; box-shadow: none; } .workspace .mod-root .work..
Homemade Source/Css Snippets 2024.02.28 0
[CSS Snippet] 체크박스를 원으로 변경하기 옵시디언의 체크박스 스타일을 원으로 변경하는 CSS snippet입니다. 예시 CSS 코드 input[type="checkbox"], .cm-formatting-task { -webkit-appearance: none; appearance: none; border-radius: 50%; border: 1px solid var(--text-faint); padding: 0; vertical-align: middle; } .cm-s-obsidian span.cm-formatting-task { color: transparent; width: 1.25em !important; height: 1.25em; display: inline-block; } .markdown-preview-view .task-list-..
Homemade Source/Css Snippets 2024.02.28 0
[CSS Snippet] Preview 박스 사이즈 변경하기 Preview 박스 사이즈 변경하는 CSS Snippet입니다. 예시 CSS 코드 .popover.hover-popover > .markdown-embed{ width: 500px; height: 700px; } width와 height의 크기를 원하는대로 변경해서 사용하세요.
Homemade Source/Css Snippets 2024.02.28 0
[CSS Snippet] 이미지 정렬하기 이미지 링크에 구분자를 넣어서 이미지 정렬하는 CSS snippet입니다. 예시 CSS .markdown-preview-view .image-embed[src*="#center"] { display: block; margin-left: auto; margin-right: auto; width: 50%; } .markdown-preview-view .image-embed[src*="#left"] { display: block; margin-left: 0; margin-right: auto; width: 50%; } .markdown-preview-view .image-embed[src*="#right"] { display: block; margin-left: auto; margin-right: 0; wid..
Homemade Source/Css Snippets 2024.02.28 0
[CSS Snippet] 구분선(---) 스타일 변경하기 구분선(hr) 스타일을 변경하는 CSS Snippet 입니다. 예시 CSS 코드 .markdown-preview-view hr, .markdown-source-view div.hr.cm-line hr { border-top: 1px solid; border-image: linear-gradient(to right, #ef201c, #e96036,#e6ef82, #e09a29, #41e249, #26c6da, #4e5ff2, #7e57c2, #de5fb8) 7; }
Homemade Source/Css Snippets 2024.02.28 0
[CSS Snippet] 클래식 스타일 callout 옵시디언 초기 버전의 callout 스타일입니다. 예시 CSS 코드 .callout { --callout-radius: 2px; padding: 0; background-color:var(--admonition-bg-color); border-left: solid 4px rgb(var(--callout-color)); } .callout .callout-title { padding: 6px; background-color: rgba(var(--callout-color), 0.4); } .callout .callout-content { padding: 5px 15px; background-color: rgba(var(--callout-color), 0.1); }
Homemade Source/Css Snippets 2024.02.26 0
[CSS Snippet] 윈도우 스타일 callout 윈도우 스타일 callout Snippet 입니다. 예시 CSS 코드 .callout { border:none; box-shadow: inset 0 0 0 2px rgba(var(--callout-color), 0.25), 0px 0.5px 1px 0.5px rgba(0, 0, 0, 0.1) !important; padding: 0; background-color:var(--admonition-bg-color); } .callout .callout-title { padding: 6px; background-color: rgba(var(--callout-color), 0.4); } .callout .callout-content { padding: 5px 15px; background-color: rgba(..
Homemade Source/Css Snippets 2024.02.26 0

1 2

Obsidian Page

옵시디언 기초 가이드

노트 관리 방법론

플러그인 가이드

플러그인 사전

최근 글

인기 글

© Copyright 2024 Jnik

Uploading...

티스토리툴바

단축키

내 블로그

내 블로그 - 관리자 홈 전환	`Q` `Q`
새 글 쓰기	`W` `W`

블로그 게시글

글 수정 (권한 있는 경우)	`E` `E`
댓글 영역으로 이동	`C` `C`

모든 영역

이 페이지의 URL 복사	`S` `S`
맨 위로 이동	`T` `T`
티스토리 홈 이동	`H` `H`
단축키 안내	`Shift` + `/` `⇧` + `/`

* 단축키는 한글/영문 대소문자로 이용 가능하며, 티스토리 기본 도메인에서만 동작합니다.