last-icon.scss

l-i {
  --size: 1em;
  display: inline-flex;
  width: var(--size);
  height: var(--size);
  vertical-align: middle;
  contain: strict;
  justify-content: center;
  align-items: center;

  span,
  svg,
  i {
    pointer-events: none;
  }

  // This is needed for ⚠️ icon as it goes outside of the limits of the div
  // And it would be cut due to contain: strict usage
  span {
    font-size: 0.8em;
  }

  svg {
    display: block;
    width: 100%;
    height: 100%;
  }
  // When rendering font icons (eg: material, symbols...)
  i {
    font-size: var(--size) !important;
    color: currentColor;
  }
}
p,
button,
a,
span {
  l-i:not([size]) {
    vertical-align: -0.125em;
  }
}

// Optional features
@import "material-icons";
@import "material-symbols";
@import "icon-park";
@import "animations";
@import "transformations";