@import '../../base.less';

@import './_var.less';

.@{prefix}-swipe-cell {
  position: relative;
  overflow: hidden;

  &__left,
  &__right {
    position: absolute;
    top: 0;
    height: 100%;
  }

  &__left {
    left: 0;
    transform: translate3d(-100%, 0, 0);
    display: flex;
    flex-flow: row-reverse;
  }

  &__right {
    right: 0;
    transform: translate3d(100%, 0, 0);
    display: flex;
  }

  &__content {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    padding: 0 @spacer-2;
  }

  &__icon {
    font-size: @font-size-xl;
  }

  &__icon + &__text:not(:empty) {
    margin-left: @spacer;
    font: @font-body-medium;
  }
}