templates/themes/ismart/base.html.twig line 1

Open in your IDE?
  1. <!doctype html>
  2. <html lang="{{ app.request.locale }}">
  3. <head>
  4.     <meta charset="utf-8"/>
  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
  6.     <meta name="viewport" content="width=device-width,initial-scale=1"/>
  7.     <meta name="author" content=""/>
  8.     <link rel="icon" type="image/png" href="{{ asset('themes/ismart') }}/img/favicon.png"/>
  9.     <link rel="apple-touch-icon" href="{{ asset('themes/ismart') }}/img/favicon.png"/>
  11.     {{ include('themes/ismart/part/social.html.twig') }}
  13.     <link rel="stylesheet" href="{{ asset('themes/ismart') }}/css/style.min.css">
  14.     <link rel="stylesheet" href="{{ asset('themes/ismart') }}/css/homepage.css?v=1.0">
  16.     {#    TODO: font, icon #}
  17.     {% if not isMobile() %}
  18.         <link rel="stylesheet" href="{{ asset('themes/ismart') }}/css/homepage-desktop.css?v=1.0" media="(min-width: 992px)">
  19.         <link rel="preconnect" href="https://fonts.googleapis.com"/>
  20.         <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin/>
  21.         <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@500;600;700;800;900&display=swap" rel="stylesheet" />
  22.         <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/material-design-iconic-font/2.2.0/css/material-design-iconic-font.min.css"/>
  24.         {% set googleTagManagerId = getSettingValueByKey('google-tag-manager-id') %}
  26.         <script>(function (w, d, s, l, i) {
  27.                 w[l] = w[l] || [];
  28.                 w[l].push({
  29.                     'gtm.start':
  30.                         new Date().getTime(), event: 'gtm.js'
  31.                 });
  32.                 var f = d.getElementsByTagName(s)[0],
  33.                     j = d.createElement(s), dl = l != 'dataLayer' ? '&l=' + l : '';
  34.                 j.async = true;
  35.                 j.src =
  36.                     'https://www.googletagmanager.com/gtm.js?id=' + i + dl;
  37.                 f.parentNode.insertBefore(j, f);
  38.             })(window, document, 'script', 'dataLayer', '{{ googleTagManagerId }}');</script>
  40.         <script>if (!window.HTMLPictureElement) {
  41.                 document.createElement('picture');
  42.             }</script>
  44.     {% else %}
  45.         <link rel="stylesheet" href="{{ asset('themes/ismart') }}/css/homepage-mobile.css?v=1.0" media="(max-width: 991px)">
  46.     {% endif %}
  50.     {% block customStyle %}{% endblock %}
  51. </head>
  52. <body>
  53. {% set textScripting = getSettingValueByKey('script-setting') %}
  54. {{ textScripting | raw }}
  56. {# TODO:fb script#}
  57. {% if not isMobile() %}
  58.      <div id="fb-root"></div>
  59.      <script async defer crossorigin="anonymous" src="https://connect.facebook.net/vi_VN/sdk.js#xfbml=1&version=v17.0&appId=308313886501712&autoLogAppEvents=1" nonce="4ijSUNkO"></script>
  60. {% endif %}
  62. {% block header %}
  63.     {{ include('themes/ismart/part/header.html.twig') }}
  64. {% endblock %}
  66. {% block body %}
  68. {% endblock %}
  70. <div class="modal fade success" id="success" tabindex="-1" aria-labelledby="success" aria-hidden="true" data-bs-backdrop="static" data-bs-keyboard="false">
  71.     <div class="modal-dialog modal-dialog-centered modal-md">
  72.         <div class="modal-content">
  73.             <div class="modal-body">
  74.                 <p class="text-center">Xin chúc mừng <bạn></bạn> đã đăng ký thành công!<strong>iSMART</strong>sẽ nhanh chóng liên hệ trong vòng 24h tới và gửi đến bạn những ưu đãi hấp dẫn. Xin cảm ơn!</p>
  75.                 <img loading="lazy" class="icon" srcset="{{ asset('themes/ismart') }}/img/mascot-ic-2.webp" src="{{ asset('themes/ismart') }}/img/mascot-ic-2_small.webp" alt="">
  76.             </div>
  77.             <div class="modal-footer">
  78.                 <a class="button red" data-bs-dismiss="modal"><span>Đóng</span></a>
  79.             </div>
  80.         </div>
  81.     </div>
  82. </div>
  84. {% block floating %}
  85. <div class="floating">
  86.     <a id="scrollTop" class="icon top d-none">
  87.         <img loading="lazy"
  88.              srcset="{{ asset('themes/ismart') }}/img/top.webp"
  89.              src="{{ asset('themes/ismart') }}/img/top_small.webp" alt=""/></a>
  90.     {% set hotline = getSettingValueByKey('hotline') %}
  91.     <div class="list"><a class="icon call" href="tel:{{ hotline | replace({" ":""}) }}">
  92.             
  93.                 <img
  94.                     data-src="{{ asset('themes/ismart') }}/img/call.webp"
  95.                     src="{{ asset('themes/ismart') }}/img/call_small.webp"
  96.                     alt=""/>
  98.             <span>HOTLINE</span> </a><a class="icon form">
  99.                 <img loading="lazy"
  100.                      data-src="{{ asset('themes/ismart') }}/img/form.webp"
  101.                      src="{{ asset('themes/ismart') }}/img/form_small.webp"
  102.                      alt=""/>
  103.             <span>ĐĂNG KÝ<br/>TƯ VẤN</span></a>
  104.     </div>
  105. </div>
  106. {% set messenger = getSettingValueByKey('facebook-messenger') %}
  108. {%  if not isMobile() %}
  109.     <div class="floating-mascot">
  110.         <a href="{{ messenger }}" target="_blank">
  111.             <picture id="transparencyImg">
  112.                 <source type="image/webp" srcset="{{ asset('themes/ismart') }}/img/mascot-ic_thumb.webp" media="(min-width:992px)">
  113.                 <source type="image/gif" srcset="{{ asset('themes/ismart') }}/img/mascot-2.gif" media="(min-width:992px)">
  114.                 <img loading="lazy" src="{{ asset('themes/ismart') }}/img/mascot-2.gif" alt=""/>
  115.             </picture>
  116.         </a>
  117.     </div>
  119.     </picture>
  120.         </a>
  121.     </div>
  123.     <script>
  124.         var mascotRendered = false;
  125.         document.addEventListener("DOMContentLoaded", function() {
  127.             function renderMascot() {
  128.                 var video = document.createElement('video');
  129.                 video.className = 'd-none';
  130.                 video.id = 'transparencyVideo';
  131.                 video.loop = true;
  132.                 video.muted = true;
  133.                 video.autoplay = true;
  134.                 video.playsInline = true;
  135.                 video.poster = "{{ asset('themes/ismart') }}/img/mascot-ic_thumb.webp";
  137.                 if (!mascotRendered && window.scrollY > 0) {
  138.                     var source = document.createElement('source');
  139.                     source.src = "{{ asset('themes/ismart') }}/img/mascot-2.webm";
  140.                     source.type = 'video/webm';
  141.                     source.media = '(min-width:992px)';
  143.                     video.appendChild(source);
  144.                     document.querySelector('.floating-mascot a').appendChild(video);
  145.                     mascotRendered = true;
  147.                     // Ensure the video plays automatically
  148.                     video.classList.remove('d-none');
  149.                     video.play().catch(function(error) {
  150.                         console.error('Error playing video:', error);
  151.                     });
  152.                 }
  154.             }
  156.             window.addEventListener('scroll', renderMascot);
  158.         });
  159.     </script>
  160. {% endif %}
  162. <div class="overlay hide">
  163.     <div class="spinner-border text-warning" role="status"><span class="visually-hidden">Loading...</span></div>
  164. </div>
  165. <div class="floating-form"><a class="close"><i class="zmdi zmdi-close-circle"></i></a>
  166.     {{ include('themes/ismart/part/contact-form.html.twig') }}
  167. </div>
  168. {% endblock %}
  169. {% block footer %}
  170. {{ include('themes/ismart/part/footer.html.twig') }}
  171. {% endblock %}
  173. <script src="{{ asset('themes/ismart') }}/js/jquery.min.js" defer></script>
  174. <script src="{{ asset('themes/ismart') }}/js/parsley.min.js" defer></script>
  175. <script src="{{ asset('themes/ismart') }}/js/homepage.min.js?v=1.0" defer></script>
  177. {% if not isMobile() %}
  178.     <link rel="stylesheet" href="{{ asset('themes/ismart') }}/vendors/normalize-css/normalize.min.css" defer/>
  179.     {{ include('themes/ismart/part/script-desktop.html.twig') }}
  180. {% else %}
  181.     <div class="modal-backdrop fade"></div>
  182.     {{ include('themes/ismart/part/script-mobile.html.twig') }}
  183. {% endif %}
  185. <script src="{{ asset('plugins/jQueryForm/jquery.form.min.js') }}" defer></script>
  187. </body>
  188. </html>