keb/ginou
1
0
Fork 0
Code Issues 6 Pull Requests Releases Activity

First test of an exposition view with basic info

Browse Source
This commit is contained in:
Théo Marchal
2021-01-28 23:48:38 +01:00
parent 6c5fd9ca2a
commit 8603c7ad77
2 changed files with 96 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

126
exposition.html
View File

@@ -39,61 +39,103 @@
<p style="text-align:center;">Cliquez sur une image pour la voir en grand avec ses détails.</p>
<div id="gallery" class="exposition">
<a data-fancybox="exposition" href="photos/paintings/normal/15.jpg" data-fancybox-index="15">
<img src="photos/paintings/mini/15.jpg">
</a>
<div class="gallery-item">
<a data-fancybox="exposition" href="photos/paintings/normal/15.jpg" data-fancybox-index="15">
<img src="photos/paintings/mini/15.jpg">
</a>
<span class="item-title">Sérénade à l'enfant (1959)</span>
</div>
<a data-fancybox="exposition" href="photos/paintings/normal/19.jpg" data-fancybox-index="19">
<img src="photos/paintings/mini/19.jpg">
</a>
<div class="gallery-item">
<a data-fancybox="exposition" href="photos/paintings/normal/19.jpg" data-fancybox-index="19">
<img src="photos/paintings/mini/19.jpg">
</a>
<span class="item-title">Sérénade à l'enfant (1959)</span>
</div>
<a data-fancybox="exposition" href="photos/paintings/normal/22.jpg" data-fancybox-index="22">
<img src="photos/paintings/mini/22.jpg">
</a>
<div class="gallery-item">
<a data-fancybox="exposition" href="photos/paintings/normal/22.jpg" data-fancybox-index="22">
<img src="photos/paintings/mini/22.jpg">
</a>
<span class="item-title">Sérénade à l'enfant (1959)</span>
</div>
<a data-fancybox="exposition" href="photos/paintings/normal/26.jpg">
<img src="photos/paintings/mini/26.jpg">
</a>
<div class="gallery-item">
<a data-fancybox="exposition" href="photos/paintings/normal/26.jpg">
<img src="photos/paintings/mini/26.jpg">
</a>
<span class="item-title">Sérénade à l'enfant (1959)</span>
</div>
<a data-fancybox="exposition" href="photos/paintings/normal/34.jpg">
<img src="photos/paintings/mini/34.jpg">
</a>
<div class="gallery-item">
<a data-fancybox="exposition" href="photos/paintings/normal/34.jpg">
<img src="photos/paintings/mini/34.jpg">
</a>
<span class="item-title">Sérénade à l'enfant (1959)</span>
</div>
<a data-fancybox="exposition" href="photos/paintings/normal/42.jpg">
<img src="photos/paintings/mini/42.jpg">
</a>
<div class="gallery-item">
<a data-fancybox="exposition" href="photos/paintings/normal/42.jpg">
<img src="photos/paintings/mini/42.jpg">
</a>
<span class="item-title">Champs de colza et vue sur Dugny et la vallée de la Meuse (1959)</span>
</div>
<a data-fancybox="exposition" href="photos/paintings/normal/43.jpg">
<img src="photos/paintings/mini/43.jpg">
</a>
<div class="gallery-item">
<a data-fancybox="exposition" href="photos/paintings/normal/43.jpg">
<img src="photos/paintings/mini/43.jpg">
</a>
<span class="item-title">Champs de colza et vue sur Dugny et la vallée de la Meuse (1959)</span>
</div>
<a data-fancybox="exposition" href="photos/paintings/normal/44.jpg">
<img src="photos/paintings/mini/44.jpg">
</a>
<div class="gallery-item">
<a data-fancybox="exposition" href="photos/paintings/normal/44.jpg">
<img src="photos/paintings/mini/44.jpg">
</a>
<span class="item-title">Sérénade à l'enfant (1959)</span>
</div>
<a data-fancybox="exposition" href="photos/paintings/normal/51.jpg">
<img src="photos/paintings/mini/51.jpg">
</a>
<div class="gallery-item">
<a data-fancybox="exposition" href="photos/paintings/normal/51.jpg">
<img src="photos/paintings/mini/51.jpg">
</a>
<span class="item-title">Sérénade à l'enfant (1959)</span>
</div>
<a data-fancybox="exposition" href="photos/paintings/normal/55.jpg">
<img src="photos/paintings/mini/55.jpg">
</a>
<div class="gallery-item">
<a data-fancybox="exposition" href="photos/paintings/normal/55.jpg">
<img src="photos/paintings/mini/55.jpg">
</a>
<span class="item-title">Sérénade à l'enfant (1959)</span>
</div>
<a data-fancybox="exposition" href="photos/paintings/normal/57.jpg">
<img src="photos/paintings/mini/57.jpg">
</a>
<div class="gallery-item">
<a data-fancybox="exposition" href="photos/paintings/normal/57.jpg">
<img src="photos/paintings/mini/57.jpg">
</a>
<span class="item-title">Sérénade à l'enfant (1959)</span>
</div>
<a data-fancybox="exposition" href="photos/paintings/normal/58.jpg">
<img src="photos/paintings/mini/58.jpg">
</a>
<div class="gallery-item">
<a data-fancybox="exposition" href="photos/paintings/normal/58.jpg">
<img src="photos/paintings/mini/58.jpg">
</a>
<span class="item-title">Sérénade à l'enfant (1959)</span>
</div>
<a data-fancybox="exposition" href="photos/paintings/normal/59.jpg">
<img src="photos/paintings/mini/59.jpg">
</a>
<div class="gallery-item">
<a data-fancybox="exposition" href="photos/paintings/normal/59.jpg">
<img src="photos/paintings/mini/59.jpg">
</a>
<span class="item-title">Sérénade à l'enfant (1959)</span>
</div>
<a data-fancybox="exposition" href="photos/paintings/normal/64.jpg">
<img src="photos/paintings/mini/64.jpg">
</a>
<div class="gallery-item">
<a data-fancybox="exposition" href="photos/paintings/normal/64.jpg">
<img src="photos/paintings/mini/64.jpg">
</a>
<span class="item-title">Sérénade à l'enfant (1959)</span>
</div>
</div>
</article>
</body>

16
styles/main.css
View File

@@ -191,12 +191,19 @@ article.main p.signature {
/* Exposition */
article #gallery {
article #gallery .gallery-item {
display:inline-block;
position:relative;
margin:0.75rem;
margin-top:1.6rem;
}
margin:auto;
margin-top:0;
article #gallery .item-title {
font-size:0.9rem;
margin:0rem;
padding:0rem;
padding-top:0.25rem;
display:block;
}
article #gallery.exposition {
@@ -206,7 +213,8 @@ article #gallery.exposition {
article #gallery img {
max-height:30vh;
max-width:40vw;
margin:0.5rem;
display:block;
margin:auto;
}
@media only screen and (max-width: 1000px) {