rubysg/rubysg-reboot

View on GitHub
app/assets/stylesheets/button.scss

Summary

Maintainability
Test Coverage
.btn {
  transition: all 0.2s linear;

  &:hover {
    transform: translateY(3px);
  }
}

.btn-custom {
  --bs-btn-font-weight: #{$font-weight-normal};
  --bs-btn-color: #{$theme-white};
  --bs-btn-bg: #{$theme-gray};
  --bs-btn-border-color: transparent;
  --bs-btn-border-radius: 2rem;
  --bs-btn-hover-color: #{$theme-white};
  --bs-btn-hover-bg: #{$theme-gray};
  --bs-btn-hover-border-color: transparent;
  --bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);
  --bs-btn-active-color: var(--bs-btn-hover-color);
  --bs-btn-active-bg: #{shade-color($theme-gray, 20%)};
  --bs-btn-active-border-color: #{shade-color($theme-gray, 20%)};

  &.btn-custom-success {
    --bs-btn-hover-bg: #{$brand-success};
  }
}