$(document).on('page:beforein', '.page[data-name="list_page"]', async function(e) {

  console.log('app list_page ready')

  var cat = e.detail.route.params.cat;

  var id = e.detail.route.params.id;

  console.log(id + ', ' + cat); 

  let dt2=get_localstorage(cat);

  let dt=dt2.data[id];

    

  var content = ``;

  content +=`

  <a href="/p/byid/${dt.items[0].id}" class="card">

      <div class="card-image">

        <img src="${dt.items[0].img}" alt="">

        <div class="card-image-footer">

          <h2>${dt.items[0].title}</h2>

          <div class="card-author">

            <img src="${dt.icon_url}" alt="">

            <span>${dt.title}</span>

          </div>

        </div>

      </div>

    </a>  

  `;

  content +=`<div class="post-list">`;

  //dt.items.forEach(v => {

  for(let a=1;a<dt.items.length;a++) {

    content +=`

  <a href="/p/byid/${dt.items[a].id}" class="link post-horizontal">

    <div class="infos">`;

    if(dt.items[a].section) {

    content +=`<div class="post-category">${dt.items[a].section}</div>`;

    }      

    content +=`<div class="post-title">${dt.items[a].title}</div>

      <div class="post-date">`+InDayHour(dt.items[a].publish_at)+` ago </div>

    </div>

    <div class="post-image">

      <img src="${dt.items[a].img}" alt="">

    </div>

  </a>

    `;

  };

  content +=`</div>`;



  $("#ptitle_list_page").html(dt.title);

  $("#ptitle_large_list_page").html(dt.title);

  $("#list_page_content").html(content);

});