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