You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

69 lines
1.5 KiB

8 months ago
  1. // scss-docs-start caret-mixins
  2. @mixin caret-down($width: $caret-width) {
  3. border-top: $width solid;
  4. border-right: $width solid transparent;
  5. border-bottom: 0;
  6. border-left: $width solid transparent;
  7. }
  8. @mixin caret-up($width: $caret-width) {
  9. border-top: 0;
  10. border-right: $width solid transparent;
  11. border-bottom: $width solid;
  12. border-left: $width solid transparent;
  13. }
  14. @mixin caret-end($width: $caret-width) {
  15. border-top: $width solid transparent;
  16. border-right: 0;
  17. border-bottom: $width solid transparent;
  18. border-left: $width solid;
  19. }
  20. @mixin caret-start($width: $caret-width) {
  21. border-top: $width solid transparent;
  22. border-right: $width solid;
  23. border-bottom: $width solid transparent;
  24. }
  25. @mixin caret(
  26. $direction: down,
  27. $width: $caret-width,
  28. $spacing: $caret-spacing,
  29. $vertical-align: $caret-vertical-align
  30. ) {
  31. @if $enable-caret {
  32. &::after {
  33. display: inline-block;
  34. margin-left: $spacing;
  35. vertical-align: $vertical-align;
  36. content: "";
  37. @if $direction == down {
  38. @include caret-down($width);
  39. } @else if $direction == up {
  40. @include caret-up($width);
  41. } @else if $direction == end {
  42. @include caret-end($width);
  43. }
  44. }
  45. @if $direction == start {
  46. &::after {
  47. display: none;
  48. }
  49. &::before {
  50. display: inline-block;
  51. margin-right: $spacing;
  52. vertical-align: $vertical-align;
  53. content: "";
  54. @include caret-start($width);
  55. }
  56. }
  57. &:empty::after {
  58. margin-left: 0;
  59. }
  60. }
  61. }
  62. // scss-docs-end caret-mixins