@innovaccer/design-system/css/src/ai-components/button.module.css

React components library project for Innovaccer Design System

.AIButton {
  padding: var(--spacing-20) var(--spacing-30);
  border-radius: var(--border-radius-10);
  cursor: pointer;
  border: 0;
  font-family: var(--font-family);
  font-weight: var(--font-weight-normal);
  font-size: var(--font-size);
  line-height: var(--font-height-s);
  display: flex;
  align-items: center;
  color: var(--inverse);
  background: linear-gradient(109deg, #fdead8 10.28%, #fbdfd5 32.82%, #f9d1d5 63.38%, #fad9e7 96.05%);
}

.AIButton:hover {
  background: linear-gradient(116deg, #fbe1c9 14.17%, #f8c5c6 50.06%, #f9cbdc 85.01%);
}

.AIButton:active {
  background: linear-gradient(106deg, #fad1ae 20.06%, #f5aea9 44.48%, #f4a0ad 67.83%, #f6b3ce 86.55%);
}

.AIButton:disabled {
  cursor: not-allowed;
  opacity: var(--opacity-10);
  background: linear-gradient(109deg, #fdead8 10.28%, #fbdfd5 32.82%, #f9d1d5 63.38%, #fad9e7 96.05%);
}

.AIButton:focus {
  outline: var(--border-width-05) solid var(--primary-focus);
  outline-offset: var(--spacing-05);
}

/* Button Icon */

.AIButton-Icon {
  margin-right: var(--spacing-20);
}