templates/base_site/site/v3/modules/index-language-cart.html.twig line 1

Open in your IDE?
  1. <div class="container mb-5">
  2.     <div class="row g-4 p-3 align-items-center" id="responsible">
  3.         <div class="customize p-5 d-flex flex-column flex-lg-row g-4 align-items-center">
  4.             <div class="col-lg-6">
  5.                 <h2 class="fw-bold mb-3 inner-sec-title">
  6.                     دیگه لازم نیست بلد باشی با برنامه نویس صحبت کنی
  7.                 </h2>
  8.                 <p class="text-muted mb-4">
  9.                     با «پوشه»، بدون نیاز به دانش فنی، فروشگاه اینترنتی خودت رو راه‌اندازی کن. ما زیرساختی
  10.                     پایدار، طراحی حرفه‌ای و امکانات پیشرفته رو در اختیار تو می‌ذاریم تا بتونی روی فروش تمرکز کنی
  11.                     و به رشد واقعی برسی.
  12.                 </p>
  13.                 {% set featuresLilList = [
  14.                     'سادگی و سرعت راه‌اندازی',
  15.                     'انعطاف‌پذیری بالا',
  16.                     'هزینه مقرون‌به‌صرفه',
  17.                     'امنیت و پشتیبانی مداوم',
  18.                     'ابزارهای تحلیل و SEO',
  19.                     'انتقال و توسعه آسان',
  20.                     'سازگاری با موبایل',
  21.                 ] %}
  22.                 <ul class="list-unstyled text-muted m-0 p-0">
  23.                     {% for item in featuresLilList %}
  24.                         <li class="d-flex align-items-center mb-2 gap-2">
  25.                             <span class="text-success">
  26.                                 <svg stroke="#333" fill="none" stroke-width="2" viewBox="0 0 24 24"
  27.                                      stroke-linecap="round" stroke-linejoin="round" class="text-xl" height="1em"
  28.                                      width="1em" xmlns="http://www.w3.org/2000/svg">
  29.                                     <path d="M12 12m-9 0a9 9 0 1 0 18 0a9 9 0 1 0 -18 0"></path>
  30.                                     <path d="M9 12l2 2l4 -4"></path>
  31.                                 </svg>
  32.                             </span>
  33.                             {{ item }}
  34.                         </li>
  35.                     {% endfor %}
  36.                 </ul>
  37.             </div>
  38.             <div class="col-lg-6 text-center">
  39. {#                <div class="mobile-wrapper">#}
  40.                     <div class="matrix-box w-100">
  41.                         <canvas class="matrix-canvas"></canvas>
  42.                     </div>
  43. {#                </div>#}
  44.             </div>
  45.         </div>
  46.     </div>
  47. </div>
  48. {% block footer %}
  49.     <script>
  50.         function initMatrix(containerSelector){
  51.             const container = document.querySelector(containerSelector);
  52.             const canvas = container.querySelector('canvas');
  53.             const ctx = canvas.getContext('2d');
  54.             function resize(){
  55.                 canvas.width = container.clientWidth;
  56.                 canvas.height = container.clientHeight;
  57.             }
  58.             resize();
  59.             window.addEventListener('resize', resize);
  60.             const glyphs = 'アイウエオカキクケコサシスセソ0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ';
  61.             const chars = glyphs.split('');
  62.             let fontSize = 10;
  63.             let columns = Math.floor(canvas.width / fontSize);
  64.             let drops = Array(columns).fill(0);
  65.             function draw(){
  66.                 ctx.fillStyle = 'rgba(0,0,0,0.05)';
  67.                 ctx.fillRect(0, 0, canvas.width, canvas.height);
  68.                 ctx.fillStyle = '#0f0';
  69.                 ctx.font = fontSize + 'px monospace';
  70.                 for(let i=0; i<columns; i++){
  71.                     const text = chars[Math.floor(Math.random() * chars.length)];
  72.                     const x = i * fontSize;
  73.                     const y = drops[i] * fontSize;
  74.                     ctx.fillText(text, x, y);
  75.                     if(y > canvas.height && Math.random() > 0.975){
  76.                         drops[i] = 0;
  77.                     } else {
  78.                         drops[i]++;
  79.                     }
  80.                 }
  81.                 requestAnimationFrame(draw);
  82.             }
  83.             draw();
  84.         }
  85.         // اینجا آی‌دی یا کلاس div رو بده
  86.         initMatrix('.matrix-box');
  87.     </script>
  88. {% endblock %}