button.css 1.0 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
  1. /*
  2. * Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md.
  4. */
  5. @import "../../helpers/colors.css";
  6. /**
  7. * Implements a button of given background color.
  8. *
  9. * @param {String} $background - Background color of the button.
  10. * @param {String} $border - Border color of the button.
  11. */
  12. @define-mixin ck-button-colors $background, $border {
  13. background: $background;
  14. border-color: $border;
  15. &:not(.ck-disabled) {
  16. &:hover,
  17. &:focus {
  18. background: color($background shade(10%));
  19. border-color: color($border shade(10%));
  20. }
  21. &:active {
  22. background: color($background shade(15%));
  23. border-color: color($border shade(15%));
  24. box-shadow: inset 0 2px 2px color($background shade(25%));
  25. }
  26. }
  27. /* https://github.com/ckeditor/ckeditor5-theme-lark/issues/98 */
  28. &.ck-disabled {
  29. background: color($background shade(10%));
  30. border-color: color($border tint(10%));
  31. }
  32. }
  33. /**
  34. * A helper to define button–specific icon styles.
  35. *
  36. */
  37. @define-mixin ck-button-icon {
  38. & .ck-icon {
  39. @mixin-content;
  40. }
  41. }