@import 'variables';

.actions {
  position: absolute;
  right: 5px;
  top: 0px;

  .btn-small {
    border-radius: 0;
    font-size: 12px;
    padding: .25rem .5rem;
  }
}

.actions-container {
  position: relative;
}

.actions-container-fade {
  @extend .actions-container;

  .actions {
    opacity: 0;
    transition: .5s ease;

    &.shown {
      opacity: 1;
    }

    @media (min-width: $BREAK_SM) {
      &:hover, &:focus {
        opacity: 1;
      }
    }

    @media (max-width: $BREAK_SM) {
      opacity: 1;
    }
  }
}


@import 'variables';

.actions {
  position: absolute;
  right: 5px;
  top: 0px;

  .btn-small {
    border-radius: 0;
    font-size: 12px;
    padding: .25rem .5rem;
  }
}

.actions-container {
  position: relative;
}

.actions-container-fade {
  @extend .actions-container;

  .actions {
    opacity: 0;
    transition: .5s ease;

    &.shown {
      opacity: 1;
    }

    @media (max-width: $BREAK_SM) {
      opacity: 1;
    }
  }

  @media (min-width: $BREAK_SM) {
    &:hover, &:focus {
      .actions {
        opacity: 1;
      }
    }
  }
}

Make Actions Appear When Hover Over Parent Container
Make Actions Appear When Hover Over Parent Container
