From 76c4719c02235101b03609d9cd0d7137d5fb4aa8 Mon Sep 17 00:00:00 2001
From: TcardLab <tcardlab@gmail.com>
Date: Wed, 6 Nov 2019 13:53:54 -0500
Subject: [PATCH] successful render

---
 components/VGitGraph.vue | 8 ++++++++
 1 file changed, 8 insertions(+)

diff --git a/components/VGitGraph.vue b/components/VGitGraph.vue
index f2b5ac4..3bc6bcc 100644
--- a/components/VGitGraph.vue
+++ b/components/VGitGraph.vue
@@ -7,6 +7,7 @@
         Transition group doesnt work as v-show=false yeilds x&y=0. 
         Thus, they appear from the top left corner of the screen.
       -->
+      <transition-group name="fade" tag="g">
       <g :id="'g-'+branchName" v-for="(items, branchName) in _$" :key="'path-'+branchName"
          v-show="branchName in $store.state.show">
         <Paths
@@ -14,6 +15,7 @@
           :items="items" :branchName="branchName"
         />
       </g>
+      </transition-group>
 
       <g :id="branchName+'-Links'" v-for="(items, branchName) in _$" :key="'link-'+branchName">
         <Links
@@ -83,4 +85,10 @@ export default {
 .transition-move {
   transition: all 1s;
 }
+.fade-enter-to, .fade-leave-active {
+  transition: opacity 0.5s ease-in-out;
+}
+.fade-enter, .fade-leave-to {
+  opacity: 0;
+}
 </style>
\ No newline at end of file