2024-08-16
This commit is contained in:
parent
187aab9fb4
commit
fcdf367d31
307 changed files with 534 additions and 406 deletions
|
|
@ -101,7 +101,8 @@
|
|||
--espace-xs: 0.25rem;
|
||||
--espace-s: 0.5rem;
|
||||
--espace-m: 1rem;
|
||||
--espace-l: 2rem;
|
||||
--espace-l: 1.25rem;
|
||||
--espace-xl: 2rem;
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -279,7 +280,7 @@ ul.avec-puce-cercle a {
|
|||
|
||||
#en-tete {
|
||||
/* Marges */
|
||||
--en-tete-marges-internes-ligne: var(--espace-l);
|
||||
--en-tete-marges-internes-ligne: var(--espace-xl);
|
||||
--en-tete-marges-internes-bloc: var(--espace-m);
|
||||
/* Dimensions */
|
||||
--en-tete-section-hauteur: var(--en-tete-hauteur);
|
||||
|
|
@ -742,15 +743,16 @@ ul.avec-puce-cercle a {
|
|||
.produits-similaires {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
grid-template-rows: 1fr max-content;
|
||||
grid-template-rows: 1fr auto;
|
||||
grid-template-areas: "en-tete en-tete en-tete" "produits produits produits";
|
||||
place-items: center;
|
||||
margin-top: 1rem;
|
||||
margin-top: var(--espace-m);
|
||||
/* En-tête de la section */
|
||||
}
|
||||
.produits-similaires header {
|
||||
grid-column: span 3;
|
||||
grid-area: en-tete;
|
||||
width: 100%;
|
||||
padding: 1.25rem 0 var(--espace-m);
|
||||
padding: var(--espace-l) 0 var(--espace-m);
|
||||
text-align: center;
|
||||
border: 1px solid var(--couleur-noir);
|
||||
}
|
||||
|
|
@ -763,10 +765,10 @@ ul.avec-puce-cercle a {
|
|||
.produits-similaires .grille-produits-similaires {
|
||||
display: grid;
|
||||
grid-auto-rows: 1fr;
|
||||
grid-column: span 3;
|
||||
grid-row: 2;
|
||||
grid-area: produits;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 1px;
|
||||
width: 100%;
|
||||
}
|
||||
.produits-similaires .grille-produits-similaires article {
|
||||
box-shadow: 0 0 0 1px var(--couleur-noir); /* 2 */
|
||||
|
|
@ -774,8 +776,8 @@ ul.avec-puce-cercle a {
|
|||
.produits-similaires .grille-produits-similaires article figure {
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
row-gap: 2rem;
|
||||
padding: 1rem;
|
||||
row-gap: var(--espace-xl);
|
||||
padding: var(--espace-m);
|
||||
}
|
||||
.produits-similaires .grille-produits-similaires article figure a {
|
||||
position: relative;
|
||||
|
|
@ -811,7 +813,7 @@ ul.avec-puce-cercle a {
|
|||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 2rem;
|
||||
margin-bottom: var(--espace-xl);
|
||||
}
|
||||
.produits-similaires .grille-produits-similaires article figure figcaption h3 {
|
||||
font-style: italic;
|
||||
|
|
@ -828,7 +830,7 @@ ul.avec-puce-cercle a {
|
|||
#pied-de-page {
|
||||
/* Marges */
|
||||
--pied-de-page-marges-internes-bloc: var(--espace-m);
|
||||
--pied-de-page-marges-internes-ligne: var(--espace-l);
|
||||
--pied-de-page-marges-internes-ligne: var(--espace-xl);
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
place-items: center;
|
||||
|
|
|
|||
|
|
@ -1 +1 @@
|
|||
{"version":3,"sourceRoot":"","sources":["../../src/sass/base/polices/_lato.scss","../../src/sass/base/polices/_myriad.scss","../../src/sass/abstracts/_variables.scss","../../src/sass/base/_base.scss","../../src/sass/base/_typographie.scss","../../src/sass/base/elements/_boutons.scss","../../src/sass/base/elements/_images.scss","../../src/sass/base/elements/_liens.scss","../../src/sass/base/elements/_listes.scss","../../src/sass/layouts/_en-tete.scss","../../src/sass/layouts/_menu-categories-produits.scss","../../src/sass/layouts/_colonnes-photos.scss","../../src/sass/layouts/_grille-produits.scss","../../src/sass/layouts/_informations-produit.scss","../../src/sass/layouts/_produits-similaires.scss","../../src/sass/layouts/_pied-de-page.scss"],"names":[],"mappings":";AAAA;EACE;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA,KACE;;AChGJ;EACE;EACA;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA,KACE;;AChBJ;AACE;EACA;EACA;EACA;EACA;AAEA;EACA;EACA;AAEA;EACA;EACA;AAEA;EACA;EACA;EACA;EACA;;;ACjBF;AAAA;AAAA;AAAA;AAAA;AAKA;EACE;EACA;EACA;EACA;;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA;AAAA;AAAA;EAGE;EACA;EACA;EACA;EACA;;;AAGF;AAAA;AAAA;AAAA;AAIA;EACE;EACA;;;AAGF;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;EAIE;;;AAGF;AAAA;AAAA;AAGA;EACE;;;ACtDF;EACE;EACA;EACA;;;ACHF;AAAA;AAAA;AAGA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;;;ACfJ;AAAA;AAAA;AAAA;AAAA;AAKA;AAAA;EAEE;EACA;;;AAGF;EACE;EACA;;;ACbF;AAAA;AAAA;AAAA;AAAA;AAKA;AACE;EACA;EAEA;EACA;EACA;EACA;EACA;EACA,YACE,kHAK4B;EAE9B;AAEA;AAMA;AAAA;AAAA;;AALA;EAEE;;AAMF;AACE;EACA;EACA;AAEA;EACA;EAEA;EACA;AAEA;AAMA;AAKA;;AAVA;EAEE;;AAIF;EACE;;AAIF;EACE;IACE;;;AAMJ;EACE;IACE;;;;AClER;AAAA;AAAA;AAAA;AAAA;AAKA;EACE;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAMA;AACE;EACA;AAEA;EACA;AAEA;EACA;;AAEA;EACE;EACA,qLAEkE;;;AC5BxE;AACE;EACA;EACA;AAEA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAWA;;AATA;EACE;;AAEA;AAAA;EAEE;;AAKJ;EACE;EACA;EACA;EACA;EACA;AAUA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AARA;EACE;EACA;EACA;EACA;EACA;;AAYF;AACE;EACA;AAEA;EACA;EACA;EACA;AAEA;EACA;EAEA;;AAEA;EACE;EACA;EACA;;AAGF;EACE;IACE;;;AAMR;EACE;EACA;EACA;EACA;EACA;AAEA;AAAA;AAAA;;AAGA;EACE;EACA;;AAEA;EACE;;AAGF;EACE;;;ACvGR;AAAA;AAAA;AAAA;AAAA;AAAA;AAMA;AACE;EACA;EACA;AAEA;EACA;EACA;EAEA;EACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAOA;EACE;EACA;EACA;AAEA;AAAA;AAAA;;AAGA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAMA;AAAA;AAAA;AAAA;AAAA;;AAJA;EACE;;AAQF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;;AAGF;EACE;IACE;IACA;;;AAKN;EACE;;AAGF;EACE;;;AC/ER;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA;AACE;EACA;AAEA;EACA;EACA;AAAA;AAAA;AAIA;EACA;EAEA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAGA;EACE;;AAMF;EACE;;;AC5CR;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EAEI;IACE;IACA;IACA;;;AAMR;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;;AC9EV;EACE;EACA;EACA;EACA;EACA;AAoFA;AAyGA;;AA3LA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAKN;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAQV;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;AAEA;AAMA;AAwCA;AAqBA;;AAlEA;EACE;EACA;;AAIF;EACE;AAEA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EAEI;IACE;IACA;;;AAKN;EAEI;IACE;IACA;;;AAOR;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;IACE;;;AAKN;EACE;;AAeJ;EACE;;AAKJ;EACE;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGE;EACE;IACE;;;;AAQZ;EACE;IACE;;EAGF;IACE;;;ACnOJ;EACE;EACA;EACA;EACA;EACA;AAEA;;AACA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EAEI;IACE;IACA;IACA;;;AAMR;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;;AC1FZ;AAAA;AAAA;AAGA;AACE;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA","file":"main.css"}
|
||||
{"version":3,"sourceRoot":"","sources":["../../src/sass/base/polices/_lato.scss","../../src/sass/base/polices/_myriad.scss","../../src/sass/abstracts/_variables.scss","../../src/sass/base/_base.scss","../../src/sass/base/_typographie.scss","../../src/sass/base/elements/_boutons.scss","../../src/sass/base/elements/_images.scss","../../src/sass/base/elements/_liens.scss","../../src/sass/base/elements/_listes.scss","../../src/sass/layouts/_en-tete.scss","../../src/sass/layouts/_menu-categories-produits.scss","../../src/sass/layouts/_colonnes-photos.scss","../../src/sass/layouts/_grille-produits.scss","../../src/sass/layouts/_informations-produit.scss","../../src/sass/layouts/_produits-similaires.scss","../../src/sass/layouts/_pied-de-page.scss"],"names":[],"mappings":";AAAA;EACE;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA,KACE;;AChGJ;EACE;EACA;EACA;EACA;EACA;EACA,KACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA,KACE;;AChBJ;AACE;EACA;EACA;EACA;EACA;AAEA;EACA;EACA;AAEA;EACA;EACA;AAEA;EACA;EACA;EACA;EACA;EACA;;;AClBF;AAAA;AAAA;AAAA;AAAA;AAKA;EACE;EACA;EACA;EACA;;;AAGF;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA;AAAA;AAAA;EAGE;EACA;EACA;EACA;EACA;;;AAGF;AAAA;AAAA;AAAA;AAIA;EACE;EACA;;;AAGF;AAAA;AAAA;AAGA;AAAA;AAAA;AAAA;EAIE;;;AAGF;AAAA;AAAA;AAGA;EACE;;;ACtDF;EACE;EACA;EACA;;;ACHF;AAAA;AAAA;AAGA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;;;ACfJ;AAAA;AAAA;AAAA;AAAA;AAKA;AAAA;EAEE;EACA;;;AAGF;EACE;EACA;;;ACbF;AAAA;AAAA;AAAA;AAAA;AAKA;AACE;EACA;EAEA;EACA;EACA;EACA;EACA;EACA,YACE,kHAK4B;EAE9B;AAEA;AAMA;AAAA;AAAA;;AALA;EAEE;;AAMF;AACE;EACA;EACA;AAEA;EACA;EAEA;EACA;AAEA;AAMA;AAKA;;AAVA;EAEE;;AAIF;EACE;;AAIF;EACE;IACE;;;AAMJ;EACE;IACE;;;;AClER;AAAA;AAAA;AAAA;AAAA;AAKA;EACE;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAMA;AACE;EACA;AAEA;EACA;AAEA;EACA;;AAEA;EACE;EACA,qLAEkE;;;AC5BxE;AACE;EACA;EACA;AAEA;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAWA;;AATA;EACE;;AAEA;AAAA;EAEE;;AAKJ;EACE;EACA;EACA;EACA;EACA;AAUA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AARA;EACE;EACA;EACA;EACA;EACA;;AAYF;AACE;EACA;AAEA;EACA;EACA;EACA;AAEA;EACA;EAEA;;AAEA;EACE;EACA;EACA;;AAGF;EACE;IACE;;;AAMR;EACE;EACA;EACA;EACA;EACA;AAEA;AAAA;AAAA;;AAGA;EACE;EACA;;AAEA;EACE;;AAGF;EACE;;;ACvGR;AAAA;AAAA;AAAA;AAAA;AAAA;AAMA;AACE;EACA;EACA;AAEA;EACA;EACA;EAEA;EACA;AAEA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AAOA;EACE;EACA;EACA;AAEA;AAAA;AAAA;;AAGA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;AAMA;AAAA;AAAA;AAAA;AAAA;;AAJA;EACE;;AAQF;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;;AAGF;EACE;IACE;IACA;;;AAKN;EACE;;AAGF;EACE;;;AC/ER;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAOA;AACE;EACA;AAEA;EACA;EACA;AAAA;AAAA;AAIA;EACA;EAEA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAGA;EACE;;AAMF;EACE;;;AC5CR;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAYA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EAEI;IACE;IACA;IACA;;;AAMR;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;;AC9EV;EACE;EACA;EACA;EACA;EACA;AAoFA;AAyGA;;AA3LA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAKN;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;;AAGF;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;;AAQV;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;AAEA;AAMA;AAwCA;AAqBA;;AAlEA;EACE;EACA;;AAIF;EACE;AAEA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EAEI;IACE;IACA;;;AAKN;EAEI;IACE;IACA;;;AAOR;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;IACE;;;AAKN;EACE;;AAeJ;EACE;;AAKJ;EACE;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGE;EACE;IACE;;;;AAQZ;EACE;IACE;;EAGF;IACE;;;ACnOJ;EACE;EACA;EACA;EACA,qBACE;EAEF;EACA;AAEA;;AACA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EAEI;IACE;IACA;IACA;;;AAMR;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;;AC7FZ;AAAA;AAAA;AAGA;AACE;EACA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA","file":"main.css"}
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Binary file not shown.
|
After Width: | Height: | Size: 136 KiB |
|
|
@ -7,42 +7,20 @@ declare(strict_types=1);
|
|||
|
||||
use Timber\Timber;
|
||||
|
||||
require_once __DIR__ . "/src/inc/TraitementInformations.php";
|
||||
|
||||
// Contexte et modèles
|
||||
$contexte = Timber::context();
|
||||
$modeles = ["boutique.twig"];
|
||||
|
||||
// Récupère les Produits
|
||||
$recupere_informations_produit = fn($produit) => [
|
||||
"id" => $produit->get_id(),
|
||||
"nom" => $produit->get_name(),
|
||||
"prix" => $produit->get_price(),
|
||||
"slug" => $produit->get_slug(),
|
||||
"premiere_photo_gauche" => wp_get_attachment_image(
|
||||
get_post_meta($post_id = $produit->get_id(), $key = "_photos_colonne_gauche|||0|value")[0],
|
||||
"full",
|
||||
false,
|
||||
["loading" => false],
|
||||
),
|
||||
"premiere_photo_droite" => wp_get_attachment_image(
|
||||
get_post_meta($post_id = $produit->get_id(), $key = "_photos_colonne_droite|||0|value")[0],
|
||||
"full",
|
||||
false,
|
||||
["loading" => false],
|
||||
),
|
||||
"url" => $produit->get_permalink(),
|
||||
];
|
||||
|
||||
// Informations brutes des Produits
|
||||
$informations_produits = wc_get_products([
|
||||
"orderby" => "date",
|
||||
"order" => "DESC",
|
||||
]);
|
||||
$produits = array_map($callback = $recupere_informations_produit, $array = $informations_produits);
|
||||
// Informations nécessaires pour la grille des Produits
|
||||
$produits = array_map($callback = "recupere_informations_produit_shop", $array = $informations_produits);
|
||||
$contexte["produits"] = $produits;
|
||||
|
||||
// echo "<pre>";
|
||||
// print_r($informations_produits);
|
||||
// print_r($produits);
|
||||
// echo "</pre>";
|
||||
|
||||
// Rendu
|
||||
Timber::render($filenames = $modeles, $data = $contexte);
|
||||
|
|
|
|||
|
|
@ -7,94 +7,25 @@ declare(strict_types=1);
|
|||
|
||||
use Timber\Timber;
|
||||
|
||||
require_once __DIR__ . "/src/inc/HTML.php";
|
||||
require_once __DIR__ . "/src/inc/TraitementInformations.php";
|
||||
|
||||
// Contexte et modèles
|
||||
$contexte = Timber::context();
|
||||
$modeles = ["produit.twig"];
|
||||
|
||||
/**
|
||||
* Génère la balise `<img>` d'un Média attaché à un Produit selon son ID.
|
||||
*
|
||||
* @param int $id_image
|
||||
* @return string
|
||||
*/
|
||||
function genere_balise_img($id_image) {
|
||||
return wp_get_attachment_image($attachment_id = $id_image, $size = "full");
|
||||
}
|
||||
|
||||
/**
|
||||
* @param string $slug_collection
|
||||
*/
|
||||
function recupere_produits_meme_collection($slug_collection) {
|
||||
/**
|
||||
* @param int $id_produit
|
||||
*/
|
||||
return function ($id_produit) use ($slug_collection) {
|
||||
return wc_get_products([
|
||||
"exclude" => [$id_produit],
|
||||
"limit" => 4,
|
||||
"order" => "DESC",
|
||||
"orderby" => "date",
|
||||
"tax_query" => [
|
||||
[
|
||||
"taxonomy" => "collection",
|
||||
"field" => "slug",
|
||||
"terms" => $slug_collection,
|
||||
],
|
||||
],
|
||||
]);
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* Retourne un tableau associatif des informations affichées sur la page Produit depuis les
|
||||
* données brutes d'un Produit.
|
||||
*
|
||||
* @param mixed $donnees_produit
|
||||
* @return mixed
|
||||
*/
|
||||
function recupere_informations_produit($donnees_produit): mixed {
|
||||
return [
|
||||
"collection" => get_the_terms($donnees_produit->get_id(), "collection")[0]->slug,
|
||||
"id" => $donnees_produit->get_id(),
|
||||
"nom" => $donnees_produit->get_name(),
|
||||
"prix" => $donnees_produit->get_price(),
|
||||
"photos_colonne_gauche" => array_map(
|
||||
$callback = "genere_balise_img",
|
||||
$array = get_post_meta($post_id = $donnees_produit->get_id(), $key = "_photos_colonne_gauche|||0|value"),
|
||||
),
|
||||
"photos_colonne_droite" => array_map(
|
||||
$callback = "genere_balise_img",
|
||||
$array = get_post_meta($post_id = $donnees_produit->get_id(), $key = "_photos_colonne_droite|||0|value"),
|
||||
),
|
||||
"premiere_photo_gauche" => wp_get_attachment_image(
|
||||
get_post_meta($post_id = $donnees_produit->get_id(), $key = "_photos_colonne_gauche|||0|value")[0],
|
||||
"full",
|
||||
false,
|
||||
["loading" => false],
|
||||
),
|
||||
"premiere_photo_droite" => wp_get_attachment_image(
|
||||
get_post_meta($post_id = $donnees_produit->get_id(), $key = "_photos_colonne_droite|||0|value")[0],
|
||||
"full",
|
||||
false,
|
||||
["loading" => false],
|
||||
),
|
||||
"slug" => $donnees_produit->get_slug(),
|
||||
"url" => $donnees_produit->get_permalink(),
|
||||
];
|
||||
}
|
||||
|
||||
$produit = recupere_informations_produit(wc_get_product());
|
||||
$produit = recupere_informations_produit_page_produit(wc_get_product());
|
||||
$produits_collection = array_map(
|
||||
"recupere_informations_produit",
|
||||
"recupere_informations_produit_page_produit",
|
||||
recupere_produits_meme_collection($produit["collection"])($produit["id"]),
|
||||
);
|
||||
// echo "<pre>";
|
||||
// print_r($produits_collection);
|
||||
// echo "</pre>";
|
||||
|
||||
$contexte["produit"] = $produit;
|
||||
$contexte["produits_collection"] = $produits_collection;
|
||||
|
||||
// Charge les scripts de la Page
|
||||
/**
|
||||
* Charge les Scripts nécessaires pour la page Produit.
|
||||
*/
|
||||
function charge_scripts_page_produit(): void {
|
||||
wp_enqueue_script_module(
|
||||
$id = "haiku-atelier-2024-scripts-page-produit",
|
||||
|
|
|
|||
|
|
@ -4,7 +4,6 @@ declare(strict_types=1);
|
|||
|
||||
namespace HaikuAtelier;
|
||||
|
||||
use stdClass;
|
||||
use Timber\Site;
|
||||
|
||||
class StarterSite extends Site {
|
||||
|
|
|
|||
16
web/app/themes/haiku-atelier-2024/src/inc/HTML.php
Normal file
16
web/app/themes/haiku-atelier-2024/src/inc/HTML.php
Normal file
|
|
@ -0,0 +1,16 @@
|
|||
<?php
|
||||
/**
|
||||
* Fonctions pour la génération de HTML.
|
||||
*/
|
||||
|
||||
declare(strict_types=1);
|
||||
|
||||
/**
|
||||
* Génère la balise `<img>` d'un Média attaché à un Produit selon son ID.
|
||||
*
|
||||
* @param int $id_image
|
||||
* @return string
|
||||
*/
|
||||
function genere_balise_img($id_image) {
|
||||
return wp_get_attachment_image($attachment_id = $id_image, $size = "full");
|
||||
}
|
||||
|
|
@ -0,0 +1,104 @@
|
|||
<?php
|
||||
/**
|
||||
* Fonctions pour le traitement d'informations.
|
||||
*/
|
||||
|
||||
declare(strict_types=1);
|
||||
|
||||
/**
|
||||
* Récupère les informations utilisées pour la grille des Produits et les retourne sous forme de
|
||||
* tableau associatif.
|
||||
*/
|
||||
function recupere_informations_produit_shop($produit) {
|
||||
return [
|
||||
/* Identifiant du Produit */
|
||||
"id" => $produit->get_id(),
|
||||
/* Nom affiché du Produit */
|
||||
"nom" => $produit->get_name(),
|
||||
/* Prix affiché du Produit */
|
||||
"prix" => $produit->get_price(),
|
||||
/* Photo du Produit affichée par défaut */
|
||||
"photo_repos" => wp_get_attachment_image(
|
||||
get_post_meta($post_id = $produit->get_id(), $key = "_photos_colonne_gauche|||0|value")[0],
|
||||
"full",
|
||||
false,
|
||||
["loading" => false],
|
||||
),
|
||||
/* Photo du Produit affichée au survol de l'image */
|
||||
"photo_survol" => wp_get_attachment_image(
|
||||
get_post_meta($post_id = $produit->get_id(), $key = "_photos_colonne_droite|||0|value")[0],
|
||||
"full",
|
||||
false,
|
||||
["loading" => false],
|
||||
),
|
||||
/* URL du Produit pour les liens vers celui-ci */
|
||||
"url" => $produit->get_permalink(),
|
||||
];
|
||||
}
|
||||
|
||||
/**
|
||||
* Retourne un tableau associatif des informations affichées sur la page Produit depuis les
|
||||
* données brutes d'un Produit.
|
||||
*
|
||||
* @param mixed $donnees_produit
|
||||
* @return mixed
|
||||
*/
|
||||
function recupere_informations_produit_page_produit($donnees_produit): mixed {
|
||||
return [
|
||||
"collection" => get_the_terms($donnees_produit->get_id(), "collection")[0]->slug,
|
||||
"id" => $donnees_produit->get_id(),
|
||||
"nom" => $donnees_produit->get_name(),
|
||||
"prix" => $donnees_produit->get_price(),
|
||||
"photos_colonne_gauche" => array_map(
|
||||
$callback = "genere_balise_img",
|
||||
$array = get_post_meta($post_id = $donnees_produit->get_id(), $key = "_photos_colonne_gauche|||0|value"),
|
||||
),
|
||||
"photos_colonne_droite" => array_map(
|
||||
$callback = "genere_balise_img",
|
||||
$array = get_post_meta($post_id = $donnees_produit->get_id(), $key = "_photos_colonne_droite|||0|value"),
|
||||
),
|
||||
"photo_repos" => wp_get_attachment_image(
|
||||
get_post_meta($post_id = $donnees_produit->get_id(), $key = "_photos_colonne_gauche|||0|value")[0],
|
||||
"full",
|
||||
false,
|
||||
["loading" => false],
|
||||
),
|
||||
"photo_survol" => wp_get_attachment_image(
|
||||
get_post_meta($post_id = $donnees_produit->get_id(), $key = "_photos_colonne_droite|||0|value")[0],
|
||||
"full",
|
||||
false,
|
||||
["loading" => false],
|
||||
),
|
||||
"slug" => $donnees_produit->get_slug(),
|
||||
"url" => $donnees_produit->get_permalink(),
|
||||
];
|
||||
}
|
||||
|
||||
/**
|
||||
* Récupère les informations utilisées pour la grille des Produits similaires (de la même
|
||||
* collection) et les retourne sous forme de tableau associatif.
|
||||
*
|
||||
* Pour faciliter l'usage avec `array_map`, utiliser une fonction avec curryfication.
|
||||
*
|
||||
* @param string $slug_collection
|
||||
*/
|
||||
function recupere_produits_meme_collection($slug_collection) {
|
||||
/**
|
||||
* @param int $id_produit
|
||||
*/
|
||||
return function ($id_produit) use ($slug_collection) {
|
||||
return wc_get_products([
|
||||
"exclude" => [$id_produit],
|
||||
"limit" => 4,
|
||||
"order" => "DESC",
|
||||
"orderby" => "date",
|
||||
"tax_query" => [
|
||||
[
|
||||
"taxonomy" => "collection",
|
||||
"field" => "slug",
|
||||
"terms" => $slug_collection,
|
||||
],
|
||||
],
|
||||
]);
|
||||
};
|
||||
}
|
||||
|
|
@ -19,5 +19,6 @@
|
|||
--espace-xs: 0.25rem; // 4px;
|
||||
--espace-s: 0.5rem; // 8px
|
||||
--espace-m: 1rem; // 16px
|
||||
--espace-l: 2rem; // 32px;
|
||||
--espace-l: 1.25rem;
|
||||
--espace-xl: 2rem; // 32px;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
|
||||
#en-tete {
|
||||
/* Marges */
|
||||
--en-tete-marges-internes-ligne: var(--espace-l);
|
||||
--en-tete-marges-internes-ligne: var(--espace-xl);
|
||||
--en-tete-marges-internes-bloc: var(--espace-m);
|
||||
|
||||
/* Dimensions */
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
#pied-de-page {
|
||||
/* Marges */
|
||||
--pied-de-page-marges-internes-bloc: var(--espace-m);
|
||||
--pied-de-page-marges-internes-ligne: var(--espace-l);
|
||||
--pied-de-page-marges-internes-ligne: var(--espace-xl);
|
||||
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
|
|
|
|||
|
|
@ -3,15 +3,18 @@
|
|||
.produits-similaires {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, 1fr);
|
||||
grid-template-rows: 1fr max-content;
|
||||
grid-template-rows: 1fr auto;
|
||||
grid-template-areas:
|
||||
"en-tete en-tete en-tete"
|
||||
"produits produits produits";
|
||||
place-items: center;
|
||||
margin-top: 1rem;
|
||||
margin-top: var(--espace-m);
|
||||
|
||||
/* En-tête de la section */
|
||||
header {
|
||||
grid-column: span 3;
|
||||
grid-area: en-tete;
|
||||
width: 100%;
|
||||
padding: 1.25rem 0 var(--espace-m);
|
||||
padding: var(--espace-l) 0 var(--espace-m);
|
||||
text-align: center;
|
||||
border: 1px solid var(--couleur-noir);
|
||||
|
||||
|
|
@ -26,10 +29,10 @@
|
|||
.grille-produits-similaires {
|
||||
display: grid;
|
||||
grid-auto-rows: 1fr;
|
||||
grid-column: span 3;
|
||||
grid-row: 2;
|
||||
grid-area: produits;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
gap: 1px;
|
||||
width: 100%;
|
||||
|
||||
article {
|
||||
box-shadow: 0 0 0 1px var(--couleur-noir); /* 2 */
|
||||
|
|
@ -37,8 +40,8 @@
|
|||
figure {
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
row-gap: 2rem;
|
||||
padding: 1rem;
|
||||
row-gap: var(--espace-xl);
|
||||
padding: var(--espace-m);
|
||||
|
||||
a {
|
||||
position: relative;
|
||||
|
|
@ -81,7 +84,7 @@
|
|||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 2rem;
|
||||
margin-bottom: var(--espace-xl);
|
||||
|
||||
h3 {
|
||||
font-style: italic;
|
||||
|
|
|
|||
|
|
@ -5,11 +5,11 @@
|
|||
<figure>
|
||||
<a href="{{ produit.url }}">
|
||||
<picture class="produit__illustration produit__illustration__principale">
|
||||
{{ produit.premiere_photo_gauche }}
|
||||
{{ produit.photo_repos }}
|
||||
</picture>
|
||||
|
||||
<picture class="produit__illustration produit__illustration__survol">
|
||||
{{ produit.premiere_photo_droite }}
|
||||
{{ produit.photo_survol }}
|
||||
</picture>
|
||||
</a>
|
||||
|
||||
|
|
|
|||
|
|
@ -5,11 +5,11 @@
|
|||
<figure>
|
||||
<a href="{{ produit.url }}">
|
||||
<picture class="produit__illustration produit__illustration__principale">
|
||||
{{ produit.premiere_photo_gauche }}
|
||||
{{ produit.photo_repos }}
|
||||
</picture>
|
||||
|
||||
<picture class="produit__illustration produit__illustration__survol">
|
||||
{{ produit.premiere_photo_droite }}
|
||||
{{ produit.photo_survol }}
|
||||
</picture>
|
||||
</a>
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue