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;
 | |
| }
 | |
| 
 |