221 lines
		
	
	
		
			5.1 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
			
		
		
	
	
			221 lines
		
	
	
		
			5.1 KiB
		
	
	
	
		
			CSS
		
	
	
	
	
	
/*
 | 
						|
    Compact File Explorer
 | 
						|
    I prefer a condensed view with the chevron on the right.
 | 
						|
 | 
						|
	NOTE: Fix padding bug on startup
 | 
						|
	--------------------------------
 | 
						|
 | 
						|
	Obsidian calculates paddings via JS and there is a bug sometimes
 | 
						|
	with the wrong indents appearing on startup.
 | 
						|
 | 
						|
	The fix for this is to turn dummy.css snippet on and off.
 | 
						|
 | 
						|
	To automate this fix (KLUDGE incoming):
 | 
						|
	- Install 'Snippet Commands' by death_au from Community Plugins
 | 
						|
	- Install 'Templater' plugin
 | 
						|
	- Create a new startup script in your vault containing this code:
 | 
						|
	<%* app.commands.executeCommandById('snippet-commands-obsidian:snippet-command-dummy'); %>
 | 
						|
 | 
						|
	Now, the padding will be reset on startup. Even with this fix, sometimes
 | 
						|
	large folders have incorrect padding offsets further down.
 | 
						|
 | 
						|
    https://github.com/replete/obsidian-minimal-theme-css-snippets
 | 
						|
*/
 | 
						|
 | 
						|
/* Workspace: Sidebar navigation */
 | 
						|
[data-type=file-explorer] {
 | 
						|
    .nav-header {
 | 
						|
        padding-left:14px;
 | 
						|
        padding-bottom:3px;
 | 
						|
        padding-top: 6px;
 | 
						|
 | 
						|
        .nav-buttons-container {
 | 
						|
            opacity:0.7;
 | 
						|
            transition: .2s opacity ease-in;
 | 
						|
 | 
						|
            &:hover {
 | 
						|
                opacity:1;
 | 
						|
            }
 | 
						|
        }
 | 
						|
 | 
						|
        .clickable-icon {
 | 
						|
            padding-left:4px;
 | 
						|
        }
 | 
						|
    }
 | 
						|
 | 
						|
    .nav-files-container {
 | 
						|
        padding-left: 9px;
 | 
						|
        padding-right: 9px;
 | 
						|
    }
 | 
						|
 | 
						|
    .collapse-icon {
 | 
						|
        position:relative !important;
 | 
						|
        margin-left:0 !important;
 | 
						|
        order:4;
 | 
						|
        padding-left:3px;
 | 
						|
 | 
						|
        svg {
 | 
						|
            stroke:var(--text-faint);
 | 
						|
            margin-top:1px;
 | 
						|
        }
 | 
						|
    }
 | 
						|
 | 
						|
    /* Fix Folder Note Count display */
 | 
						|
    .nav-folder-title-content {
 | 
						|
        flex-grow:0 !important;
 | 
						|
    }
 | 
						|
 | 
						|
    /* Fix flashing color */
 | 
						|
    .is-flashing {
 | 
						|
        background-color: var(--tx3)
 | 
						|
    }
 | 
						|
 | 
						|
	/* We're fighting obsidians JS on calculated paddings here, fix left margin */
 | 
						|
	.tree-item-self[style] {
 | 
						|
		padding-left:8px !important;
 | 
						|
	}
 | 
						|
 | 
						|
	/* Disable sliding animation */
 | 
						|
	* {
 | 
						|
		transition: none !important;
 | 
						|
	}
 | 
						|
 | 
						|
	/* tree trunk */
 | 
						|
	.tree-item-children {
 | 
						|
		border-inline-start:none;
 | 
						|
		position:relative;
 | 
						|
 | 
						|
		&::before {
 | 
						|
			content:'';
 | 
						|
			position:absolute;
 | 
						|
			top:0;
 | 
						|
			left:-1px;
 | 
						|
			bottom:12px;
 | 
						|
			width:1px;
 | 
						|
			background:var(--nav-indentation-guide-color);
 | 
						|
		}
 | 
						|
	}
 | 
						|
 | 
						|
	/* tree branches */
 | 
						|
	.nav-file,
 | 
						|
	.nav-folder {
 | 
						|
		position:relative;
 | 
						|
		z-index:1;
 | 
						|
	}
 | 
						|
	.nav-folder-children .nav-file-title::before,
 | 
						|
	.nav-folder-children .nav-folder-title::before {
 | 
						|
		content:'';
 | 
						|
		display:block;
 | 
						|
		width:8px;
 | 
						|
		height:1px;
 | 
						|
		background-color: var(--nav-indentation-guide-color);
 | 
						|
		position:absolute;
 | 
						|
		margin-left:-13px;
 | 
						|
		z-index:-1;
 | 
						|
	}
 | 
						|
	.nav-folder.mod-root .nav-folder > .nav-folder-children {
 | 
						|
		margin-left:8px;
 | 
						|
		position:relative;
 | 
						|
		padding-left:7px;
 | 
						|
	}
 | 
						|
	.nav-folder.mod-root .nav-file:hover .nav-file-title::before,
 | 
						|
	.nav-folder.mod-root .nav-file-title.is-active::before {
 | 
						|
		width:8px;
 | 
						|
	}
 | 
						|
 | 
						|
	/* overflowing title alignment fix */
 | 
						|
	.nav-file-title,
 | 
						|
	.nav-folder-title {
 | 
						|
		padding-right:4px;
 | 
						|
		z-index:2;
 | 
						|
	}
 | 
						|
 | 
						|
	/* .nav-folder.mod-root .nav-folder > .nav-folder-children {
 | 
						|
		margin-left:13px !important;
 | 
						|
		outline:1px solid red;
 | 
						|
	} */
 | 
						|
 | 
						|
	/* .nav-folder.mod-root .nav-folder > .nav-folder-children:has([class*=nav-])::after {
 | 
						|
		background-color:var(--bg2, var(--background-primary));
 | 
						|
	} */
 | 
						|
 | 
						|
	/* Fix Folder Note Count display */
 | 
						|
	.nav-folder-title-content {
 | 
						|
		flex-grow:0 !important;
 | 
						|
	}
 | 
						|
 | 
						|
	/* Folder Count plugin alignment */
 | 
						|
	.nav-folder-title[data-count]::after {
 | 
						|
		color: var(--tx3, var(--text-faint));
 | 
						|
		position:absolute;
 | 
						|
		right:0;
 | 
						|
		transform: translate(0, 1px);
 | 
						|
		opacity:0;
 | 
						|
		transition: .2s opacity ease-in;
 | 
						|
		padding-right:3px;
 | 
						|
	}
 | 
						|
 | 
						|
	.nav-files-container:hover .nav-folder-title[data-count]::after {
 | 
						|
		opacity:1;
 | 
						|
	}
 | 
						|
 | 
						|
	/* Make attachment folders less visible */
 | 
						|
	.nav-files-container [data-path*=attachments],
 | 
						|
	.nav-files-container [data-path*=Assets] {
 | 
						|
		opacity:0.6;
 | 
						|
	}
 | 
						|
 | 
						|
	/* style file tag */
 | 
						|
	.nav-file-tag {
 | 
						|
		/* Here be dragons! */
 | 
						|
		margin-left:0;
 | 
						|
		margin-right:3px;
 | 
						|
		text-shadow: 0.5px 0 0 black;
 | 
						|
		text-indent:-5px;
 | 
						|
		overflow:visible;
 | 
						|
		font-weight:bold;
 | 
						|
		line-height:10px;
 | 
						|
		width:13px;
 | 
						|
		height:13px;
 | 
						|
		font-size: 11px;
 | 
						|
		letter-spacing:-0.5px;
 | 
						|
		vertical-align:middle;
 | 
						|
		text-rendering: geometricPrecision;
 | 
						|
		/* font-family: "JetBrains Mono", monospace; */
 | 
						|
		font-family: "Lucida Console", "Lucida Sans Typewriter", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Liberation Mono", "Nimbus Mono L", Monaco, "Courier New", Courier, monospace;
 | 
						|
		border-radius:0;
 | 
						|
 | 
						|
		/* suffix file tag styling */
 | 
						|
		.nav-file-title-content + & {
 | 
						|
			margin-left: .5rem;
 | 
						|
			letter-spacing: 0;
 | 
						|
		}
 | 
						|
	}
 | 
						|
 | 
						|
	/* Hide file tag when an icon is set */
 | 
						|
	.nav-file:has(.nav-file-tag):has(.iconize-icon) {
 | 
						|
		.nav-file-tag {display:none}
 | 
						|
	}
 | 
						|
 | 
						|
	/* Fix weird indent on root vault files */
 | 
						|
	.nav-files-container .nav-folder.mod-root > .nav-folder-children > .tree-item.nav-file {
 | 
						|
 | 
						|
		.nav-file-title.is-active::before {
 | 
						|
			/* fix indent on active file in root */
 | 
						|
			display:none;
 | 
						|
		}
 | 
						|
 | 
						|
		&:hover .nav-file-title::before {
 | 
						|
			/* fix indent on hovered file in root */
 | 
						|
			display:none !important;
 | 
						|
		}
 | 
						|
	}
 | 
						|
 | 
						|
}
 | 
						|
 | 
						|
/* Align vault title */
 | 
						|
body:not(.is-mobile) .nav-folder.mod-root>.nav-folder-title .nav-folder-title-content {
 | 
						|
    margin-left:-3px;
 | 
						|
}
 | 
						|
 |