olivesnews/js/readmore.js

(function (Drupal) {
  'use strict';

  Drupal.behaviors.readMore = {
    attach: function (context, settings) {

      function initReadMore({
        selector = '.truncate-me',
        lines = 3,
        moreText = 'Read more',
        lessText = 'Read less'
      } = {}) {

        once('readMore', selector, context).forEach(el => {
          el.classList.add('read-more-box');
          el.style.setProperty('--clamp-lines', lines);

          const isTruncated = el.scrollHeight > el.clientHeight;
          if (!isTruncated) return;

          const btn = document.createElement('button');
          btn.className = 'read-more-btn';
          btn.textContent = moreText;

          btn.addEventListener('click', () => {
            const expanded = el.classList.toggle('expanded');
            btn.textContent = expanded ? lessText : moreText;
          });

          el.insertAdjacentElement('afterend', btn);
        });
      }

      initReadMore({
        selector: '.tl-text-content p',
        //selector: '.readmore',
        lines: 8,
      });

    }
  };

}(Drupal));