https://phprussia.ru/js/components/cards/card-person.js

1// Cut Bio-Text off (hover case only)
2$(".card-person__bio").each(function() {
3  var bioHeight = $(this).css({"max-height":"none"}).height();
4  var cardheadHeight = $(this).closest(".card-person__content").find(".card-person__content-head").outerHeight();
5  var cardHeight = $(this).closest(".card-person__media-inner").height();
6
7  if (bioHeight >= (cardHeight - cardheadHeight - 30)) {
8    var fullText = $(this).text();
9    var lastIndex = fullText.substring(0, 140).lastIndexOf(" ");
10    var text = fullText.substring(0, lastIndex);    
11    var hiddenText = fullText.slice(lastIndex);
12    hiddenText = "&nbsp;<span class='hidden-text'>" + hiddenText + "</span>";
13    fullText = text + hiddenText + "<span class='card-person__btn-more' data-expand-card>...</span>";
14    $(this).html(fullText);
15  }
16});
17
18// Collapse Cards by click aside
19$(document).mouseup(function (e) {
20  var div = $(".card-person.is-active");
21  if (!div.is(e.target)
22      && div.has(e.target).length === 0) {
23    // hide
24    $(".card-person").each(function() {
25      $(this).removeClass("is-active");
26    });
27  }
28});
29
30// Expand "Card-person"
31$('[data-expand-card]').click(function() {
32  // define "is-active" card
33  $(this)
34    .closest(".card-person").addClass("is-active")
35    .siblings().removeClass("is-active");
36  // define "last-in-row" card
37  var winWidth = $(window).width();
38  var elWidth = $(this).closest(".card-person__media-inner").outerWidth();
39  var offsetLeft = $(this).closest(".card-person__media-inner").offset().left;
40  if (winWidth < (elWidth + offsetLeft)) {
41    $(this)
42      .closest(".card-person").addClass("last-in-row")
43      .siblings().removeClass("last-in-row");
44  }
45  // console.log(winWidth);
46  // console.log(elWidth+offsetLeft);
47});
48
49// Collapse "Card-person"
50$('[data-collapse-card]').click(function() {
51  $(this)
52    .closest(".card-person").removeClass("is-active");
53});