Scss Text Truncate Mixin

text-truncate-mixin.scss

/// Truncate
/// Sets the maximum number of rows the element will have
/// If the maximum line is exceeded, cut off the excess lines.
/// puts "..." at the end of the last line
/// @param {number} $max-line [2] - max line of paragraph
/// @example scss - truncate mixin
/// .text {
/// 	@include truncate(2);
/// }
@mixin truncate($max-line: 2) {
	display: -webkit-box;
	-webkit-line-clamp: $max-line;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-overflow: ellipsis;
}

Also, if the text you cut has a padding value, replace it with a margin or remove it.