src/wolnelektury/static/2022/styles/utils/bourbon/library/_ellipsis.scss

   1 @charset "UTF-8";
   2
   3 /// Truncates text and adds an ellipsis to represent overflow.
   4 ///
   5 /// @argument {number} $width [100%]
   6 ///   The `max-width` for the string to respect before being truncated.
   7 ///
   8 /// @argument {string} $display [inline-block]
   9 ///   Sets the display-value of the element.
  10 ///
  11 /// @example scss
  12 ///   .element {
  13 ///     @include ellipsis;
  14 ///   }
  15 ///
  16 ///   // CSS Output
  17 ///   .element {
  18 ///     display: inline-block;
  19 ///     max-width: 100%;
  20 ///     overflow: hidden;
  21 ///     text-overflow: ellipsis;
  22 ///     white-space: nowrap;
  23 ///     word-wrap: normal;
  24 ///   }
  25
  26 @mixin ellipsis(
  27   $width: 100%,
  28   $display: inline-block
  29 ) {
  30   display: $display;
  31   max-width: $width;
  32   overflow: hidden;
  33   text-overflow: ellipsis;
  34   white-space: nowrap;
  35   word-wrap: normal;
  36 }