LostPaul / obsidian-folder-notes

Create notes within folders that can be accessed without collapsing the folder, similar to the functionality offered in Notion.
https://lostpaul.github.io/obsidian-folder-notes/
GNU Affero General Public License v3.0
264 stars 11 forks source link

FR: Style collapse icon for folder note #126

Open l2eused opened 1 week ago

l2eused commented 1 week ago

in file explorer > style settings, add option to change collapse icon into note icon.

this feature request is just for cool ui 👍🏻

l2eused commented 1 week ago

this is example css that may useful

.workspace-leaf-content:not([data-type=search]) .tree-item .has-folder-note .collapse-icon {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16px' height='16px' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z'%3E%3C/path%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4'%3E%3C/path%3E%3Cpath d='M9 15h6'%3E%3C/path%3E%3C/svg%3E");
    mask-repeat: no-repeat;
    background-color: currentColor;
}

.workspace-leaf-content:not([data-type=search]) .tree-item.is-collapsed .has-folder-note .collapse-icon {
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16px' height='16px' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V7Z'%3E%3C/path%3E%3Cpath d='M14 2v4a2 2 0 0 0 2 2h4'%3E%3C/path%3E%3Cpath d='M9 15h6'%3E%3C/path%3E%3Cpath d='M12 18v-6'%3E%3C/path%3E%3C/svg%3E")
}

.workspace-leaf-content:not([data-type=search]) .tree-item .collapse-icon svg {
    display: none;
}