1 files changed, 22 insertions, 27 deletions
diff --git a/app/assets/stylesheets/pages/todos.scss b/app/assets/stylesheets/pages/todos.scss
index 5f0aede4f5e..a39815319f3 100644
--- a/app/assets/stylesheets/pages/todos.scss
+++ b/app/assets/stylesheets/pages/todos.scss
@@ -3,25 +3,6 @@
  *
  */
 
-.navbar-nav {
-  li {
-    .badge.todos-pending-count {
-      position: inherit;
-      top: -6px;
-      margin-top: -5px;
-      font-weight: normal;
-      background: $todo-alert-blue;
-      margin-left: -17px;
-      font-size: 11px;
-      color: $white-light;
-      padding: 3px;
-      padding-top: 1px;
-      padding-bottom: 1px;
-      border-radius: 3px;
-    }
-  }
-}
-
 .todos-list > .todo {
   // workaround because we cannot use border-colapse
   border-top: 1px solid transparent;
@@ -47,6 +28,7 @@
 
   .todo-avatar,
   .todo-actions {
+    @include transition(opacity);
     -webkit-flex: 0 0 auto;
     flex: 0 0 auto;
   }
@@ -67,21 +49,34 @@
     flex: 0 1 100%;
     min-width: 0;
   }
-}
 
-.todos-list > .todo.todo-pending.done-reversible {
-  background-color: $gray-light;
+  &.todo-pending.done-reversible {
+    background-color: $white-light;
 
-  &:hover {
-    border-color: $border-color;
-  }
+    &:hover {
+      border-color: $white-dark;
+      background-color: $gray-light;
 
-  .title {
-    font-weight: normal;
+      .todo-avatar,
+      .todo-item {
+        opacity: .6;
+      }
+    }
+
+    .todo-avatar,
+    .todo-item {
+      opacity: .2;
+    }
+
+    .btn {
+      background-color: $gray-light;
+    }
   }
 }
 
 .todo-item {
+  @include transition(opacity);
+
   .todo-title {
     display: flex;