Comments (2)
thanks.
Yes, to display icons you need to modify my snippet. All you need to do is to know your folder names and assign them an icon.
short demo:
- make a new folder in Obsidian and name that one Journal
- open the command palette
cmd+p
on Mac, should bectrl+p
on Win/Linux and type "reload" for "reload app without saving" - You newly created folder (Journal) should have an icon now.
long demo
add your folder names:
- First of all, open folder-icons-v2.css in a text editor of your choice.
- consider this snippet is organized in 2 parts: the top section stores all available icons and after this section follows the ruleset section.
- now search for "Journal" down below in the rulesets and replace that name twice (this because of "light" and "dark" theme) WITH the name of one (1) of your folders
- open the command palette
cmd+p
on Mac, should bectrl+p
on Win/Linux and type "reload" for "reload app without saving" - You folder should have an icon now.
Note, you can assign Multiple Names to an icon. See again the example rule for "--openbook-icon". This is one ruleset -block:
/* Journal, Education, Training */
body:not(.is-mobile).theme-dark .tree-item-self.is-clickable.nav-folder-title:is([data-path$="Journal"], [data-path$="Education"], [data-path$="Training"]):hover>.tree-item-inner.nav-folder-title-content::after {
filter: inherit;
}
.nav-folder-title:is([data-path$="Journal"], [data-path$="Education"], [data-path$="Training"]) .nav-folder-title-content::after {
content: var(--openbook-icon);
}
this ruleset contains: "Journal", "Education" and "Training". Replace these names inside body:not(.is-mobile).theme-dark
and .nav-folder-title:is
with names of your folders. (you've to do it twice because of "dark" and "light" theme)
Example: for simplicity, I renamed my folders to A, B and C:
body:not(.is-mobile).theme-dark .tree-item-self.is-clickable.nav-folder-title:is([data-path$="A"], [data-path$="B"], [data-path$="C"]):hover>.tree-item-inner.nav-folder-title-content::after {
filter: inherit;
}
.nav-folder-title:is([data-path$="A"], [data-path$="B"], [data-path$="C"]) .nav-folder-title-content::after {
content: var(--openbook-icon);
}
Now if you don't like the icon given to A, B and C, search the head part of my snippet for another icon name (eg --bookmark-icon
) and replace the content: var(--openbook-icon);
declaration with, content: var(--bookmark-icon);
.
from obsidian-dune84.
I added a small tutorial on how to modify icons to my Wiki, under Folders.md
If you have further questions, feel free to ask.
And if my tutorial helped, you are welcome to close this bug report.
from obsidian-dune84.
Related Issues (18)
- Note path not shown HOT 4
- [SUGGESTION] Clean embeds
- Trouble accessing emojis HOT 5
- Typesetting alignment HOT 24
- Resizing Issues HOT 2
- New dune users HOT 8
- Render issues on windows HOT 18
- Footnotes not displayed on mobile HOT 5
- Missing icons/characters, fonts not working. HOT 6
- File names too close to edge HOT 3
- List overlap when used with Kanban HOT 4
- File extension in file explorer readability in Dark mode HOT 2
- Files icon hidden HOT 3
- Canvas: contrast background-cards suboptimal HOT 3
- Colored folder HOT 2
- [FEATURE REQUEST] Show note path in title bar HOT 1
- [SUGGESTION] Clean embeds HOT 1
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from obsidian-dune84.