boennemann/zentodone

View on GitHub
app/styles/animations/taskcell.less

Summary

Maintainability
Test Coverage
.task-cell-animation {
  &.ng-enter {
    .transition(200ms ease-in all);
    height: 0;
    .opacity(0);
  }

  &.ng-enter-stagger {
    .transition-delay(200ms)
  }

  &.ng-enter-active {
    height: 66px;
    .opacity(1);
  }

  &.ng-leave {
    .transition(200ms ease-out all 30ms);
    height: 66px;
    .opacity(1);
  }

  &.ng-leave-active {
    height: 0;
    .opacity(0);
  }
}

.task-cell-inner-back {
  &.task-cell-inner-back-add {
    .transition(200ms cubic-bezier(0.50, 0.000, 0.50, 1.50) all);
  }
  &.task-cell-inner-back-add-active {
    .transform(~'translateX(0) !important');
  }
}

.task-cell-inner-right {
  .transform(~'translateX(120%) !important');
  &.task-cell-inner-right-add {
    .transition(200ms ease-out all);
  }

  &.task-cell-inner-right-add-active {
    .transform(~'translateX(120%) !important');
  }
}

.task-cell-inner-left {
  .transform(~'translateX(-120%) !important');
  &.task-cell-inner-left-add {
    .transition(200ms ease-out all);
  }

  &.task-cell-inner-left-add-active {
    .transform(~'translateX(-120%) !important');
  }
}