https://conexus-group.com/assets/js/Home/home.js

1let hasContentLoaded = false;
2let servicesData;
3const MAX_CHARS = 150;
4
5function fillText() {
6  const textList = servicesData.text[0];
7
8  for (const key in textList) {
9    if (textList.hasOwnProperty(key)) {
10      const textValue = textList[key];
11      document.getElementById(key).textContent = textValue;
12    }
13  }
14}
15
16function createCard(service, index) {
17  const cardDiv = document.createElement('div');
18  cardDiv.innerHTML = `
19<div style="min-height: 200px" class="visible card shadow-lg border-0 d-none d-md-block h-100">
20  <img loading="lazy" src="${service.path}" class="card-img-top" alt="${
21    service.name
22  }" />
23  <div class="card-body">
24    <p style="font-size: 23px" class="card-title "><strong>${
25      service.name
26    }</strong></p>
27    <div class="card-text-container">
28      <p class="card-text ">${truncateText(service.message, index)}</p>
29    </div>
30  </div>
31
32  <div style="
33  background-image: url(${service.cover});
34  background-repeat: no-repeat;
35  background-size: cover;
36  color: white;
37" class="overlay">
38    <p style="font-size: 23px" class="card-title text-center"><strong>${
39      service.name
40    }</strong></p>
41    <p>${service.message}</p>
42  </div>
43</div>
44
45<div class="visible card p-4 border-0 shadow-lg col-md-12 col-lg-6 mb-4 d-block d-md-none" style="
46              background-image: url(${service.cover});
47              background-repeat: no-repeat;
48              background-size: cover;
49              color: white;
50            ">
51  <h1 class="bebas-font text-center">${service.name}</h1>
52  <p>${service.message}</p>
53</div>
54`;
55  return cardDiv;
56}
57
58function truncateText(text, index) {
59  if (text.length <= MAX_CHARS) {
60    return text;
61  } else {
62    return (
63      text.slice(0, MAX_CHARS) +
64      `... <button
65  style="color: #024959" class="border-0 bg-transparent btn-link btn-sm ">Leer más <i
66    class="fa-solid fa-hand-pointer"></i></button>`
67    );
68  }
69}
70
71
72
73document.addEventListener('DOMContentLoaded', function () {
74  if (hasContentLoaded) return;
75  hasContentLoaded = true;
76
77  const serviceCardsContainer = document.getElementById('serviceCards');
78  home_strings.servicios.forEach((service, index) => {
79    const card = createCard(service, index);
80    serviceCardsContainer.appendChild(card);
81  });
82
83  setTextClass(home_strings);
84});