diff --git a/explorer.html b/explorer.html index fcd01de..447e21e 100644 --- a/explorer.html +++ b/explorer.html @@ -38,7 +38,7 @@

Explorer

-

Cette section du site permet de générer une liste liste (aussi visible sous le format d'une galerie galerie) en fonction de différents paramètres, listés ci-dessous. Il permet d'explorer l'œuvre de Ginou, y compris les tableaux dont nous ne possédons pas de photo.
+

Cette section du site permet de générer une liste liste (aussi visible sous le format d'une galerie galerie) en fonction de différents paramètres, listés ci-dessous. Il permet d'explorer l'œuvre de Ginou, y compris les tableaux dont nous ne possédons pas de photo.
En mode liste liste, l'icône œil œil permet de voir le tableau en grand ; en mode galerie galerie, il faut cliquer sur les tableaux.
Une ☆ étoile vide dans la colonne photo signifie que nous n'avons pas de photo pour un tableau ; une ★ étoile qu'elle est de mauvaise qualité ; deux ★★ étoiles qu'elle est acceptable ; et trois ★★★ étoiles qu'elle est tout à fait satisfaisante.
Le symbole double point d'exclamation dans la colonne aide signifie que nous avons besoin d'aide pour obtenir une photo et que vous pouvez contribuer.
@@ -210,7 +210,7 @@ -

+

\ No newline at end of file diff --git a/exposition.html b/exposition.html index 1811b01..3abe2d9 100644 --- a/exposition.html +++ b/exposition.html @@ -37,7 +37,7 @@

Exposition

-

Cliquez sur un tableau pour le voir en grand avec ses détails.

+

Cliquez sur un tableau pour le voir en grand avec ses détails.

diff --git a/scripts/explorer.js b/scripts/explorer.js index e3af954..6ba64a0 100644 --- a/scripts/explorer.js +++ b/scripts/explorer.js @@ -457,16 +457,21 @@ jQuery(document).ready(function($) $("table").append(result); // gallery + paintingHtml = ''; $(".gallery").append(paintingHtml); } $(".explorer .result").append("La recherche donne un résultat de " + numberOfItem + " élément" + (numberOfItem > 1 ? "s" : "") + "."); diff --git a/scripts/exposition.js b/scripts/exposition.js index 90fcf0d..81bb488 100644 --- a/scripts/exposition.js +++ b/scripts/exposition.js @@ -6,8 +6,13 @@ jQuery(document).ready(function($) { if (i.photo == "ok" || i.photo == "good") { - paintingHtml = '' + paintingHtml = ''; $(".gallery").append(paintingHtml); } } diff --git a/styles/main.css b/styles/main.css index 0aed8b3..e9a6ad0 100644 --- a/styles/main.css +++ b/styles/main.css @@ -204,8 +204,12 @@ article.main p.signature { /* Exposition */ article .gallery { - display:inline-block; position:relative; + display:flex; + flex-direction:row; + justify-content:space-around; + align-self:flex-end; + flex-wrap:wrap; margin:auto; margin-top:0; @@ -215,6 +219,22 @@ article.exposition .gallery { text-align:center; } +article .gallery .gallery-item { + display:inline-block; + position:relative; + margin:0.75rem; + margin-top:0.75rem; + margin-top:1.6rem; +} + +article .gallery .item-title { + font-size:0.9rem; + margin:0rem; + padding:0rem; + padding-top:0rem; + display:block; +} + article .gallery img { max-height:30vh; max-width:40vw; @@ -362,7 +382,7 @@ article.explorer .gallery { text-align:center; } -article.explorer p { +article.explorer p.intro { width:55vw; margin:auto; margin-bottom:2rem; @@ -590,6 +610,14 @@ article.explorer table .photo { /* Divers */ +article.divers .gallery { + justify-content:flex-start; +} + +article.divers .gallery img { + margin:0.7rem; +} + article #stats { margin-top:2.5rem; margin-bottom:1.5rem; @@ -605,7 +633,13 @@ article #stats .stat { margin-left:4vw; } -@media only screen and (max-width:1000px) { +@media only screen and (max-width:600px) { + article.divers .gallery { + justify-content:center; + } +} + +@media only screen and (max-width:1000px) { article #stats { display:block; }