/// Hides an element's content
/// @output
///   CSS definitions to off-set and hide the content of the element
/// @example scss
///   @use '@pixelherz/sassbox';
///
///   .logotype {
///     // The text "Company Name" will be set off-element
///     // in favor of the background image
///     @include sassbox.offset-text();
///     background-image: url('logotype.svg');
///   }
/// @since 1.0.0
/// @group misc

@mixin offset-text() {
  text-indent: -119988px;
  overflow: hidden;
  text-align: left;
  text-transform: capitalize;
}

/// Forces text to be rendered on a single line (prevent line-break). If the
/// text exceeds the element width, it is truncated using ellipsis (…).
/// @output
///   CSS definitions to prevent line-break and hide/truncate overflow.
/// @example scss
///   @use '@pixelherz/sassbox';
///
///   .single-line {
///     @include sassbox.truncate-text();
///   }
/// @since 1.1.0
/// @group misc

@mixin truncate-text() {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}