jekyll-theme-marketing 0.4.0 → 0.5.0

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: 2eca1c61d528aac7269ec959477733071d8ec008
-  data.tar.gz: 9a3a26e1f5cd01e40231106fa65e20acabaca79b
+  metadata.gz: c1822c98d84877b6b24a176a0be3f1f4f8e4b34c
+  data.tar.gz: 989d2e4a702116e825a07c741a6fd7139da64c19
 SHA512:
-  metadata.gz: 0e33e73c096587fd130a4af20556e0eb29247d419e0e6ec01ac8d089d883a7568d4f56d0e8b575079fe45a32fbfa0c0e5cf1e6b457457ecf79f79f822c5477b9
-  data.tar.gz: 3eacecc8e3545a963e0c3b51683f0ff9f7742c702094129e7a2a85f27a2fbb076d1e8f11f0b3893f711bcc37ebb996d93969aafb9ce5a0192354fbd91f635345
+  metadata.gz: e2afd4ae7c8707ac8bb250007ebb48b50ec5d74245f32fc92f854fd33910549c0d6761b9d844d170146c45333b58d850e14aee0a14a62f0f2621103ba171e653
+  data.tar.gz: 9b32a61a8527e8afa457099f587dbf68c189c6f3afb98dbee05831dabdddd9e5b0f2624b64d0d8924db3e4735314a6fac2f3d9194267f62ea7daa8192ffa645f

data/_includes/body/footer/buttons.html

@@ -0,0 +1,40 @@
+{% if site.original -%}
+  {% assign classes = "col-sm-1 col-md-1" %}
+{% else -%}
+  {% assign classes = "col-sm-6 col-md-6" %}
+{% endif -%}
+
+<div class="col-xs-12 {{ classes }}">
+  <a href="#" class="up">
+    <span class="glyphicon glyphicon-arrow-up"></span>
+  </a>
+
+  <a href="javascript:switchLang()" class="lang-switcher">
+    <span class="flag-icon flag-icon-squared" id="lang-switcher"></span>
+  </a>
+
+  <script type="text/javascript">
+    if (!window.location.href.includes('grupopv')) {
+      document.querySelector('.lang-switcher').classList.add('hide');
+    }
+
+    currentLang = document.getElementsByTagName("html")[0].getAttribute("lang");
+
+    if (currentLang == 'en') {
+      document.querySelector('#lang-switcher').classList.add('flag-icon-mx');
+    } else {
+      document.querySelector('#lang-switcher').classList.add('flag-icon-us');
+    }
+
+    function switchLang(){
+      if (currentLang == 'en') {
+        url = window.location.href.replace('localhost:4000','grupopv.mx').replace('grupopv.us','grupopv.mx');
+        window.location.href = url;
+      } else {
+        url = window.location.href.replace('localhost:4000','grupopv.us').replace('grupopv.mx','grupopv.us');
+        window.location.href = url;
+      }
+    }
+  </script>
+
+</div>

data/_includes/body/header/exchange-rates/usd.html

@@ -0,0 +1,40 @@
+<span class="glyphicon glyphicon-globe"></span>
+<span id="sell-usd-exchange-rates"></span>
+<span class="glyphicon glyphicon-info-sign hidden-xs"></span>
+<span id="updated-at-usd-exchange-rates" class="hidden-xs"></span>
+
+<script>
+  function capitalize(string) {
+    return string.charAt(0).toUpperCase() + string.slice(1);
+  }
+
+  function monthName(date, locale, type){
+    name = date.toLocaleString(locale, { month: type });
+    return capitalize(name);
+  }
+
+  function parseDate(date){
+    return  date.getDate() + " / " +
+            monthName(date, 'es-MX', "short") + " / " +
+            date.getFullYear() + " " +
+            ((date.getHours()%12)?(date.getHours()%12):12) + ":" +
+            (date.getMinutes()<10?'0':'') + date.getMinutes() +
+            (date.getHours()>=12?' PM':' AM');
+  }
+
+  getRealtimeExchangeRates = function() {
+    const docRef = firestoredb.doc("exchange-rates/usd");
+    const usdSell = document.querySelector("#sell-usd-exchange-rates");
+    const usdUpdatedAt = document.querySelector("#updated-at-usd-exchange-rates");
+
+    docRef.onSnapshot(function (doc){
+      if (doc && doc.exists) {
+        const data = doc.data();
+        usdSell.innerText = "USD: " + data.sell.toFixed(2);
+        usdUpdatedAt.innerText = parseDate(new Date(data.updated_at));
+      }
+    });
+  }
+
+  getRealtimeExchangeRates();
+</script>

data/_includes/body/header/logo.html

@@ -0,0 +1,5 @@
+<div class="logo">
+  <a href="/">
+    <img src="/img/common/logos/{{ site.domain | replace:'.',' ' | truncatewords: 1,"" }}.png" alt="{{ site.title }}" class="logo-img" data-last-deploy="{{ site.time }}"/>
+  </a>
+</div>

data/_includes/body/header/search-contact-phone-buttons.html

@@ -0,0 +1,29 @@
+<div class="header-icons">
+
+  <div class="hide search-header hidden-600"> <!-- start search button -->
+    <a href="#">
+      <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve">
+        <path d="M12.001,10l-0.5,0.5l-0.79-0.79c0.806-1.021,1.29-2.308,1.29-3.71c0-3.313-2.687-6-6-6C2.687,0,0,2.687,0,6
+        s2.687,6,6,6c1.402,0,2.688-0.484,3.71-1.29l0.79,0.79l-0.5,0.5l4,4l2-2L12.001,10z M6,10c-2.206,0-4-1.794-4-4s1.794-4,4-4
+        s4,1.794,4,4S8.206,10,6,10z"></path>
+        <image href="/vendors/themes/vg_progressive/images/png-icons/search-icon.png" alt="" width="16" height="16" style="vertical-align: top;">
+      </svg>
+    </a>
+  </div> <!-- end search button -->
+
+  <div class="contact-header hidden-600"> <!-- start contact button -->
+    <a href="/contact/">
+      <span class="glyphicon glyphicon-envelope"></span>
+    </a>
+  </div> <!-- end contact button -->
+
+  <div class="phone-header hidden-600"> <!-- start phone button -->
+    <a href="#">
+      <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="16px" height="16px" viewBox="0 0 16 16" enable-background="new 0 0 16 16" xml:space="preserve">
+        <path fill="black" id="svg_5" d="m5.20621,2.17825c0,0 -0.5632,1.04887 -1.73453,1.17131c0,0 -1.00806,-0.08163 -1.7345,0.80807c0,0 -0.76727,1.17131 -0.24081,2.13857c0,0 3.6731,7.42781 4.11795,7.79103c0,0 0.92645,1.97939 3.02826,0.92644c0,0 0.72647,-1.08969 2.13858,-1.41209c0,0 0.32242,-0.19998 0.92642,0.24078l3.06906,2.38344c0,0 0.73056,0.60402 0.73056,1.25293c0,0 -0.44894,1.69371 -0.73056,1.65289c0,0 -3.14661,2.05693 -4.72195,1.85695c0,0 -6.33813,0.72646 -11.70493,-11.54576c0,0 -1.85696,-6.78297 -0.96725,-9.97041c0,0 1.04889,-3.18742 5.93408,-3.18742c0,0 1.28967,0 1.77533,1.00806l0.11429,4.88522z"/>
+        <image href="/vendors/themes/vg_progressive/images/png-icons/phone-icon.png" alt="" width="16" height="16" style="vertical-align: top;">
+      </svg>
+    </a>
+  </div> <!-- end phone button -->
+
+</div>

data/_includes/body/header/top-bar.html

@@ -0,0 +1,20 @@
+<div id="top-box">
+  <div class="container">
+    <div class="custom">
+      <div id="exchange-rates">
+        {% if site.exchange-rates.usd %} {% include body/header/exchange-rates/usd.html %} {% endif %}
+      </div>
+      <div id="sign-in">
+        <span id="sign-in-welcome" class="hidden-xs"></span>
+        <strong id="sign-in-name"></strong>
+        <a id="login-button" class="btn btn-xs btn-warning hide" href="/login/?mode=select&signInSuccessUrl={{ page.url }}">{{ site.data.i18n.common.firebase[site.lang].login.title }}</a>
+        <button id="logout-button" class="btn btn-xs btn-warning hide">{{ site.data.i18n.common.firebase[site.lang].logout.title }}</button>
+      </div>
+    </div>
+    <script>
+      jQuery(document).ready(function(){
+        jQuery("body").addClass("hidden-top");
+      });
+    </script>
+  </div>
+</div>

data/_includes/body/product-cards/3d-space.html

@@ -1,8 +1,8 @@
 <div id="make-3D-space-{{ include.id }}" class="make-3D-space">
     <div id="product-card-{{ include.id }}" class="product-card" data-id="{{ include.id }}">
         <div id="product-front-{{ include.id }}" class="product-front">
-        	<div class="shadow"></div>
-            <img src="{{ include.img }}" alt="{{ include.model }}" />
+            <div class="shadow"></div>
+            <img src="{{ include.img }}" alt="{{ include.model }}" class="img-center"/>
             <a {{ include.href }}><div class="image_overlay"></div></a>
             <div id="view_details-{{ include.id }}" class="view_details hide" data-id="{{ include.id }}">View details</div>
             <div class="stats">
@@ -10,11 +10,11 @@
                 <div class="stats-container">
                   <span class="product_price">{{ include.price }} {{ include.currency }}</span>
                   <span class="product_name">{{ include.commercial }}</span>
-                  <p>{{ include.desc }}</p>
+                  <p class="product_description">{{ include.desc }}</p>
                   <div class="product-options">
-                    <strong>MODEL</strong>
+                    <strong>{{ site.data.i18n.common.product-cards[site.lang].3d-space.model.title | default: 'Model' }}</strong>
                     <span>{{ include.model }}</span>
-                    <strong>BRAND</strong>
+                    <strong>{{ site.data.i18n.common.product-cards[site.lang].3d-space.brand.title | default: 'Brand' }}</strong>
                     <span>{{ include.brand }}</span>
                   </div>
                 </div>
@@ -25,9 +25,9 @@
 	        <div class="shadow"></div>
             <div id="carousel-{{ include.id }}" class="carousel">
                 <ul>
-                    <li><img src="{{ include.img | replace: '.png', '_02.png' }}" alt="{{ include.model }}" /></li>
-                    <li><img src="{{ include.img | replace: '.png', '_03.png' }}" alt="{{ include.model }}" /></li>
-                    <li><img src="{{ include.img | replace: '.png', '_04.png' }}" alt="{{ include.model }}" /></li>
+                    <li class="marketing-theme content-centered"><img src="{{ include.img | replace: '.png', '_02.png' }}" alt="{{ include.model }}" /></li>
+                    <li class="marketing-theme content-centered"><img src="{{ include.img | replace: '.png', '_03.png' }}" alt="{{ include.model }}" /></li>
+                    <li class="marketing-theme content-centered"><img src="{{ include.img | replace: '.png', '_04.png' }}" alt="{{ include.model }}" /></li>
                 </ul>
                 <div class="arrows-perspective">
                     <div class="carouselPrev" data-id="{{ include.id }}">

data/_includes/body/scripts.html

@@ -0,0 +1,41 @@
+<div id="javascript">
+  <!-- 3D Space product card -->
+  <script src="/assets/js/product-cards/3d-space.js"></script>
+
+  <script src="/assets/node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/price-regulator/jshashtable-2.1_src.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/price-regulator/jquery.numberformatter-1.2.3.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/price-regulator/tmpl.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/price-regulator/jquery.dependClass-0.1.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/price-regulator/draggable-0.1.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/price-regulator/jquery.slider.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/jquery.carouFredSel-6.2.1-packed.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/jquery.touchSwipe.min.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/jquery.elevateZoom-3.0.8.min.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/jquery.imagesloaded.min.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/jquery.appear.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/jquery.sparkline.min.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/jquery.easypiechart.min.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/jquery.easing.1.3.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/jquery.fancybox.pack.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/isotope.pkgd.min.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/jquery.knob.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/jquery.stellar.min.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/jquery.selectBox.min.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/jquery.tubular.1.0.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/SmoothScroll.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/country.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/spin.min.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/ladda.min.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/masonry.pkgd.min.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/morris.min.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/raphael.min.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/video.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/pixastic.custom.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/livicons-1.3.min.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/bootstrapValidator.min.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/bootstrap-datepicker.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/jplayer/jquery.jplayer.min.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/jplayer/jplayer.playlist.min.js"></script>
+  <script src="/vendors/themes/vg_progressive/js/main.js"></script>
+</div>

data/_includes/components/sidenavs/material/controller.js

@@ -0,0 +1,44 @@
+<script>
+  // Define constants
+  let menuIcon = document.querySelector('#menu')
+
+  // Define functions for animation
+  function openSideNav() { document.querySelector('.side-nav').style.transform = 'translateX(0)'; }
+  function closeSideNav() { document.querySelector('.side-nav').style.transform = 'translateX(-370px)'; }
+
+  function deactivateAllMenuItem() {
+    let list = document.querySelectorAll('nav.side-bar li')
+    for (let i = 0; i < list.length; i++) {
+      list[i].classList.remove('active');
+    }
+  }
+
+  function activateMenuItem(source) {
+    deactivateAllMenuItem();
+    source.classList.add('active');
+  }
+
+  // Define listeners for animation
+  window.addEventListener('resize', closeSideNav)
+  menuIcon.addEventListener('click', openSideNav)
+  window.addEventListener('click', (e) => {
+    if(e.target != menuIcon) {
+       closeSideNav()
+    }
+  })
+
+  // Vuejs controller function
+  function setSidenavHeaderData(user) {
+    let photoURL = 'https://www.gravatar.com/avatar/' + md5(user.email) + '?s=70&d=identicon';
+    new Vue({
+      delimiters: ['{(', ')}'],
+      el: '#appVue',
+      data: {
+        name: user.displayName,
+        email: user.email,
+        photo: photoURL,
+        uid: user.uid
+      }
+    })
+  }
+</script>

data/_includes/components/sidenavs/material/dependencies.html

@@ -0,0 +1,3 @@
+<script type="text/javascript" src="/assets/node_modules/vue/dist/vue.min.js"></script>
+<script type="text/javascript" src="/assets/node_modules/js-md5/build/md5.min.js"></script>
+<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">

data/_includes/components/sidenavs/material/sidenav.html

@@ -0,0 +1,31 @@
+<i class="material-icons" class="ripple" id="menu" title="Menu">menu</i>
+
+<section id="appVue">
+  <div class="side-nav">
+    <header>
+      <div class="avatars-container" width=70 height=70 >
+          <img :src="photo" width=70 height=70 />
+      </div>
+      <div class="rich-area">
+        <a href="#">{( name )}</a>
+        <div class="email">
+          <a href="">{( email )}</a>
+          <i class="material-icons" class="ripple">arrow_drop_down</i>
+        </div>
+      </div>
+    </header>
+    <nav class="side-bar">
+      <ul>
+        <li class="disabled"><i class="material-icons">person</i>Mi Perfil</li>
+        <li class="disabled"><i class="material-icons">description</i>Facturas</li>
+        <li class="disabled"><i class="material-icons">note</i>Notas de Crédito</li>
+        <li class="disabled"><i class="material-icons">account_balance_wallet</i>Estados de Cuenta</li>
+        <hr>
+        <li id='subheader'>Servicio</li>
+        <a href="https://docs.google.com/forms/d/e/1FAIpQLScqLZRLtB4CKlQPRdzz_b6EVY8JPLEXsOgyzmUsfWvfpaczEA/viewform"><li class="ripple" onclick="activateMenuItem(this)"><i class="material-icons">build</i>Reportes de Reparación</li></a>
+        <li class="disabled"><i class="material-icons">computer</i>Software de Programación</li>
+        <li class="disabled"><i class="material-icons">list_alt</i>Manuales de Servicio</li>
+      </ul>
+    </nav>
+  </div>
+</section>

data/_includes/head/firebase/sdk.html

@@ -0,0 +1,4 @@
+<script src="https://www.gstatic.com/firebasejs/4.11.0/firebase.js"></script>
+<script src="https://www.gstatic.com/firebasejs/4.11.0/firebase-firestore.js"></script>
+<script src="/js/firebase/firebase-sdk.js"></script>
+{% if site.original %}<script src="/assets/js/firebase/firebase-login.js"></script>{% endif %}

data/_includes/head/scripts.html

@@ -0,0 +1,9 @@
+<script src="/assets/node_modules/jquery/dist/cdn/jquery.min.js"></script>
+<script src="/dependencies/jquery/jquery-noconflict.js"></script>
+<script src="/dependencies/jquery/jcaption.js" type="text/javascript"></script>
+
+<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js?app=revolution_slider" type="text/javascript"></script>
+<script src="/vendors/sliders/revolution-slider/js/jquery.themepunch.tools.min.js" type="text/javascript"></script>
+<script src="/vendors/sliders/revolution-slider/js/jquery.themepunch.revolution.min.js" type="text/javascript"></script>
+
+<script src="/vendors/sliders/lightslider/js/lightslider.js"></script>

data/_includes/head/style.html

@@ -0,0 +1,50 @@
+<!-- Revolution slider CSS -->
+<link rel="stylesheet" href="/vendors/sliders/revolution-slider/css/settings.css" type="text/css" />
+<link rel="stylesheet" href="/vendors/sliders/revolution-slider/css/dynamic-captions.css" type="text/css" />
+<link rel="stylesheet" href="/vendors/sliders/revolution-slider/css/static-captions.css" type="text/css" />
+
+<!-- JQuery lightSlider CSS -->
+<link rel="stylesheet" href="/vendors/sliders/lightslider/css/lightslider.min.css" type="text/css" />
+
+<!-- Main grupopv theme CSS -->
+<link rel="stylesheet" href="/css/grupopv.css" type="text/css" />
+
+<!-- Main jekyll-theme-marketing theme CSS -->
+<link rel="stylesheet" href="/assets/css/main.css" type="text/css" />
+
+<!-- CSS -->
+<link rel="stylesheet" href="/vendors/themes/vg_progressive/css/system.css" type="text/css" />
+<link rel="stylesheet" href="/vendors/themes/vg_progressive/css/buttons/buttons.css">
+<link rel="stylesheet" href="/vendors/themes/vg_progressive/css/buttons/social-icons.css">
+<link rel="stylesheet" href="/assets/node_modules/font-awesome/css/font-awesome.min.css">
+<link rel="stylesheet" href="/assets/node_modules/bootstrap/dist/css/bootstrap.min.css">
+<link rel="stylesheet" href="/vendors/themes/vg_progressive/css/jslider.css">
+<link rel="stylesheet" href="/vendors/themes/vg_progressive/css/settings.css">
+<link rel="stylesheet" href="/vendors/themes/vg_progressive/css/jquery.fancybox.css">
+<link rel="stylesheet" href="/vendors/themes/vg_progressive/css/animate.css">
+<link rel="stylesheet" href="/vendors/themes/vg_progressive/css/video-js.min.css">
+<link rel="stylesheet" href="/vendors/themes/vg_progressive/css/morris.css">
+<link rel="stylesheet" href="/vendors/themes/vg_progressive/css/ladda.min.css">
+<link rel="stylesheet" href="/vendors/themes/vg_progressive/css/datepicker.css">
+
+<!-- VG Progressive CSS -->
+<link rel="stylesheet" href="/vendors/themes/vg_progressive/css/style.css">
+<link rel="stylesheet" href="/vendors/themes/vg_progressive/css/responsive.css">
+
+<!-- Custom CSS -->
+<link rel="stylesheet" href="/vendors/themes/vg_progressive/css/customizer/pages.css">
+<link rel="stylesheet" href="/vendors/themes/vg_progressive/css/customizer/home-pages-customizer.css">
+
+<!-- IE Styles-->
+<link rel='stylesheet' href="/vendors/themes/vg_progressive/css/ie/ie.css">
+
+<!--[if lt IE 9]>
+<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
+<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
+<link rel='stylesheet' href="/vendors/themes/vg_progressive/css/ie/ie8.css">
+<![endif]-->
+
+<link rel="stylesheet" href="/vendors/themes/vg_progressive/css/cms.css">
+
+<!-- Theme CSS -->
+<link rel="stylesheet" href="/vendors/themes/vg_progressive/css/base.css">

data/_layouts/default.html

@@ -7,7 +7,7 @@
     {% seo %}
     {% include head/meta.html %}
     {% include head/scripts.html %}
-    {% if site.original %} {% include head/firebase/sdk.html %} {% endif %}
+    {% include head/firebase/sdk.html %}
     {% include head/fonts.html %}
     {% include head/style.html %}
     {% include head/google-analytics.html %}

data/_layouts/grid.html

@@ -1,7 +1,7 @@
 ---
 layout: page
 ---
-<div class="container">
+<div class="container" data-layout="grid">
   <div class="row">
     {% assign collections = site.collections | where: "label", page.collection %}
     {% for collection in collections %}
@@ -15,7 +15,7 @@ layout: page
         {% else %}
           {% assign i18n-description = site.data.i18n.catalog[collection.label][site.lang][i18n-id].desc %}
         {% endif %}
-        <div class="col-xs-6 col-sm-4 col-md-3">
+        <div class="col-xs-12 col-sm-4 col-md-3">
           <div>
             <a {% if doc.menu-name or collection.products.detail or doc.menu-name %}{{ doc.url | prepend: 'href="' | append: '"' }}{% endif %}>
               <img id="{{ i18n-id }}" class="product-image" src="{{ doc.image }}" alt="{% if i18n-title %}{{ i18n-title }}{% else %}{{ doc.title }}{% endif %}" />

data/_layouts/page.html

@@ -16,7 +16,7 @@ layout: default
   {% endif %}
 {% endif %}
 
-<nav aria-label="breadcrumb">
+<nav class="breadcrumb-component" aria-label="breadcrumb">
   <ol id="breadcrumb" class="breadcrumb">
     {% for level in (-1..page.categories.size) %}
       {% if forloop.first %}

data/_layouts/product.html

@@ -10,14 +10,18 @@ special-offers:
   margin: 0.25
   dpi: 300
 ---
-<script src="/node_modules/jspdf/dist/jspdf.min.js"></script>
+<script src="/assets/node_modules/jspdf/dist/jspdf.min.js"></script>
 {% assign url-size = page.url | size | minus: 2 %}
-{% assign i18n-id = page.url | slice: 1,url-size | replace: '/', '-' | remove_first: collection.label | remove_first: '-' %}
-{% assign i18n-title = site.data.i18n.catalog[collection.label][site.lang][i18n-id].title %}
+{% assign i18n-id = page.url | slice: 1,url-size | replace: '/', '-' | remove_first: page.collection | remove_first: '-' %}
+{% if page.i18n[site.lang].title %}
+  {% assign i18n-title = page.i18n[site.lang].title %}
+{% else %}
+  {% assign i18n-title = site.data.i18n.catalog[page.collection][site.lang][i18n-id].title %}
+{% endif %}
 {% if page.i18n[site.lang].description %}
   {% assign i18n-description = page.i18n[site.lang].description %}
 {% else %}
-  {% assign i18n-description = site.data.i18n.catalog[collection.label][site.lang][i18n-id].desc %}
+  {% assign i18n-description = site.data.i18n.catalog[page.collection][site.lang][i18n-id].desc %}
 {% endif %}
 <div class="container">
   <div class="row">
@@ -79,6 +83,7 @@ special-offers:
                   <img src="{{ site.amazon-s3 }}{{ resource }}" alt="{{ page.title }}" class="img-center">
                 {% endfor %}
               </p>
+              {{ page.i18n[site.lang].detailed_desc | default: page.detailed_desc }}
               {{ content }}
 
             {% when 2 %}
@@ -137,7 +142,7 @@ special-offers:
                         {% assign image-num = forloop.index | prepend: "_" %}
                       {% endif %}
                       <div class="marketing-theme content-right">
-                        <a class="btn btn-primary btn-sm" onclick="specialOffersPDF();">
+                        <a class="btn btn-primary btn-sm" onclick="specialOffersPDF{{ forloop.index }}();">
                           <strong><span class="glyphicon glyphicon-download-alt"></span> {{ site.data.i18n.common.product-layout[site.lang].download }}</strong>
                         </a>
                       </div>
@@ -148,7 +153,7 @@ special-offers:
                         <canvas id="special-offers-dataCanvas{{ forloop.index }}" class="hide" width="{{ layout.special-offers.width | times: layout.special-offers.dpi }}" height="{{ layout.special-offers.height | minus: 10.5 | times: layout.special-offers.dpi | times: -1 }}"></canvas>
                       </div>
                       <script>
-                        function specialOffersPDF(){
+                        function specialOffersPDF{{ forloop.index }}(){
                           var doc = new jsPDF({
                             orientation: '{{ layout.special-offers.orientation }}',
                             unit: '{{ layout.special-offers.unit }}',