Button.scss 2.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980
  1. $enable-inverted-alt-button: dynamic(true);
  2. $button-background-color: dynamic(transparent);
  3. $button-border-color: dynamic(null);
  4. $button-border-width: dynamic(null);
  5. $button-border-style: dynamic(null);
  6. $button-border-radius: dynamic(7px);
  7. $button-color: dynamic($base-color);
  8. $button-pressed-color: dynamic($base-light-color);
  9. $button-disabled-color: dynamic($neutral-dark-color);
  10. $button-font-weight: dynamic($font-weight-normal);
  11. $button-line-height: dynamic(16px);
  12. $button-line-height-big: dynamic(20px);
  13. $button-padding: dynamic(3px 0);
  14. $button-padding-big: dynamic(5px 0);
  15. $button-icon-color: dynamic($button-color);
  16. $button-pressed-icon-color: dynamic($button-pressed-color);
  17. $button-arrow-icon: dynamic($ios-arrow-down);
  18. $button-badge-font-size: dynamic(13px);
  19. $button-badge-background-color: dynamic(#fe0000);
  20. $button-badge-border-radius: dynamic(50%);
  21. $button-badge-min-width: dynamic(null);
  22. $button-badge-top: dynamic(-5px);
  23. $button-badge-left: dynamic(53%);
  24. $button-badge-right: dynamic(null);
  25. $button-badge-padding: dynamic(1px 6px);
  26. $button-focused-outline-color: dynamic(null);
  27. $button-focused-outline-style: dynamic(null);
  28. $button-focused-outline-width: dynamic(null);
  29. $button-focused-outline-offset: dynamic(null);
  30. $button-confirm-ui: dynamic((
  31. color: $ios-green,
  32. pressed-color: mix(#fff, $ios-green, 70%)
  33. ));
  34. $button-alt-ui: dynamic((
  35. color: #fff,
  36. background-color: $ios-blue,
  37. pressed-background-color: $button-pressed-color,
  38. padding: 3px 10px,
  39. padding-big: 5px 15px
  40. ));
  41. $button-decline-ui: dynamic((
  42. color: $ios-red,
  43. pressed-color: mix(#fff, $ios-red, 70%)
  44. ));
  45. $button-segmented-ui: dynamic((
  46. color: $base-color,
  47. border-color: $base-color,
  48. hovered-border-color: $base-color,
  49. background-color: $background-color,
  50. hovered-background-color: $background-color,
  51. pressed-background-color: $base-color,
  52. pressed-color: #fff,
  53. border-radius: 4px,
  54. padding: 3px 10px,
  55. padding-big: 5px 15px
  56. ));
  57. $button-action-ui: dynamic((
  58. font-weight: $font-weight-bold
  59. ));
  60. $button-raised-ui: dynamic((
  61. color: $base-color,
  62. background-color: $background-color,
  63. hovered-background-color: $background-color,
  64. pressed-background-color: $base-color,
  65. pressed-color: #fff,
  66. padding: 3px 10px,
  67. padding-big: 5px 15px,
  68. box-shadow: (2px 2px 5px 0 rgba(0, 0, 0, 0.12), 2px 2px 5px 0 rgba(0, 0, 0, 0.08))
  69. ));