[Summary view] [Print] [Text view]

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