@import '../style/index.scss';

.#{$kara-prefix}-btn {
  height: 108px;
  text-align: center;
  border-radius: 8px;
  outline: none;
  border: transparent;
  font-size: 40px;
  cursor: pointer;

  // 幽灵类型按钮样式
  &-ghost.#{$kara-prefix}-btn {
    &-info {
      border: 1px solid $primary;
      color: $primary;
      background-color: transparent;
    }

    &-success {
      border: 1px solid $success;
      color: $success;
      background-color: transparent;
    }

    &-danger {
      border: 1px solid $danger;
      color: $danger;
      background-color: transparent;
    }
  }

  // 常规按钮设定
  &-info {
    background-color: $primary;
    color: #fff;
  }

  &-success {
    background-color: $success;
    color: #fff;
  }

  &-danger {
    background-color: $danger;
    color: #fff;
  }

  // 按钮大小设置
  &-sm {
    width: 120px;
  }

  &-default {
    width: 200px;
  }

  &-lg {
    width: 280px;
  }

  &-full-width {
    width: 100%;
  }

  // 高度设置
  &-db-height {
    height: 150px;
  }
}