_forms.scss 1.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849
  1. legend{
  2. margin-bottom: 1.5rem;
  3. border-bottom: 1px solid #cdcdcd;
  4. padding-bottom: .5rem;
  5. color: $legend-color;
  6. }
  7. // Color contrast
  8. @function color-yiq-const($color) {
  9. $r: red($color);
  10. $g: green($color);
  11. $b: blue($color);
  12. $yiq: (($r * 299) + ($g * 587) + ($b * 114)) / 1000;
  13. @if ($yiq >= 200) {
  14. @return #666666;
  15. } @else {
  16. @return #FFFFFF;
  17. }
  18. }
  19. .btn{
  20. @each $color, $value in $theme-colors-custom{
  21. &.btn-#{$color}{
  22. background-color: $value;
  23. border-color: darken($value, 10%);
  24. color: color-yiq-const($value);
  25. &:hover{
  26. background-color: darken($value, 10%);
  27. border-color: darken($value,15%) ;
  28. color: color-yiq-const($value);
  29. }
  30. }
  31. }
  32. @each $color, $value in $theme-colors-custom{
  33. &.btn-outline-#{$color}{
  34. font-size: 12px;
  35. background-color: $white;
  36. border-color: darken($value, 20%);
  37. color: darken($value,30%);
  38. &:hover{
  39. background-color: darken($value, 10%);
  40. border-color: darken($value,15%) ;
  41. color: color-yiq-const($value);
  42. }
  43. }
  44. }
  45. }