Merge pull request 'Explicitly closing panel does not show the preview' (#16) from exyi/explicit-close into master
Reviewed-on: #16
This commit is contained in:
		
						commit
						1e3d3808f9
					
				
					 1 changed files with 15 additions and 10 deletions
				
			
		|  | @ -7,7 +7,7 @@ import TaskDisplay from "./TaskDisplay.svelte"; | ||||||
|     // export let tasks: TasksFile; |     // export let tasks: TasksFile; | ||||||
|     let selectedTask: TaskDescriptor | null = null |     let selectedTask: TaskDescriptor | null = null | ||||||
| 
 | 
 | ||||||
|     let heightClass: "collapsed" | "full" | "preview" = "collapsed" |     let heightClass: "closed" | "collapsed" | "full" | "preview" = "collapsed" | ||||||
| 
 | 
 | ||||||
|     export function preSelect(task: TaskDescriptor) { |     export function preSelect(task: TaskDescriptor) { | ||||||
|         if (heightClass != "full") { |         if (heightClass != "full") { | ||||||
|  | @ -30,7 +30,7 @@ import TaskDisplay from "./TaskDisplay.svelte"; | ||||||
|     } |     } | ||||||
| 
 | 
 | ||||||
|     function close() { |     function close() { | ||||||
|         heightClass = "collapsed" |         heightClass = "closed" | ||||||
|         window.setTimeout(() => window.scrollTo({ |         window.setTimeout(() => window.scrollTo({ | ||||||
|             top: 0, |             top: 0, | ||||||
|             left: 0, |             left: 0, | ||||||
|  | @ -60,10 +60,15 @@ import TaskDisplay from "./TaskDisplay.svelte"; | ||||||
|             padding: 0 10px 10px 10px; |             padding: 0 10px 10px 10px; | ||||||
|         } |         } | ||||||
|     } |     } | ||||||
| 
 |     /* Used when the panel is explicitly closed - collapsed would still show the hover preview */ | ||||||
|  |     .panel.closed { | ||||||
|  |         display: none; | ||||||
|  |     } | ||||||
|  |     /* Used when the panel is implicitly closed - it does not disappear when there is mouse over it */ | ||||||
|     .panel.collapsed:not(:hover) { |     .panel.collapsed:not(:hover) { | ||||||
|         display: none; |         display: none; | ||||||
|     } |     } | ||||||
|  |     /* Used when the user hovers over a node and we want to show that there is something - a small expandable preview */ | ||||||
|     .panel.preview, .panel:not(.full):hover { |     .panel.preview, .panel:not(.full):hover { | ||||||
|         height: 100px; |         height: 100px; | ||||||
|     } |     } | ||||||
|  |  | ||||||
		Reference in a new issue