1 files changed, 25 insertions, 32 deletions
diff --git a/FrontEnd/src/app/views/home/home.sass b/FrontEnd/src/app/views/home/home.sass
index 4b86f241..56049994 100644
--- a/FrontEnd/src/app/views/home/home.sass
+++ b/FrontEnd/src/app/views/home/home.sass
@@ -1,36 +1,29 @@
-.timeline-board
-  @extend .cru-card
-  @extend .d-flex
-  @extend .flex-column
-  @extend .py-3
-  min-height: 200px
-  height: 100%
-  position: relative
-
-.timeline-board-header
-  @extend .px-3
+.home-v2-timeline-list-item
   display: flex
   align-items: center
-  justify-content: space-between
 
-.timeline-board-item
-  font-size: 1.1em
-  @extend .px-3
-  height: 48px
-  transition: background 0.3s
-  display: flex
-  align-items: center
-  .icon
-    height: 1.3em
-    color: black
-    @extend .mr-2
+.home-v2-timeline-list-item-timeline
+  transition: background 0.8s
+  animation: 0.8s home-v2-timeline-list-item-timeline-enter
   &:hover
-    background: $gray-300
-  .right
-    display: flex
-    align-items: center
-    flex-shrink: 0
-  .title
-    white-space: nowrap
-    overflow: hidden
-    text-overflow: ellipsis
+    background: $gray-200
+
+@keyframes home-v2-timeline-list-item-timeline-enter
+  from
+    transform: translate(-100%,0)
+    opacity: 0
+
+.home-v2-timeline-list-item-line
+  width: 80px
+  flex-shrink: 0
+
+@keyframes home-v2-timeline-list-loading-head-animation
+  from
+    transform: translate(0,-30px)
+    opacity: 1
+
+  to
+    opacity: 0
+
+.home-v2-timeline-list-loading-head
+  animation: 1s infinite home-v2-timeline-list-loading-head-animation