dev.pug

extends base

block append head
  - var current = "DEV";
  title #{sitename} - #{current}
  meta(name="description" content="Aporto una perspectiva multidimensional, transdisciplinar y holistica de la Creación para encontrarnos a nosotros mismos en el contexto desde el vacío.")

block pageheader
  main(title="covertitle")
    h1 !{page_dev.titulo}
  aside(title="coverimg").bgCover(style='background-image: url('+`${baseUrl + page_dev.galeria1[1]}`+');')
  //- img(src=`${baseUrl + page_dev.galeria1[1]}` alt='Cover image')
  header(title="sintesis")
    h2 !{page_dev.subtitulo}

block content
  article.grid-12.grid-md-6
    .slider--container
      .slider1.card
        h3 #{page_dev.headings[0]}
        ul
          each frase in page_dev.frases1
            li= `${frase}`

      .slider1.card
        h3 #{page_dev.headings[5]}
        ul 
          each frase in page_dev.frases2
            li= `${frase}`

      .slider1.card
        h3 #{page_dev.headings[4]}
        ul 
          each frase in page_dev.frases3
            li= `${frase}`

      .slider1.card
        h3 #{page_dev.headings[3]}
        ul 
          each frase in page_dev.frases4
            li= `${frase}`

      button.prev(onclick='plusDivs(-1, 0)') ❮
      button.next(onclick='plusDivs(1, 0)') ❯

  article.grid-12.grid-md-6
    .slider--container
      each imgUrl in page_dev.galeria2
        .slider2.bgImg(style='background-image: url('+`${baseUrl + imgUrl}`+');')
      button.prev(onclick='plusDivs(-1, 1)') ❮
      button.next(onclick=`plusDivs(1, 1)`) ❯

  article.grid-12.grid-md-6.placeself
    .card
      h3 #{page_dev.headings[2]}
      ul 
        each frase in page_dev.frases5
          li= `${frase}`

  article.grid-12.grid-md-6
    .slider--container
      each imgUrl in page_dev.galeria1
        .slider4.bgImg(style='background-image: url('+`${baseUrl + imgUrl}`+');')
      button.prev(onclick='plusDivs(-1, 3)') ❮
      button.next(onclick='plusDivs(1, 3)') ❯

  article.grid-12.grid-md-6
    .slider--container
      .slider5.card
        h3 #{page_dev.headings[6]}
        ul 
          each frase in page_dev.frases6
            li= `${frase}`
      .slider5.card
        h3 #{page_dev.headings[1]}
        ul 
          each frase in page_dev.frases7
            li= `${frase}`
      .slider5.card
        h3 #{page_dev.headings[7]}
        li #{page_dev.headings[8]}
        li #{page_dev.headings[9]}
      button.prev(onclick='plusDivs(-1, 4)') ❮
      button.next(onclick='plusDivs(1, 4)') ❯
  
  article.grid-12.grid-md-6
    .slider--container
      each imgUrl in page_dev.galeria3
        .slider6.bgImg(style='background-image: url('+`${baseUrl + imgUrl}`+');')
      button.prev(onclick='plusDivs(-1, 5)') ❮
      button.next(onclick='plusDivs(1, 5)') ❯

  article.grid-12
    .slider--container.jcc
      .slider3
        video#video1(poster='./assets/img/bg1.jpg' controls='false' loop='true')
          source(src='./assets/img/introweb.mp4' type='video/mp4')
          | Your browser does not support the video tag. 
      .slider3
        h3.tac Aquí irán llegando más videos...
      button.prev(onclick='plusDivs(-1, 2)') ❮
      button.next(onclick='plusDivs(1, 2)') ❯ 
block foot

block append scripts
  script( src="/js/slider.js")
  //- script(type="module", src="./js/main.js")