buttons.less 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. //
  2. // Forum Buttons
  3. // --------------------------------------------------
  4. .misago-button-flavour(@btn-color, @btn-bg, @btn-border) {
  5. background: @btn-bg;
  6. border-color: @btn-bg;
  7. box-shadow: 0px 2px 0px @btn-border;
  8. color: @btn-color;
  9. &:hover {
  10. background: darken(@btn-bg, 10%);
  11. border-color: darken(@btn-bg, 10%);
  12. box-shadow: 0px 2px 0px darken(@btn-border, 10%);
  13. color: @btn-color;
  14. }
  15. &.active, &:active, &:focus {
  16. background: darken(@btn-bg, 15%);
  17. border-color: darken(@btn-bg, 15%);
  18. box-shadow: none;
  19. outline: none;
  20. position: relative;
  21. top: 2px;
  22. color: darken(@btn-color, 10%);
  23. }
  24. .glyphicon-chevron-down {
  25. position: relative;
  26. top: 2px;
  27. font-size: @font-size-small;
  28. }
  29. }
  30. .btn {
  31. &.btn-default {
  32. .misago-button-flavour(@btn-default-color, @btn-default-bg, @btn-default-border);
  33. }
  34. &.btn-primary {
  35. .misago-button-flavour(@btn-primary-color, @btn-primary-bg, @btn-primary-border);
  36. }
  37. &.btn-info {
  38. .misago-button-flavour(@btn-info-color, @btn-info-bg, @btn-info-border);
  39. }
  40. &.btn-success {
  41. .misago-button-flavour(@btn-success-color, @btn-success-bg, @btn-success-border);
  42. }
  43. &.btn-warning {
  44. .misago-button-flavour(@btn-warning-color, @btn-warning-bg, @btn-warning-border);
  45. }
  46. &.btn-danger {
  47. .misago-button-flavour(@btn-danger-color, @btn-danger-bg, @btn-danger-border);
  48. }
  49. }