Form control: required

Created by: richware

I did not see anywhere that the 'required' attribute was handled, therefore I have created the following SASS: [this includes suggestions by WinterSilence]

.form-control,
.form-select,
.form-range
  &:required
    @include auto-duo-gradient($form-required-bg,5%)
    .disabled&,
    [disabled]& 
        ...

Where the auto-duo-gradient mixin is:

@mixin auto-duo-gradient($color,$adj-amount:18%,$important:true)
  $imp: null
  @if($important)
    $imp: !important
  $color-top: $color
  $color-bottom: $color // darkest color at the bottom
  @if(color.lightness($color) >= (100% - $adj-amount)) // color too light - reverse colors
    $color-bottom: darken($color,$adj-amount)
  @else
    $color-top: lighten($color,$adj-amount)
  background: linear-gradient($color-top,$color-bottom) $imp
  color: color-contrast($color-bottom) $imp

Regards, Rich