react-jam-ui/components/Button/themes/default.styl

React JAM UI components

btn-default($params) {
  background: $params.default.bg;
  border: $params.default.border;
  color: $params.default.color;
  box-shadow: $params.default.shadow;
  text-shadow: $params.default.textShadow;
  border-radius: $params.default.radius;
  
  &:focus,
  &:hover {
    background: $params.hover.bg;
    border-radius: $params.hover.radius;
    border: $params.hover.border;
    color: $params.hover.color;
    box-shadow: $params.hover.shadow;
    text-shadow: $params.hover.textShadow;
  }
  &:active  {
    background: $params.active.bg;
    border-radius: $params.active.radius;
    border: $params.active.border;
    color: $params.active.color;
    box-shadow: $params.active.shadow;
    text-shadow: $params.active.textShadow;
  }

  &[disabled],
  &.disabled {
    &:hover,
    &:active  {
      background: $params.default.bg;
      border-radius: $params.default.radius;
      border-color: $params.default.border;
      border-radius: $params.default.radius;
      box-shadow: $params.default.shadow;
      text-shadow: $params.default.textShadow;
    }
  }

  for type, params in $sizes {
    if (type == 'default') {
      
    } else {
      &.{type} {
        & {
          border-radius: $params.default.radius * (params.height / $sizes.default.height);
        }
        &:hover {
          border-radius: $params.hover.radius * (params.height / $sizes.default.height);
        }
        &:active  {
          border-radius: $params.active.radius * (params.height / $sizes.default.height);
        }
      }
    }
  }  
}