icynet-admin/components/common/Button/Button.module.scss

.button {
  appearance: none;
  padding: 0.5rem 1.5rem;
  border-radius: 4px;
  transition: background linear 0.33s;

  &:not([disabled]) {
    cursor: pointer;
  }

  &.default {
    border: 1px solid #b9b9b9;
    background: linear-gradient(
      180deg,
      rgb(246 246 246) 0%,
      rgb(241 241 241) 100%
    );

    &:not([disabled]) {
      &:hover,
      &:focus-visible {
        background: linear-gradient(
          180deg,
          rgb(255 255 255) 0%,
          rgb(250 250 250) 100%
        );
      }

      &:active {
        background: linear-gradient(
          180deg,
          rgb(241 241 241) 0%,
          rgb(246 246 246) 100%
        );
      }
    }
  }
  &.primary {
    border: 1px solid #00aaff;
    background: linear-gradient(
      180deg,
      rgb(133 216 255) 0%,
      rgba(59, 190, 255, 1) 100%
    );

    &:not([disabled]) {
      &:hover,
      &:focus-visible {
        background: linear-gradient(
          180deg,
          rgb(145 220 255) 0%,
          rgb(84 198 255) 100%
        );
      }

      &:active {
        background: linear-gradient(
          180deg,
          rgb(77, 196, 255) 0%,
          rgb(124, 213, 255) 100%
        );
      }
    }
  }
  &.link {
    border: 0;
    background: transparent;
    color: #0090d8;

    &:not([disabled]) {
      &:hover,
      &:focus-visible {
        text-decoration: underline;
      }
    }
  }
}