403Webshell
Server IP : 172.67.191.97  /  Your IP : 104.23.243.197
Web Server : Apache/2.4.63 (Ubuntu)
System : Linux adminpruebas-Virtual-Machine 6.14.0-37-generic #37-Ubuntu SMP PREEMPT_DYNAMIC Fri Nov 14 22:10:32 UTC 2025 x86_64
User : www-data ( 33)
PHP Version : 8.4.5
Disable Function : NONE
MySQL : OFF  |  cURL : ON  |  WGET : ON  |  Perl : ON  |  Python : OFF  |  Sudo : ON  |  Pkexec : ON
Directory :  /var/www/idiomas/media/idiomas/faq/

Upload File :
current_dir [ Writeable ] document_root [ Writeable ]

 

Command :

[ Back ]     

Current File : /var/www/idiomas/media/idiomas/faq/faq.js
(function () {
  const apps = document.querySelectorAll('[data-faq-app]');
  const pageImage = '/plantillajoomla5.3/images/idiomas/sede/frente-sin-cables-publicidad.png';

  if (!apps.length) {
    return;
  }

  const escapeHtml = (value) => String(value || '')
    .replace(/&/g, '&')
    .replace(/</g, '&lt;')
    .replace(/>/g, '&gt;')
    .replace(/"/g, '&quot;')
    .replace(/'/g, '&#039;');

  const iconFor = (index) => ['fa-question-circle', 'fa-comments', 'fa-file-text-o'][index] || 'fa-info-circle';

  const subtitleFor = (title) => {
    if (/clave/i.test(title)) return 'Respuestas rápidas para iniciar el proceso';
    if (/cursos/i.test(title)) return 'Horarios, modalidades, materiales y programas';
    return 'Certificados, trámites y servicios de apoyo';
  };

  const renderCategory = (category, categoryIndex) => {
    const safeId = `faq-${categoryIndex}`;
    const reversed = categoryIndex % 2 === 1 ? ' is-reversed' : '';
    const focusClass = categoryIndex === 1 ? ' is-upper' : (categoryIndex === 2 ? ' is-lower' : '');

    const items = (category.items || []).map((item, itemIndex) => {
      const itemId = `${safeId}-${itemIndex}`;
      const isOpen = categoryIndex === 0 && itemIndex === 0;

      return `
        <article class="idioma-faq-2026__item${isOpen ? ' is-open' : ''}">
          <button class="idioma-faq-2026__question" type="button" aria-expanded="${isOpen ? 'true' : 'false'}" aria-controls="${itemId}">
            <span>${escapeHtml(item.question)}</span>
            <i class="fa fa-angle-down" aria-hidden="true"></i>
          </button>
          <div class="idioma-faq-2026__answer" id="${itemId}">
            <div class="idioma-faq-2026__answer-inner">
              <p>${escapeHtml(item.answer)}</p>
            </div>
          </div>
        </article>`;
    }).join('');

    return `
      <section class="idioma-faq-2026__section${reversed}" aria-labelledby="${safeId}-title">
        <aside class="idioma-faq-2026__visual${focusClass}" aria-label="Centro de Idiomas Universidad de los Llanos">
          <figure class="idioma-faq-2026__photo">
            <img src="${pageImage}" alt="Frente del Centro de Idiomas Universidad de los Llanos" loading="lazy">
          </figure>
          <div class="idioma-faq-2026__visual-card">
            <span>${String((category.items || []).length).padStart(2, '0')}</span>
            <strong>${escapeHtml(category.title)}</strong>
            <small>${escapeHtml(subtitleFor(category.title))}</small>
          </div>
        </aside>
        <div class="idioma-faq-2026__panel">
          <div class="idioma-faq-2026__heading">
            <span><i class="fa ${iconFor(categoryIndex)}" aria-hidden="true"></i></span>
            <div>
              <h2 id="${safeId}-title">${escapeHtml(category.title)}</h2>
              <p>${escapeHtml(subtitleFor(category.title))}</p>
            </div>
          </div>
          <div class="idioma-faq-2026__list">
            ${items}
          </div>
        </div>
      </section>`;
  };

  const setAnswerHeight = (item) => {
    const answer = item.querySelector('.idioma-faq-2026__answer');
    const inner = answer.querySelector('.idioma-faq-2026__answer-inner');
    answer.style.maxHeight = item.classList.contains('is-open') ? `${inner.scrollHeight}px` : '0px';
  };

  const bindAccordion = (app) => {
    const items = [...app.querySelectorAll('.idioma-faq-2026__item')];

    items.forEach((item) => {
      const button = item.querySelector('.idioma-faq-2026__question');
      setAnswerHeight(item);

      button.addEventListener('click', () => {
        const open = item.classList.contains('is-open');

        item.classList.toggle('is-open', !open);
        button.setAttribute('aria-expanded', String(!open));
        setAnswerHeight(item);
      });
    });

    window.addEventListener('resize', () => {
      items.forEach(setAnswerHeight);
    }, { passive: true });
  };

  const bindReveal = (app) => {
    const elements = app.querySelectorAll('.idioma-faq-2026__section, .idioma-faq-2026__hero-copy, .idioma-faq-2026__hero-media');

    window.requestAnimationFrame(() => {
      elements.forEach((element, index) => {
        element.style.transitionDelay = `${Math.min(index * 70, 420)}ms`;
        element.classList.add('is-visible');
      });
    });
  };

  const render = (app, data) => {
    const categories = data.categories || [];
    const total = Number(data.total || categories.reduce((sum, category) => sum + (category.items || []).length, 0));

    app.innerHTML = `
      <style>
        .com-content-article.item-page .page-header,
        .com-content-article.item-page .article-info,
        .com-content-article.item-page figure.item-image{display:none!important}
        #g-container-main,
        #g-container-main .g-container,
        #g-mainbar .g-content,
        .platform-content.container,
        .platform-content .row,
        .platform-content .col{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}
        .com-content-article.item-page .com-content-article__body{width:100%!important;max-width:none!important;margin:0!important}
        .idioma-faq-2026{--faq-red:#ed1c24;--faq-ink:#28205c;--faq-blue:#1769aa;--faq-muted:#667085;--faq-line:#e7eaf0;--faq-soft:#f5f7fb;--faq-shadow:0 18px 50px rgba(23,31,58,.12);background:linear-gradient(180deg,#f7f8fb 0,#fff 28rem);color:#24283d;overflow:hidden}
        .idioma-faq-2026 *{box-sizing:border-box}
        .idioma-faq-2026__hero{width:min(1180px,calc(100% - 2rem));margin:clamp(2rem,5vw,4rem) auto clamp(1rem,2.2vw,1.65rem);display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,460px);gap:clamp(1.3rem,4vw,3.2rem);align-items:center}
        .idioma-faq-2026__hero-copy{opacity:0;transform:translateY(22px);transition:opacity .65s ease,transform .65s ease}
        .idioma-faq-2026__hero-copy.is-visible{opacity:1;transform:translateY(0)}
        .idioma-faq-2026__eyebrow{display:inline-flex;align-items:center;gap:.5rem;color:var(--faq-red);font-weight:900;text-transform:uppercase;font-size:.78rem;letter-spacing:0;margin-bottom:.8rem}
        .idioma-faq-2026__hero h1{max-width:760px;margin:0;color:var(--faq-ink);font-size:clamp(2.4rem,5vw,4.5rem);line-height:.98;letter-spacing:0}
        .idioma-faq-2026__hero p{max-width:670px;margin:1rem 0 0;color:#4b5565;font-size:clamp(1rem,1.55vw,1.22rem);line-height:1.65}
        .idioma-faq-2026__hero-actions{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.35rem}
        .idioma-faq-2026__pill{display:inline-flex;align-items:center;gap:.55rem;border:1px solid var(--faq-line);border-radius:999px;background:#fff;color:var(--faq-ink);padding:.7rem 1rem;font-weight:900;box-shadow:0 10px 28px rgba(26,36,70,.08);transition:transform .25s ease,box-shadow .25s ease}
        .idioma-faq-2026__pill:hover{transform:translateY(-2px);box-shadow:0 16px 38px rgba(26,36,70,.13)}
        .idioma-faq-2026__hero-media{position:relative;opacity:0;transform:translateX(26px);transition:opacity .7s ease .12s,transform .7s ease .12s}
        .idioma-faq-2026__hero-media.is-visible{opacity:1;transform:translateX(0)}
        .idioma-faq-2026__hero-media::before{content:"";position:absolute;inset:1rem -1rem -1rem 1rem;border-radius:8px;background:linear-gradient(135deg,rgba(237,28,36,.18),rgba(23,105,170,.16));z-index:0}
        .idioma-faq-2026__hero-media img{position:relative;z-index:1;display:block;width:100%;height:330px;object-fit:cover;object-position:center bottom;border-radius:8px;box-shadow:var(--faq-shadow);transition:transform .5s ease,filter .5s ease}
        .idioma-faq-2026__hero-media:hover img{transform:translateY(-4px) scale(1.015);filter:saturate(1.05)}
        .idioma-faq-2026__content{width:min(1180px,calc(100% - 2rem));margin:0 auto clamp(3rem,7vw,5.5rem)}
        .idioma-faq-2026__section{display:grid;grid-template-columns:minmax(280px,410px) minmax(0,1fr);gap:clamp(1.1rem,3vw,2.2rem);align-items:stretch;margin-top:clamp(1.2rem,3vw,2.2rem);opacity:0;transform:translateY(30px);transition:opacity .68s ease,transform .68s ease}
        .idioma-faq-2026__section.is-visible{opacity:1;transform:translateY(0)}
        .idioma-faq-2026__section.is-reversed{grid-template-columns:minmax(0,1fr) minmax(280px,410px)}
        .idioma-faq-2026__section.is-reversed .idioma-faq-2026__visual{order:2}
        .idioma-faq-2026__section.is-reversed .idioma-faq-2026__panel{order:1}
        .idioma-faq-2026__visual{position:relative;align-self:stretch;min-height:100%;border-radius:8px;overflow:hidden;background:#fff;box-shadow:var(--faq-shadow);isolation:isolate}
        .idioma-faq-2026__visual::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(40,32,92,.03),rgba(40,32,92,.84));z-index:1;pointer-events:none}
        .idioma-faq-2026__visual::after{content:"";position:absolute;inset:auto -28% -12% 18%;height:42%;min-height:260px;background:radial-gradient(circle,rgba(237,28,36,.42),rgba(237,28,36,0) 68%);z-index:2;pointer-events:none;transition:transform .7s ease}
        .idioma-faq-2026__photo{position:absolute;inset:0;margin:0}
        .idioma-faq-2026__photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center bottom;transition:transform .7s ease,filter .7s ease}
        .idioma-faq-2026__visual.is-upper .idioma-faq-2026__photo img{object-position:center 42%}
        .idioma-faq-2026__visual.is-lower .idioma-faq-2026__photo img{object-position:center 74%}
        .idioma-faq-2026__section:hover .idioma-faq-2026__photo img{transform:scale(1.045);filter:saturate(1.08)}
        .idioma-faq-2026__section:hover .idioma-faq-2026__visual::after{transform:translateY(-18px)}
        .idioma-faq-2026__visual-card{position:sticky;top:calc(100vh - 190px);left:1rem;right:1rem;z-index:3;width:calc(100% - 2rem);margin:clamp(360px,58vh,620px) 1rem 1rem;padding:1rem;border:1px solid rgba(255,255,255,.25);border-radius:8px;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);box-shadow:0 18px 38px rgba(0,0,0,.16);transform:translateY(0);transition:transform .35s ease}
        .idioma-faq-2026__section:hover .idioma-faq-2026__visual-card{transform:translateY(-4px)}
        .idioma-faq-2026__visual-card span{display:inline-grid;place-items:center;width:42px;height:42px;margin-bottom:.75rem;border-radius:8px;background:var(--faq-red);color:#fff;font-weight:900}
        .idioma-faq-2026__visual-card strong{display:block;color:var(--faq-ink);font-size:1.05rem;line-height:1.15}
        .idioma-faq-2026__visual-card small{display:block;margin-top:.35rem;color:var(--faq-muted);font-weight:700;line-height:1.35}
        .idioma-faq-2026__panel{min-width:0}
        .idioma-faq-2026__heading{display:flex;align-items:center;gap:1rem;margin-bottom:1rem;padding:1.1rem 1.2rem;border:1px solid var(--faq-line);border-radius:8px;background:rgba(255,255,255,.92);box-shadow:0 14px 34px rgba(27,38,72,.07)}
        .idioma-faq-2026__heading span{display:grid;place-items:center;flex:0 0 46px;width:46px;height:46px;border-radius:8px;background:var(--faq-red);color:#fff;font-size:1.12rem;box-shadow:0 12px 24px rgba(237,28,36,.2)}
        .idioma-faq-2026__heading h2{margin:0;color:var(--faq-ink);font-size:clamp(1.45rem,2.8vw,2.25rem);line-height:1.08;letter-spacing:0}
        .idioma-faq-2026__heading p{margin:.3rem 0 0;color:var(--faq-muted);font-weight:700;line-height:1.4}
        .idioma-faq-2026__list{display:grid;gap:.72rem}
        .idioma-faq-2026__item{border:1px solid var(--faq-line);border-radius:8px;background:#fff;box-shadow:0 9px 22px rgba(18,28,58,.055);overflow:hidden;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}
        .idioma-faq-2026__item:hover{transform:translateY(-2px);border-color:rgba(237,28,36,.28);box-shadow:0 16px 34px rgba(18,28,58,.11)}
        .idioma-faq-2026__item.is-open{border-color:rgba(237,28,36,.34)}
        .idioma-faq-2026__question{width:100%;display:grid;grid-template-columns:minmax(0,1fr) 32px;align-items:center;gap:1rem;border:0;background:#fff;color:var(--faq-ink);padding:.92rem 1rem;text-align:left;font:inherit;font-weight:900;cursor:pointer}
        .idioma-faq-2026__question span{min-width:0;overflow-wrap:anywhere}
        .idioma-faq-2026__question i{display:grid;place-items:center;width:32px;height:32px;border-radius:999px;background:var(--faq-soft);color:var(--faq-red);transition:transform .3s ease,background .3s ease,color .3s ease}
        .idioma-faq-2026__item.is-open .idioma-faq-2026__question i{transform:rotate(180deg);background:var(--faq-red);color:#fff}
        .idioma-faq-2026__answer{max-height:0;overflow:hidden;border-top:0 solid transparent;background:linear-gradient(180deg,#fbfcff,#fff);transition:max-height .34s ease,border-color .34s ease}
        .idioma-faq-2026__item.is-open .idioma-faq-2026__answer{border-top:1px solid var(--faq-line)}
        .idioma-faq-2026__answer-inner{padding:0 1rem 1rem}
        .idioma-faq-2026__answer p{max-width:880px;margin:0;color:#475064;line-height:1.68}
        .idioma-faq-2026__empty{width:min(760px,calc(100% - 2rem));margin:2rem auto;padding:1.25rem;border:1px solid var(--faq-line);border-radius:8px;background:#fff;color:var(--faq-ink)}
        @media (max-width:900px){.idioma-faq-2026__hero,.idioma-faq-2026__section,.idioma-faq-2026__section.is-reversed{grid-template-columns:1fr}.idioma-faq-2026__section.is-reversed .idioma-faq-2026__visual,.idioma-faq-2026__section.is-reversed .idioma-faq-2026__panel{order:initial}.idioma-faq-2026__visual{position:relative;top:auto;min-height:0}.idioma-faq-2026__visual::before{background:linear-gradient(180deg,rgba(40,32,92,0),rgba(40,32,92,.22))}.idioma-faq-2026__visual-card{display:none}.idioma-faq-2026__photo{position:relative}.idioma-faq-2026__photo img{height:235px}.idioma-faq-2026__hero-media{max-width:560px}.idioma-faq-2026__hero-media img{height:270px}}
        @media (max-width:560px){.idioma-faq-2026__hero{width:min(100% - 1rem,1180px);margin-top:1.4rem}.idioma-faq-2026__content{width:min(100% - 1rem,1180px)}.idioma-faq-2026__hero h1{font-size:clamp(2.1rem,12vw,3rem)}.idioma-faq-2026__hero-media img{height:215px}.idioma-faq-2026__photo img{height:205px}.idioma-faq-2026__heading{align-items:flex-start}.idioma-faq-2026__question{padding:.86rem .85rem;font-size:.95rem}.idioma-faq-2026__pill{width:100%;justify-content:center;border-radius:8px}}
        @media (prefers-reduced-motion:reduce){.idioma-faq-2026 *{transition:none!important;animation:none!important}.idioma-faq-2026__hero-copy,.idioma-faq-2026__hero-media,.idioma-faq-2026__section{opacity:1!important;transform:none!important}}
      </style>
      <header class="idioma-faq-2026__hero">
        <div class="idioma-faq-2026__hero-copy">
          <span class="idioma-faq-2026__eyebrow"><i class="fa fa-life-ring" aria-hidden="true"></i> Soporte académico y administrativo</span>
          <h1>Preguntas Frecuentes</h1>
          <p>Encuentra respuestas claras sobre inscripciones, cursos, horarios, certificados y servicios del Centro de Idiomas de la Universidad de los Llanos.</p>
          <div class="idioma-faq-2026__hero-actions" aria-label="Resumen de preguntas frecuentes">
            <span class="idioma-faq-2026__pill"><i class="fa fa-list-ul" aria-hidden="true"></i> ${total} preguntas</span>
            <span class="idioma-faq-2026__pill"><i class="fa fa-th-large" aria-hidden="true"></i> ${categories.length} secciones</span>
          </div>
        </div>
        <figure class="idioma-faq-2026__hero-media">
          <img src="${pageImage}" alt="Fachada del Centro de Idiomas Universidad de los Llanos">
        </figure>
      </header>
      <main class="idioma-faq-2026__content">
        ${categories.map(renderCategory).join('')}
      </main>`;

    bindAccordion(app);
    bindReveal(app);
  };

  apps.forEach((app) => {
    const feed = app.getAttribute('data-feed');

    fetch(feed, { credentials: 'same-origin' })
      .then((response) => {
        if (!response.ok) throw new Error(`HTTP ${response.status}`);
        return response.json();
      })
      .then((data) => render(app, data))
      .catch(() => {
        app.innerHTML = '<div class="idioma-faq-2026__empty">No fue posible cargar las preguntas frecuentes desde la base de datos.</div>';
      });
  });
}());

Youez - 2016 - github.com/yon3zu
LinuXploit