Browse Source

Remplacer l'affichage en ligne par colonne

Pour éviter les espaces blancs entre les images (pas toutes de la même hauteur) on passe de un <li> pour une image à un <li> par colonne.
master
zzzazzz 2 months ago
parent
commit
ff70ebc08e
3 changed files with 37 additions and 3 deletions
  1. +2
    -2
      content/article-portfolio-2col.html
  2. +2
    -0
      css/microedition.css
  3. +33
    -1
      inclure/article-media.html

+ 2
- 2
content/article-portfolio-2col.html View File

@ -7,8 +7,8 @@
</div>
<div class="col-8-small-7 mt12">
<ul class="unstyled grid-2-medium-2 small-w100 tiny-w100 has-gutter-s">
<INCLURE{fond=inclure/article-media,env}/>
<ul class="unstyled grid-2-medium-2 small-w100 tiny-w100 has-gutter-s[ (#COMPOSITION)]">
<INCLURE{fond=inclure/article-media,composition=#COMPOSITION,env}/>
</ul>
<INCLURE{fond=aside/#ENV{type-page}-portfolio,align=txtleft,composition=#COMPOSITION,env}>
</div>


+ 2
- 0
css/microedition.css View File

@ -79,6 +79,8 @@ label {display: block}
}
.txt-2col > p {column-count:2; column-gap: 1.5rem}
.has-gutter-s.portfolio-2col > li > a {margin-bottom: 0.5rem; display:block} /* compense le grid-gap de has-hutter-s */
/* debug */
#debug-nav {width: 50% !important}
.test {background-color: red}


+ 33
- 1
inclure/article-media.html View File

@ -1,3 +1,6 @@
#SET{col1,""}
#SET{col2,""}
<BOUCLE_images(DOCUMENTS){id_article}{media IN image,video}{par rang_lien, num titre, titre}>
#SET{url,#URL_DOCUMENT}
@ -15,6 +18,35 @@
]
]
[<li><a class="mediabox[(#MEDIA|=={video}|oui|et{#EXTENSION|=={html}|non}) boxIframe[ boxWidth-(#LARGEUR|plus{2})px][ boxHeight-(#HAUTEUR|plus{34})px]] " rel="serie-#ID_ARTICLE" href="#GET{url}">(#GET{image}|image_responsive{160/320/480/640/960/1440})</a></li>]
[(#SET{image,
[<a class="mediabox[(#MEDIA|=={video}|oui|et{#EXTENSION|=={html}|non}) boxIframe[ boxWidth-(#LARGEUR|plus{2})px][ boxHeight-(#HAUTEUR|plus{34})px]] " rel="serie-#ID_ARTICLE" href="#GET{url}">(#GET{image}|image_responsive{160/320/480/640/960/1440})</a>]
})]
[(#ENV{composition}|=={portfolio-2col}|?{
[(#COMPTEUR_BOUCLE|modulo{2}|=={1}|oui)
[(#SET{col1,#GET{col1}|concat{'',#GET{image}}})]
]
[(#COMPTEUR_BOUCLE|modulo{2}|=={0}|oui)
[(#SET{col2,#GET{col2}|concat{'',#GET{image}}})]
]
,
[<li>(#GET{image})</li>]
})]
</BOUCLE_images>
[(#ENV{composition}|=={portfolio-2col}|oui)
[<li>(#GET{col1})</li>]
[<li>(#GET{col2})</li>]
]
</B_images>

Loading…
Cancel
Save