/* Copyright (c) Fortanix, Inc.
|* This Source Code Form is subject to the terms of the Mozilla Public License, v. 2.0. If a copy of
|* the MPL was not distributed with this file, You can obtain one at http://mozilla.org/MPL/2.0/. */

@use '../variables.scss' as vars;


@mixin font($family: vars.$font-family-body, $weight: vars.$font-weight-regular, $size: null) {
  font-family: $family;
  font-weight: $weight;
  @if $size {
    font-size: $size;
  }
}

@mixin text-layout {
  /* https://blog.logrocket.com/guide-css-word-wrap-overflow-wrap-word-break/ */
  /* https://stackoverflow.com/questions/12699800/smarter-word-break-in-css */
  overflow-wrap: break-word; // Prevent long words causing overflow
  text-wrap: pretty; // Favor better typography for text wrapping (e.g. prevent orphans)
  hyphens: auto;
}

@mixin text-one-line($include-padding: true) {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  
  @if $include-padding {
    // Add a little bit of padding to prevent parts of characters getting cut off in some browsers. For example,
    // try the letter "J" and view it in Safari, the bottom extender of the "J" overflows the text box and gets cut off.
    // UPDATE: disabled this for now, causes other issues (e.g. vertical misalignment)
    //padding-inline: 0.3ch;
  }
}
