From e3a86973922fa9370900f2e3b07a78222e44b056 Mon Sep 17 00:00:00 2001
From: Terry Truong <terry06890@gmail.com>
Date: Wed, 29 Jun 2022 14:49:01 +1000
Subject: Remove constant-scrollbar-gap for ancestry-bar

Avoided having overflow:auto cause tile-overlapping scrollbar by
using less tile-padding. Trying to solve this by dynamically
detecting overflow seemed to get messy.
---
 src/components/AncestryBar.vue | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

(limited to 'src/components/AncestryBar.vue')

diff --git a/src/components/AncestryBar.vue b/src/components/AncestryBar.vue
index 204798b..c2aadf8 100644
--- a/src/components/AncestryBar.vue
+++ b/src/components/AncestryBar.vue
@@ -23,7 +23,7 @@ export default defineComponent({
 	},
 	computed: {
 		imgSz(){
-			return this.uiOpts.ancestryBarBreadth - this.lytOpts.tileSpacing*2 - this.uiOpts.scrollGap;
+			return this.uiOpts.ancestryBarBreadth - this.lytOpts.tileSpacing - this.uiOpts.scrollGap;
 		},
 		dummyNodes(){ // Childless versions of 'nodes' used to parameterise <tile>s
 			return this.nodes.map(n => {
@@ -37,10 +37,11 @@ export default defineComponent({
 				// For child layout
 				display: 'flex',
 				flexDirection: this.vert ? 'column' : 'row',
+				alignItems: 'center',
 				gap: this.lytOpts.tileSpacing + 'px',
 				padding: this.lytOpts.tileSpacing + 'px',
-				overflowX: this.vert ? 'hidden' : 'scroll',
-				overflowY: this.vert ? 'scroll' : 'hidden',
+				overflowX: this.vert ? 'hidden' : 'auto',
+				overflowY: this.vert ? 'auto' : 'hidden',
 				// Other
 				backgroundColor: this.uiOpts.ancestryBarBgColor,
 				boxShadow: this.uiOpts.shadowNormal,
@@ -50,7 +51,7 @@ export default defineComponent({
 	watch: {
 		// Used to scroll to end of bar upon node/screen changes
 		nodes(){
-			setTimeout(() => this.scrollToEnd(), 0); // Without timeout, seems to run before new tiles are added
+			this.$nextTick(() => this.scrollToEnd()); // Without timeout, seems to run before new tiles are added
 		},
 		vert(){
 			setTimeout(() => this.scrollToEnd(), 0);
-- 
cgit v1.2.3

