mirror of
https://github.com/caffa/Obsidian-Current-Folder-Note-Display-Plugin.git
synced 2026-07-22 09:50:27 +00:00
You should avoid assigning styles via JavaScript or in HTML and instead move all these styles into CSS so that they are more easily adaptable by themes and snippets.
This commit is contained in:
parent
931b40a4fa
commit
298f024f1f
2 changed files with 22 additions and 22 deletions
23
main.ts
23
main.ts
|
|
@ -271,31 +271,20 @@ export class CurrentFolderNotesDisplayView extends ItemView {
|
|||
a.innerText = a.innerText.replace(/\w\S*/g, function(txt){return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase();});
|
||||
}
|
||||
// make the items similar to file explorer
|
||||
// a.style.display = 'block';
|
||||
a.style.margin = '0px';
|
||||
a.style.padding = '0px';
|
||||
|
||||
a.style.cursor = 'pointer';
|
||||
a.style.color = 'var(--text-normal)';
|
||||
a.style.textDecoration = 'none';
|
||||
a.style.fontSize = 'var(--font-small)';
|
||||
// a.style.textDecoration = 'underline';
|
||||
// for current file, give it a different color
|
||||
a.className = 'anchor-style';
|
||||
// If the file path matches the current file path, assign the 'current-file' class
|
||||
if (file.path === currentFilePath) {
|
||||
a.style.color = 'var(--text-muted)';
|
||||
// a.style.backgroundColor = 'var(--color-base-40)';
|
||||
// background style is highlighter
|
||||
// a.style.fontWeight = 'bold';
|
||||
// add an indicator that this is the current file with a > symbol
|
||||
a.className += ' current-file';
|
||||
a.innerText = '> ' + a.innerText;
|
||||
}
|
||||
|
||||
// make pretty when hover
|
||||
a.onmouseover = () => {
|
||||
a.style.backgroundColor = 'var(--interactive-hover)';
|
||||
a.classList.add('hover-style');
|
||||
}
|
||||
// and remove when not hovering
|
||||
a.onmouseout = () => {
|
||||
a.style.backgroundColor = 'transparent';
|
||||
a.classList.remove('hover-style');
|
||||
}
|
||||
|
||||
// When a note is clicked, open it in the workspace
|
||||
|
|
|
|||
21
styles.css
21
styles.css
|
|
@ -1,8 +1,19 @@
|
|||
/*
|
||||
/* styles.css */
|
||||
|
||||
This CSS file will be included with your plugin, and
|
||||
available in the app when your plugin is enabled.
|
||||
.anchor-style {
|
||||
display: 'block';
|
||||
margin: 0px;
|
||||
padding: 0px;
|
||||
cursor: 'pointer';
|
||||
color: var(--text-normal);
|
||||
text-decoration: 'none';
|
||||
font-size: var(--font-small);
|
||||
}
|
||||
|
||||
If your plugin does not need CSS, delete this file.
|
||||
.current-file {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
*/
|
||||
.hover-style {
|
||||
background-color: var(--interactive-hover);
|
||||
}
|
||||
Loading…
Reference in a new issue