2026-05-06
- corvée(gitignore) exclus les fichiers CSS compilés
This commit is contained in:
parent
67f96263df
commit
2ef5fbba66
102 changed files with 996 additions and 209370 deletions
File diff suppressed because it is too large
Load diff
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -1 +0,0 @@
|
|||
{"version":3,"sourceRoot":"","sources":["../../../src/sass/pages/page-404.scss"],"names":[],"mappings":"AAEA;EAEE;EAGA;EAEA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAKN;EACE;IACE;IACA","file":"page-404.css"}
|
||||
|
|
@ -1,115 +0,0 @@
|
|||
@charset "UTF-8";
|
||||
#page-a-propos {
|
||||
--hauteur-conteneur: var(--contenu-page-hauteur-minimale-sans-categories);
|
||||
--page-marges-bloc-debut: var(--en-tete-hauteur);
|
||||
--conteneur-marges-internes-ligne: var(--espace-xl);
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
min-block-size: var(--hauteur-conteneur);
|
||||
max-block-size: var(--hauteur-conteneur);
|
||||
margin-top: var(--page-marges-bloc-debut);
|
||||
}
|
||||
#page-a-propos .storytelling {
|
||||
overflow-y: scroll;
|
||||
overscroll-behavior: none;
|
||||
min-block-size: inherit;
|
||||
max-block-size: inherit;
|
||||
}
|
||||
#page-a-propos .storytelling__conteneur {
|
||||
overscroll-behavior: inherit;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
place-items: center;
|
||||
min-block-size: calc(var(--hauteur-conteneur) * 13);
|
||||
padding: 0 var(--conteneur-marges-internes-ligne);
|
||||
}
|
||||
#page-a-propos .storytelling__animation {
|
||||
--hauteur-animation: 90px;
|
||||
--taille-police: calc(var(--espace-xl) * 2.5);
|
||||
pointer-events: none;
|
||||
position: absolute;
|
||||
z-index: 3;
|
||||
top: 0;
|
||||
right: 0;
|
||||
left: 0;
|
||||
overflow: hidden;
|
||||
display: grid;
|
||||
place-content: center;
|
||||
place-items: center;
|
||||
block-size: 100%;
|
||||
margin: auto;
|
||||
visibility: visible;
|
||||
opacity: 100%;
|
||||
mask-image: linear-gradient(var(--mask-direction, to right), hsla(0, 0%, 0%, 0), hsl(0, 0%, 0%) 20%, hsl(0, 0%, 0%) 80%, hsla(0, 0%, 0%, 0));
|
||||
transition: 1s opacity ease-in-out, 1s visibility ease-in-out;
|
||||
}
|
||||
#page-a-propos .storytelling__animation[hidden] {
|
||||
display: grid !important;
|
||||
visibility: hidden;
|
||||
opacity: 0%;
|
||||
transition: 1s opacity ease-in-out, 1s visibility ease-in-out;
|
||||
}
|
||||
#page-a-propos .storytelling__animation.no-js {
|
||||
visibility: hidden;
|
||||
opacity: 0%;
|
||||
transition: 1s opacity ease-in-out, 1s visibility ease-in-out;
|
||||
}
|
||||
#page-a-propos .storytelling__animation .animation-conteneur {
|
||||
overflow: visible;
|
||||
width: 120vw;
|
||||
block-size: var(--hauteur-animation);
|
||||
}
|
||||
#page-a-propos .storytelling__animation .animation-texte {
|
||||
overflow: visible;
|
||||
font-size: var(--taille-police);
|
||||
font-weight: 600;
|
||||
text-shadow: 4px 4px 0 var(--couleur-blanc);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: var(--espacement-inter-lettres-rapproche-s);
|
||||
}
|
||||
#page-a-propos .storytelling__image {
|
||||
position: sticky;
|
||||
top: 0;
|
||||
align-content: center;
|
||||
inline-size: max-content;
|
||||
max-inline-size: 100%;
|
||||
min-block-size: var(--hauteur-conteneur);
|
||||
max-block-size: var(--hauteur-conteneur);
|
||||
}
|
||||
#page-a-propos .storytelling__image[data-caché] {
|
||||
display: none !important;
|
||||
}
|
||||
#page-a-propos .storytelling__image picture {
|
||||
max-block-size: inherit;
|
||||
}
|
||||
#page-a-propos .storytelling__image img {
|
||||
scale: 0.95;
|
||||
max-block-size: inherit;
|
||||
margin: auto;
|
||||
object-fit: contain;
|
||||
background: transparent;
|
||||
}
|
||||
@media (scripting: none) {
|
||||
#page-a-propos .storytelling__animation {
|
||||
visibility: hidden;
|
||||
}
|
||||
}
|
||||
@media (width <= 700px) {
|
||||
#page-a-propos {
|
||||
--conteneur-marges-internes-ligne: var(--espace-l);
|
||||
}
|
||||
}
|
||||
@media (width <= 500px) {
|
||||
#page-a-propos {
|
||||
--conteneur-marges-internes-ligne: var(--espace-m);
|
||||
}
|
||||
}
|
||||
|
||||
@supports (-moz-appearance: none) {
|
||||
#page-a-propos .storytelling__animation {
|
||||
--taille-police: calc(var(--espace-xl) * 2.2);
|
||||
}
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=page-a-propos.css.map */
|
||||
|
|
@ -1 +0,0 @@
|
|||
{"version":3,"sourceRoot":"","sources":["../../../src/sass/pages/page-a-propos.scss"],"names":[],"mappings":";AAEA;EAEE;EAGA;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAIF;EACE;EACA;EAEA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EAOA;;AAEA;EACE;EACA;EACA;EACA;;AAIF;EACE;EACA;EACA;;AAGF;EACE;EAIA;EACA;;AAGF;EACE;EAGA;EACA;EAGA;EACA;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAMN;EACE;IACE;;;AAIJ;EAjIF;IAkII;;;AAGF;EArIF;IAsII;;;;AAKJ;EACE;IACE","file":"page-a-propos.css"}
|
||||
|
|
@ -1 +0,0 @@
|
|||
#page-a-propos{--hauteur-conteneur:var(--contenu-page-hauteur-minimale-sans-categories);--page-marges-bloc-debut:var(--en-tete-hauteur);--conteneur-marges-internes-ligne:var(--espace-xl);min-block-size:var(--hauteur-conteneur);max-block-size:var(--hauteur-conteneur);margin-top:var(--page-marges-bloc-debut);flex-flow:column;display:flex;overflow:hidden}#page-a-propos .storytelling{overscroll-behavior:none;min-block-size:inherit;max-block-size:inherit;overflow-y:scroll}#page-a-propos .storytelling__conteneur{overscroll-behavior:inherit;min-block-size:calc(var(--hauteur-conteneur) * 13);padding:0 var(--conteneur-marges-internes-ligne);flex-flow:column;place-items:center;display:flex}#page-a-propos .storytelling__animation{--hauteur-animation:90px;--taille-police:calc(var(--espace-xl) * 2.5);pointer-events:none;z-index:3;visibility:visible;opacity:1;block-size:100%;mask-image:linear-gradient(var(--mask-direction,to right), #0000, #000 20%, #000 80%, #0000);place-content:center;place-items:center;margin:auto;transition:opacity 1s ease-in-out,visibility 1s ease-in-out;display:grid;position:absolute;top:0;left:0;right:0;overflow:hidden}#page-a-propos .storytelling__animation[hidden]{visibility:hidden;opacity:0;transition:opacity 1s ease-in-out,visibility 1s ease-in-out;display:grid!important}#page-a-propos .storytelling__animation.no-js{visibility:hidden;opacity:0;transition:opacity 1s ease-in-out,visibility 1s ease-in-out}#page-a-propos .storytelling__animation .animation-conteneur{width:120vw;block-size:var(--hauteur-animation);overflow:visible}#page-a-propos .storytelling__animation .animation-texte{font-size:var(--taille-police);text-shadow:4px 4px 0 var(--couleur-blanc);text-transform:uppercase;letter-spacing:var(--espacement-inter-lettres-rapproche-s);font-weight:600;overflow:visible}#page-a-propos .storytelling__image{inline-size:max-content;max-inline-size:100%;min-block-size:var(--hauteur-conteneur);max-block-size:var(--hauteur-conteneur);align-content:center;position:sticky;top:0}#page-a-propos .storytelling__image[data-caché]{display:none!important}#page-a-propos .storytelling__image picture{max-block-size:inherit}#page-a-propos .storytelling__image img{max-block-size:inherit;object-fit:contain;background:0 0;margin:auto;scale:.95}@media (scripting:none){#page-a-propos .storytelling__animation{visibility:hidden}}@media (width<=700px){#page-a-propos{--conteneur-marges-internes-ligne:var(--espace-l)}}@media (width<=500px){#page-a-propos{--conteneur-marges-internes-ligne:var(--espace-m)}}@supports ((-moz-appearance:none)){#page-a-propos .storytelling__animation{--taille-police:calc(var(--espace-xl) * 2.2)}}
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
#page-accueil {
|
||||
--hauteur-conteneur: calc(100svh - var(--pied-de-page-hauteur));
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
min-block-size: var(--hauteur-conteneur);
|
||||
max-block-size: var(--hauteur-conteneur);
|
||||
}
|
||||
|
||||
/* # sourceMappingURL=page-accueil.css.map */
|
||||
|
|
@ -1 +0,0 @@
|
|||
{"version":3,"sourceRoot":"","sources":["../../../src/sass/pages/page-accueil.scss"],"names":[],"mappings":"AAEA;EAEE;EAEA;EACA;EACA;EACA;EACA","file":"page-accueil.css"}
|
||||
|
|
@ -1 +0,0 @@
|
|||
#page-accueil{--hauteur-conteneur:calc(100svh - var(--pied-de-page-hauteur));min-block-size:var(--hauteur-conteneur);max-block-size:var(--hauteur-conteneur);flex-flow:column;display:flex;overflow:hidden}
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
#page-boutique .actions {
|
||||
align-content: center;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
}
|
||||
#page-boutique .actions button {
|
||||
padding: var(--espace-xl) 0;
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=page-boutique.css.map */
|
||||
|
|
@ -1 +0,0 @@
|
|||
{"version":3,"sourceRoot":"","sources":["../../../src/sass/pages/page-boutique.scss"],"names":[],"mappings":"AAGE;EACE;EACA;EACA;;AAEA;EACE","file":"page-boutique.css"}
|
||||
|
|
@ -1 +0,0 @@
|
|||
#page-boutique .actions{text-align:center;align-content:center;width:100%}#page-boutique .actions button{padding:var(--espace-xl) 0}
|
||||
|
|
@ -1 +0,0 @@
|
|||
{"version":3,"sourceRoot":"","sources":["../../../src/sass/pages/page-contact.scss"],"names":[],"mappings":"AAEA;EAEE;AAAA;AAAA;EAKA;EAEA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAKN;EACE;IACE;IACA","file":"page-contact.css"}
|
||||
|
|
@ -1,54 +0,0 @@
|
|||
#page-contact {
|
||||
--page-hauteur-minimale: calc(
|
||||
100svh - var(--en-tete-hauteur) - var(--pied-de-page-hauteur) - var(--espace-xl) - 1px
|
||||
);
|
||||
--page-marges-bloc-debut: var(--en-tete-hauteur);
|
||||
margin-top: var(--page-marges-bloc-debut);
|
||||
margin-bottom: var(--espace-xl);
|
||||
border-bottom: 1px solid var(--couleur-noir);
|
||||
flex-flow: column;
|
||||
display: flex;
|
||||
}
|
||||
#page-contact .contenu {
|
||||
width: min(50rem, 100%);
|
||||
min-height: var(--page-hauteur-minimale);
|
||||
border: 1px solid var(--couleur-noir);
|
||||
border-bottom: initial;
|
||||
flex-flow: column;
|
||||
place-items: center;
|
||||
margin: auto;
|
||||
font-style: italic;
|
||||
font-weight: 500;
|
||||
display: flex;
|
||||
}
|
||||
#page-contact .contenu__en-tete {
|
||||
width: 100%;
|
||||
padding: var(--espace-m) var(--espace-xl);
|
||||
color: var(--couleur-blanc);
|
||||
background: var(--couleur-noir);
|
||||
}
|
||||
#page-contact .contenu__en-tete h2 {
|
||||
text-transform: uppercase;
|
||||
width: fit-content;
|
||||
letter-spacing: var(--espacement-inter-lettres-etendu-l);
|
||||
margin: auto;
|
||||
}
|
||||
#page-contact .contenu__textuel {
|
||||
max-width: 34rem;
|
||||
height: 100%;
|
||||
padding: 0 var(--espace-xl);
|
||||
text-wrap: pretty;
|
||||
flex-flow: column;
|
||||
flex: 1;
|
||||
place-content: center;
|
||||
display: flex;
|
||||
}
|
||||
#page-contact .contenu__textuel p + p {
|
||||
margin-top: var(--espace-m);
|
||||
}
|
||||
@media (width <= 50rem) {
|
||||
#page-contact .contenu {
|
||||
border-right: initial;
|
||||
border-left: initial;
|
||||
}
|
||||
}
|
||||
|
|
@ -1,97 +0,0 @@
|
|||
.page-modele-simple {
|
||||
--page-hauteur-minimale: calc(
|
||||
100svh - var(--en-tete-hauteur) - var(--pied-de-page-hauteur) - var(--espace-xl) - 1px
|
||||
);
|
||||
--page-marges-bloc-debut: var(--en-tete-hauteur);
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
margin-top: var(--page-marges-bloc-debut);
|
||||
margin-bottom: var(--espace-xl);
|
||||
border-bottom: 1px solid var(--couleur-noir);
|
||||
}
|
||||
.page-modele-simple .contenu {
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
place-items: center;
|
||||
width: min(50rem, 100%);
|
||||
min-height: var(--page-hauteur-minimale);
|
||||
margin: auto;
|
||||
border: 1px solid var(--couleur-noir);
|
||||
border-bottom: initial;
|
||||
font-weight: 400;
|
||||
font-style: italic;
|
||||
}
|
||||
.page-modele-simple .contenu__en-tete {
|
||||
width: 100%;
|
||||
padding: var(--espace-m) var(--espace-xl);
|
||||
color: var(--couleur-blanc);
|
||||
background: var(--couleur-noir);
|
||||
}
|
||||
.page-modele-simple .contenu__en-tete h2 {
|
||||
width: fit-content;
|
||||
margin: auto;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: var(--espacement-inter-lettres-etendu-l);
|
||||
}
|
||||
.page-modele-simple .contenu__textuel {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
flex-flow: column nowrap;
|
||||
place-content: center;
|
||||
max-width: 34rem;
|
||||
height: 100%;
|
||||
padding: 0 var(--espace-xl);
|
||||
text-wrap: pretty;
|
||||
}
|
||||
.page-modele-simple .contenu__textuel p + p {
|
||||
margin-top: var(--espace-m);
|
||||
}
|
||||
.page-modele-simple#page-cgv .contenu {
|
||||
font-style: normal;
|
||||
}
|
||||
.page-modele-simple#page-cgv .contenu header {
|
||||
font-style: italic;
|
||||
}
|
||||
.page-modele-simple#page-cgv .contenu__textuel {
|
||||
max-width: initial;
|
||||
padding: 0;
|
||||
}
|
||||
.page-modele-simple#page-cgv .contenu__textuel__section {
|
||||
width: 100%;
|
||||
}
|
||||
.page-modele-simple#page-cgv .contenu__textuel__section:first-of-type header {
|
||||
border-top: initial;
|
||||
}
|
||||
.page-modele-simple#page-cgv .contenu__textuel__section header {
|
||||
width: 100%;
|
||||
margin-bottom: var(--espace-l);
|
||||
padding: var(--espace-m) var(--espace-xl);
|
||||
border-top: 1px solid var(--couleur-noir);
|
||||
border-bottom: 1px solid var(--couleur-noir);
|
||||
}
|
||||
.page-modele-simple#page-cgv .contenu__textuel__section header h3 {
|
||||
width: fit-content;
|
||||
margin: auto;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: var(--espacement-inter-lettres-etendu-l);
|
||||
}
|
||||
.page-modele-simple#page-cgv .contenu__textuel__section ul {
|
||||
margin-bottom: 1lh;
|
||||
padding: 0 var(--espace-xl);
|
||||
list-style: square;
|
||||
list-style-position: inside;
|
||||
}
|
||||
.page-modele-simple#page-cgv .contenu__textuel__section p {
|
||||
padding: 0 var(--espace-xl);
|
||||
}
|
||||
.page-modele-simple#page-cgv .contenu__textuel__section p:last-of-type {
|
||||
margin-bottom: var(--espace-xl);
|
||||
}
|
||||
@media (width <= 50rem) {
|
||||
.page-modele-simple .contenu {
|
||||
border-right: initial;
|
||||
border-left: initial;
|
||||
}
|
||||
}
|
||||
|
||||
/* # sourceMappingURL=page-modele-simple.css.map */
|
||||
|
|
@ -1 +0,0 @@
|
|||
{"version":3,"sourceRoot":"","sources":["../../../src/sass/pages/page-modele-simple.scss"],"names":[],"mappings":"AAEA;EAEE;AAAA;AAAA;EAKA;EAEA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAMJ;EACE;;AAEA;EACE;;AAGF;EACE;EACA;;AAEA;EACE;;AAGE;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;EACA;;AAKF;EACE;;AAEA;EACE;;AAQZ;EACE;IACE;IACA","file":"page-modele-simple.css"}
|
||||
|
|
@ -1 +0,0 @@
|
|||
.page-modele-simple{--page-hauteur-minimale:calc(100svh - var(--en-tete-hauteur) - var(--pied-de-page-hauteur) - var(--espace-xl) - 1px);--page-marges-bloc-debut:var(--en-tete-hauteur);margin-top:var(--page-marges-bloc-debut);margin-bottom:var(--espace-xl);border-bottom:1px solid var(--couleur-noir);flex-flow:column;display:flex}.page-modele-simple .contenu{width:min(50rem,100%);min-height:var(--page-hauteur-minimale);border:1px solid var(--couleur-noir);border-bottom:initial;flex-flow:column;place-items:center;margin:auto;font-style:italic;font-weight:400;display:flex}.page-modele-simple .contenu__en-tete{width:100%;padding:var(--espace-m) var(--espace-xl);color:var(--couleur-blanc);background:var(--couleur-noir)}.page-modele-simple .contenu__en-tete h2{text-transform:uppercase;width:fit-content;letter-spacing:var(--espacement-inter-lettres-etendu-l);margin:auto}.page-modele-simple .contenu__textuel{max-width:34rem;height:100%;padding:0 var(--espace-xl);text-wrap:pretty;flex-flow:column;flex:1;place-content:center;display:flex}.page-modele-simple .contenu__textuel p+p{margin-top:var(--espace-m)}.page-modele-simple#page-cgv .contenu{font-style:normal}.page-modele-simple#page-cgv .contenu header{font-style:italic}.page-modele-simple#page-cgv .contenu__textuel{max-width:initial;padding:0}.page-modele-simple#page-cgv .contenu__textuel__section{width:100%}.page-modele-simple#page-cgv .contenu__textuel__section:first-of-type header{border-top:initial}.page-modele-simple#page-cgv .contenu__textuel__section header{width:100%;margin-bottom:var(--espace-l);padding:var(--espace-m) var(--espace-xl);border-top:1px solid var(--couleur-noir);border-bottom:1px solid var(--couleur-noir)}.page-modele-simple#page-cgv .contenu__textuel__section header h3{text-transform:uppercase;width:fit-content;letter-spacing:var(--espacement-inter-lettres-etendu-l);margin:auto}.page-modele-simple#page-cgv .contenu__textuel__section ul{padding:0 var(--espace-xl);margin-bottom:1lh;list-style:inside square}.page-modele-simple#page-cgv .contenu__textuel__section p{padding:0 var(--espace-xl)}.page-modele-simple#page-cgv .contenu__textuel__section p:last-of-type{margin-bottom:var(--espace-xl)}@media (width<=50rem){.page-modele-simple .contenu{border-right:initial;border-left:initial}}
|
||||
|
|
@ -1,445 +0,0 @@
|
|||
@charset "UTF-8";
|
||||
#panneau-panier {
|
||||
border-right: 1px solid var(--couleur-noir);
|
||||
}
|
||||
#panneau-panier > div {
|
||||
place-content: center;
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits {
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits__produit {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-template-rows: 1fr;
|
||||
border-bottom: 1px solid var(--couleur-noir);
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits__produit__illustratif {
|
||||
border-right: 1px solid var(--couleur-noir);
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits__produit__illustratif picture {
|
||||
overflow: hidden;
|
||||
height: 100%;
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits__produit__illustratif img {
|
||||
aspect-ratio: 1;
|
||||
height: auto;
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits .detail-produit {
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
place-content: center;
|
||||
width: fit-content;
|
||||
margin: auto;
|
||||
padding: 0 var(--espace-xl);
|
||||
font-style: italic;
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits .detail-produit__nom-prix {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
column-gap: var(--espace-l);
|
||||
justify-content: space-between;
|
||||
font-size: var(--espace-l);
|
||||
line-height: var(--hauteur-ligne-moitie);
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits .detail-produit__nom-prix span {
|
||||
min-width: 4rem;
|
||||
font-weight: 600;
|
||||
font-style: initial;
|
||||
text-align: right;
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits .detail-produit__description {
|
||||
margin-bottom: var(--espace-l);
|
||||
text-transform: lowercase;
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits .detail-produit__actions {
|
||||
display: grid;
|
||||
grid-template-columns: 0.25fr auto 0.25fr;
|
||||
grid-template-rows: 1fr 1fr;
|
||||
font-weight: 500;
|
||||
font-style: initial;
|
||||
/* Bouton d'addition de quantité */
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits .detail-produit__actions button:first-of-type {
|
||||
grid-column: 1;
|
||||
min-width: 3rem;
|
||||
max-width: 3rem;
|
||||
border: 1px solid var(--couleur-noir);
|
||||
border-bottom: initial;
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits .detail-produit__actions {
|
||||
/*
|
||||
* 1. Cache les flèches d'augmentation/diminution sur Firefox.
|
||||
* 2. Cache les flèches d'augmentation/diminution sur Chrome/Edge/Safari.
|
||||
*/
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits .detail-produit__actions input[type=number] {
|
||||
grid-column: 2;
|
||||
width: 100%;
|
||||
border: initial;
|
||||
border-top: 1px solid var(--couleur-noir);
|
||||
text-align: center;
|
||||
appearance: textfield; /* 1 */
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits .detail-produit__actions input[type=number]::-webkit-outer-spin-button, #panneau-panier .panneau__grille-produits .detail-produit__actions input[type=number]::-webkit-inner-spin-button {
|
||||
margin: 0; /* 2 */
|
||||
appearance: none; /* 2 */
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits .detail-produit__actions {
|
||||
/* Bouton de suppression de quantité */
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits .detail-produit__actions button:nth-of-type(2) {
|
||||
grid-column: 3;
|
||||
min-width: 3rem;
|
||||
max-width: 3rem;
|
||||
border: 1px solid var(--couleur-noir);
|
||||
border-bottom: initial;
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits .detail-produit__actions {
|
||||
/* Bouton de suppression du Produit du Panier */
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits .detail-produit__actions button:last-of-type {
|
||||
grid-column: span 3;
|
||||
grid-row: 2;
|
||||
padding: var(--espace-xs);
|
||||
border: 1px solid var(--couleur-noir);
|
||||
text-transform: lowercase;
|
||||
}
|
||||
#panneau-panier .panneau__instructions-code-promo {
|
||||
width: 100%;
|
||||
padding: var(--espace-l) var(--espace-xl);
|
||||
border-bottom: 1px solid var(--couleur-noir);
|
||||
text-align: center;
|
||||
/*
|
||||
* 1. Nécessaire pour ne pas qu'un espace vertical non souhaité apparaisse.
|
||||
* 2. Applique une marge entre les instructions et le code promo de notre choix.
|
||||
*/
|
||||
}
|
||||
#panneau-panier .panneau__instructions-code-promo__instructions {
|
||||
resize: vertical;
|
||||
display: block; /* 1 */
|
||||
width: 100%;
|
||||
margin: auto; /* 1 */
|
||||
margin-bottom: var(--espace-s); /* 2 */
|
||||
padding: var(--espace-s);
|
||||
border: 1px solid transparent;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 450;
|
||||
background: initial;
|
||||
}
|
||||
#panneau-panier .panneau__instructions-code-promo__code-promo {
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
place-content: center;
|
||||
width: fit-content;
|
||||
margin: auto;
|
||||
/*
|
||||
* 1. Longueur minimale pour le Bouton n'ait pas à changer de taille quel que soit son texte
|
||||
*/
|
||||
}
|
||||
#panneau-panier .panneau__instructions-code-promo__code-promo button {
|
||||
min-width: 9rem; /* 1 */
|
||||
padding: var(--espace-xs) var(--espace-xl);
|
||||
border: 1px solid var(--couleur-noir);
|
||||
border-left: initial;
|
||||
text-transform: lowercase;
|
||||
}
|
||||
#panneau-panier .panneau__instructions-code-promo__code-promo__message {
|
||||
flex-basis: 100%;
|
||||
margin-top: var(--espace-m);
|
||||
}
|
||||
#panneau-panier .panneau__sous-totaux {
|
||||
width: min(40rem, 100%);
|
||||
margin: auto;
|
||||
padding: var(--espace-l) var(--espace-xl);
|
||||
text-align: center;
|
||||
}
|
||||
#panneau-panier .panneau__sous-totaux__ligne {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
justify-content: space-between;
|
||||
font-style: italic;
|
||||
}
|
||||
#panneau-panier .panneau__sous-totaux__ligne strong {
|
||||
text-align: right;
|
||||
text-transform: lowercase;
|
||||
}
|
||||
#panneau-panier .panneau__sous-totaux__ligne#sous-total-livraison p:last-of-type {
|
||||
text-align: right;
|
||||
}
|
||||
#panneau-panier .panneau__sous-totaux__ligne#sous-total-livraison p:last-of-type span {
|
||||
color: var(--couleur-gris-fonce);
|
||||
}
|
||||
#panneau-panier .panneau__sous-totaux__choix-methode-livraison {
|
||||
flex-flow: row wrap;
|
||||
gap: var(--espace-xs) var(--espace-m);
|
||||
justify-content: center;
|
||||
font-size: 0.9rem;
|
||||
letter-spacing: inherit;
|
||||
}
|
||||
#panneau-panier .panneau__sous-totaux__choix-methode-livraison > label:first-of-type {
|
||||
cursor: revert;
|
||||
flex-basis: 100%;
|
||||
margin-bottom: var(--espace-xs);
|
||||
color: var(--couleur-gris-fonce);
|
||||
text-align: center;
|
||||
text-transform: lowercase;
|
||||
}
|
||||
#panneau-panier .panneau__sous-totaux__choix-methode-livraison div {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
column-gap: 1ch;
|
||||
place-items: center;
|
||||
}
|
||||
#panneau-panier .panneau__sous-totaux__conditions-livraison {
|
||||
margin-top: var(--espace-l);
|
||||
font-size: 0.8rem;
|
||||
font-weight: 450;
|
||||
color: var(--couleur-gris-fonce);
|
||||
letter-spacing: var(--espacement-inter-lettres-etendu-s);
|
||||
}
|
||||
#panneau-panier .panneau__pied-de-page {
|
||||
align-content: center;
|
||||
padding: var(--espace-l) 0;
|
||||
font-size: 1.25rem;
|
||||
font-style: italic;
|
||||
color: var(--couleur-blanc);
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 2px;
|
||||
background: var(--couleur-noir);
|
||||
}
|
||||
#panneau-panier .panneau__pied-de-page span {
|
||||
margin-left: var(--espace-l);
|
||||
font-style: initial;
|
||||
}
|
||||
@media (width <= 500px) {
|
||||
#panneau-panier .panneau__grille-produits__produit__illustratif img {
|
||||
height: 100%;
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits .detail-produit {
|
||||
padding: var(--espace-l);
|
||||
}
|
||||
#panneau-panier .panneau__grille-produits .detail-produit .detail-produit__nom-prix {
|
||||
column-gap: var(--espace-l);
|
||||
}
|
||||
#panneau-panier .panneau__instructions-code-promo {
|
||||
padding: var(--espace-xl) var(--espace-l);
|
||||
}
|
||||
#panneau-panier .panneau__instructions-code-promo .panneau__instructions-code-promo__code-promo input, #panneau-panier .panneau__instructions-code-promo .panneau__instructions-code-promo__code-promo button {
|
||||
flex: 1;
|
||||
}
|
||||
#panneau-panier .panneau__sous-totaux {
|
||||
padding: var(--espace-xl) var(--espace-l);
|
||||
}
|
||||
}
|
||||
|
||||
#panneau-informations-client {
|
||||
position: sticky;
|
||||
top: var(--en-tete-hauteur);
|
||||
right: 0;
|
||||
height: fit-content;
|
||||
}
|
||||
#panneau-informations-client > * {
|
||||
align-content: center;
|
||||
text-align: center;
|
||||
}
|
||||
#panneau-informations-client .panneau__paypal-express {
|
||||
--hauteur-images-bouton: 18px;
|
||||
--hauteur-bouton: calc(var(--hauteur-images-bouton) * 2);
|
||||
--longueur-bouton: 250px;
|
||||
--espacement-inter-images: var(--espace-xs);
|
||||
padding: var(--espace-xl);
|
||||
border-bottom: 1px solid var(--couleur-noir);
|
||||
}
|
||||
#panneau-informations-client .panneau__paypal-express p {
|
||||
margin-bottom: var(--espace-s);
|
||||
font-style: italic;
|
||||
}
|
||||
#panneau-informations-client .panneau__paypal-express button {
|
||||
display: flex;
|
||||
column-gap: var(--espacement-inter-images);
|
||||
place-content: center;
|
||||
place-items: center;
|
||||
width: var(--longueur-bouton);
|
||||
height: var(--hauteur-bouton);
|
||||
margin: auto;
|
||||
background: var(--couleur-noir);
|
||||
}
|
||||
#panneau-informations-client .panneau__paypal-express button img {
|
||||
height: var(--hauteur-images-bouton);
|
||||
background: inherit;
|
||||
}
|
||||
#panneau-informations-client .panneau__paypal-express button img:first-of-type {
|
||||
margin-top: -1px;
|
||||
}
|
||||
#panneau-informations-client .panneau__formulaires {
|
||||
padding: var(--espace-xl) 0;
|
||||
}
|
||||
#panneau-informations-client .panneau__formulaires .panneau__formulaires__separation-adresses {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
column-gap: 1ch;
|
||||
place-items: center;
|
||||
width: fit-content;
|
||||
margin: auto;
|
||||
margin-bottom: var(--espace-m);
|
||||
font-size: 0.8rem;
|
||||
font-style: italic;
|
||||
}
|
||||
#panneau-informations-client .panneau__formulaires .panneau__formulaires__separation-adresses label {
|
||||
text-transform: lowercase;
|
||||
}
|
||||
#panneau-informations-client .panneau__formulaires .panneau__formulaires__paiement .formulaire__paiement__attente-renseignement-formulaires {
|
||||
align-content: center;
|
||||
width: 100%;
|
||||
padding: 0;
|
||||
font-size: 0.8rem;
|
||||
font-weight: 450;
|
||||
color: var(--couleur-gris-fonce);
|
||||
text-align: center;
|
||||
}
|
||||
#panneau-informations-client .panneau__formulaires .panneau__formulaires__paiement .formulaire__paiement__attente-renseignement-formulaires p + p {
|
||||
margin-top: 1lh;
|
||||
}
|
||||
#panneau-informations-client .panneau__formulaires .panneau__formulaires__message {
|
||||
margin: var(--espace-xl) 0;
|
||||
font-weight: 500;
|
||||
font-style: italic;
|
||||
}
|
||||
#panneau-informations-client .formulaire {
|
||||
margin: auto;
|
||||
padding: 0 var(--espace-xl);
|
||||
}
|
||||
#panneau-informations-client .formulaire + .formulaire {
|
||||
margin-top: var(--espace-xl);
|
||||
}
|
||||
#panneau-informations-client .formulaire .formulaire__titre {
|
||||
margin-bottom: var(--espace-m);
|
||||
font-size: 1.25rem;
|
||||
font-weight: 600;
|
||||
font-style: italic;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
#panneau-informations-client .formulaire .formulaire__champs {
|
||||
width: fit-content;
|
||||
margin: auto;
|
||||
text-align: left;
|
||||
}
|
||||
#panneau-informations-client .formulaire .formulaire__champs .formulaire__champs__champ {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
column-gap: var(--espace-xl);
|
||||
place-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
#panneau-informations-client .formulaire .formulaire__champs .formulaire__champs__champ + .formulaire__champs__champ {
|
||||
margin-top: var(--espace-l);
|
||||
}
|
||||
#panneau-informations-client .formulaire label {
|
||||
width: min(7rem, 100%);
|
||||
font-weight: 400;
|
||||
text-transform: lowercase;
|
||||
}
|
||||
#panneau-informations-client .formulaire label:has(+ :is(input:required, select:required)) {
|
||||
font-weight: 600;
|
||||
}
|
||||
#panneau-informations-client .formulaire input, #panneau-informations-client .formulaire select {
|
||||
width: min(15rem, 100%);
|
||||
}
|
||||
#panneau-informations-client .panneau__pied-de-page {
|
||||
align-content: center;
|
||||
font-size: 1.25rem;
|
||||
font-style: italic;
|
||||
color: var(--couleur-blanc);
|
||||
text-align: center;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 2px;
|
||||
border-block: 1px solid var(--couleur-noir);
|
||||
border-block-end: 0;
|
||||
background: var(--arriere-plan-points);
|
||||
}
|
||||
#panneau-informations-client .panneau__pied-de-page:has(button[disabled]) {
|
||||
background: var(--couleur-gris-fond);
|
||||
}
|
||||
#panneau-informations-client .panneau__pied-de-page button {
|
||||
padding: var(--espace-l) 0;
|
||||
}
|
||||
@media (hover: hover) {
|
||||
#panneau-informations-client .panneau__pied-de-page button:not([disabled]):hover {
|
||||
font-weight: 600;
|
||||
color: var(--couleur-blanc);
|
||||
background: var(--couleur-gris-fonce-fond);
|
||||
}
|
||||
}
|
||||
@media (width <= 500px) {
|
||||
#panneau-informations-client .panneau__formulaires {
|
||||
padding: var(--espace-xl) 0;
|
||||
}
|
||||
}
|
||||
|
||||
/*
|
||||
* 1. Applique une marge supérieure égale à la hauteur de l'en-tête pour qu'elle puisse s'afficher
|
||||
* correctement.
|
||||
*/
|
||||
#page-panier {
|
||||
/* Dimensions */
|
||||
--menu-section-hauteur: var(--menu-categories-produits-hauteur);
|
||||
/* Marges */
|
||||
--menu-section-marges-bloc-debut: var(--en-tete-hauteur); /* 1 */
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-flow: row wrap;
|
||||
min-height: calc(100svh - var(--en-tete-hauteur) - var(--pied-de-page-hauteur));
|
||||
margin-top: var(--menu-section-marges-bloc-debut);
|
||||
}
|
||||
#page-panier .panneau {
|
||||
flex: 1 1 30rem;
|
||||
border-top: 1px solid var(--couleur-noir);
|
||||
border-bottom: 1px solid var(--couleur-noir);
|
||||
}
|
||||
#page-panier .panneau__en-tete {
|
||||
position: sticky;
|
||||
z-index: 2;
|
||||
top: var(--menu-section-marges-bloc-debut);
|
||||
display: block;
|
||||
align-content: center;
|
||||
min-height: var(--menu-categories-produits-hauteur);
|
||||
max-height: var(--menu-categories-produits-hauteur);
|
||||
color: var(--couleur-gris);
|
||||
text-align: center;
|
||||
background: var(--couleur-noir);
|
||||
}
|
||||
#page-panier .panneau__en-tete h2 {
|
||||
font-weight: 450;
|
||||
font-style: italic;
|
||||
color: var(--couleur-gris);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 1px;
|
||||
background: var(--couleur-noir);
|
||||
}
|
||||
#page-panier .panier-vide {
|
||||
display: none;
|
||||
flex-basis: 100%;
|
||||
align-content: center;
|
||||
min-height: calc(100svh - var(--en-tete-hauteur) - var(--pied-de-page-hauteur));
|
||||
text-align: center;
|
||||
}
|
||||
#page-panier .panier-vide p {
|
||||
font-size: 1.25rem;
|
||||
}
|
||||
#page-panier .panier-vide a {
|
||||
display: inline-block;
|
||||
margin-top: var(--espace-m);
|
||||
font-size: initial;
|
||||
}
|
||||
#page-panier[data-contient-articles=false] .panneau {
|
||||
display: none;
|
||||
}
|
||||
#page-panier[data-contient-articles=false] .panier-vide {
|
||||
display: block;
|
||||
}
|
||||
|
||||
/*# sourceMappingURL=page-panier.css.map */
|
||||
|
|
@ -1 +0,0 @@
|
|||
{"version":3,"sourceRoot":"","sources":["../../../src/sass/layouts/_panneau-panier.scss","../../../src/sass/layouts/_panneau-informations-client.scss","../../../src/sass/pages/page-panier.scss"],"names":[],"mappings":";AAEA;EACE;;AAEA;EACE;;AAIF;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAGA;EACE;;AAEA;EACE;EACA;;AAGF;EACE;EACA;;AAMN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAIJ;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;AAEA;;AACA;EACE;EACA;EACA;EACA;EACA;;AAbJ;AAgBE;AAAA;AAAA;AAAA;;AAIA;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AA9BN;AAkCE;;AACA;EACE;EACA;EACA;EACA;EACA;;AAxCJ;AA2CE;;AACA;EACE;EACA;EACA;EACA;EACA;;AAOR;EACE;EACA;EACA;EACA;AAEA;AAAA;AAAA;AAAA;;AAIA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;EACA;AAEA;AAAA;AAAA;;AAGA;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;;AAKN;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAKA;EACE;;AAEA;EACE;;AAMR;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAMJ;EACE;EACA;EACA;EACA;EACA;;AAKJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAIJ;EACE;IACE;;EAGF;IACE;;EAEA;IACE;;EAIJ;IACE;;EAGE;IACE;;EAKN;IACE;;;;ACpRN;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAIF;EAEE;EACA;EACA;EAGA;EAEA;EACA;;AAEA;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;;AAMN;EACE;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAKF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAGE;EACE;;AAMR;EACE;EACA;EACA;;AAIJ;EACE;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAKN;EACE;EACA;EACA;;AAEA;EACE;;AAIJ;EACE;;AAKJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGA;EACE;;AAGF;EACE;;AAGE;EACE;IACE;IACA;IACA;;;AAOV;EACE;IACE;;;;AClLN;AAAA;AAAA;AAAA;AAIA;AACE;EACA;AAEA;EACA;EAEA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAGA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAKN;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;;AAKF;EACE;;AAGF;EACE","file":"page-panier.css"}
|
||||
File diff suppressed because one or more lines are too long
|
|
@ -1,109 +0,0 @@
|
|||
#page-succes-commande {
|
||||
--page-hauteur-minimale: calc(
|
||||
100svh - var(--en-tete-hauteur) - var(--pied-de-page-hauteur) - var(--espace-xl) - 1px
|
||||
);
|
||||
--page-marges-bloc-debut: var(--en-tete-hauteur);
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
margin-top: var(--page-marges-bloc-debut);
|
||||
margin-bottom: var(--espace-xl);
|
||||
border-bottom: 1px solid var(--couleur-noir);
|
||||
}
|
||||
#page-succes-commande .contenu {
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
place-items: center;
|
||||
width: min(50rem, 100%);
|
||||
min-height: var(--page-hauteur-minimale);
|
||||
margin: auto;
|
||||
border: 1px solid var(--couleur-noir);
|
||||
border-bottom: initial;
|
||||
font-weight: 500;
|
||||
font-style: italic;
|
||||
}
|
||||
#page-succes-commande .contenu__en-tete {
|
||||
width: 100%;
|
||||
padding: var(--espace-m) var(--espace-xl);
|
||||
color: var(--couleur-blanc);
|
||||
background: var(--couleur-noir);
|
||||
}
|
||||
#page-succes-commande .contenu__en-tete h2 {
|
||||
width: fit-content;
|
||||
margin: auto;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: var(--espacement-inter-lettres-etendu-l);
|
||||
}
|
||||
#page-succes-commande .contenu__textuel {
|
||||
display: flex;
|
||||
flex: 1;
|
||||
flex-flow: column nowrap;
|
||||
place-content: center;
|
||||
max-width: 34rem;
|
||||
height: 100%;
|
||||
padding: var(--espace-xl);
|
||||
font-style: normal;
|
||||
}
|
||||
#page-succes-commande .contenu__textuel p + p {
|
||||
margin-top: var(--espace-m);
|
||||
}
|
||||
#page-succes-commande .contenu__rappel-commande {
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
border-top: 1px solid var(--couleur-noir);
|
||||
}
|
||||
#page-succes-commande .contenu__rappel-commande__produit {
|
||||
display: grid;
|
||||
grid-template-columns: 1fr 1fr;
|
||||
grid-template-rows: 1fr;
|
||||
border-bottom: 1px solid var(--couleur-noir);
|
||||
}
|
||||
#page-succes-commande .contenu__rappel-commande__produit:only-child,
|
||||
#page-succes-commande .contenu__rappel-commande__produit:last-of-type {
|
||||
border-bottom: initial;
|
||||
}
|
||||
#page-succes-commande .contenu__rappel-commande__produit__illustratif {
|
||||
border-right: 1px solid var(--couleur-noir);
|
||||
}
|
||||
#page-succes-commande .contenu__rappel-commande__produit__illustratif picture {
|
||||
overflow: hidden;
|
||||
}
|
||||
#page-succes-commande .contenu__rappel-commande__produit__illustratif img {
|
||||
aspect-ratio: 1;
|
||||
height: auto;
|
||||
}
|
||||
#page-succes-commande .contenu__rappel-commande .detail-produit {
|
||||
display: flex;
|
||||
flex-flow: column nowrap;
|
||||
place-content: center;
|
||||
width: 100%;
|
||||
padding: 0 var(--espace-xl);
|
||||
font-style: italic;
|
||||
}
|
||||
#page-succes-commande .contenu__rappel-commande .detail-produit__nom-prix {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
column-gap: var(--espace-xl);
|
||||
justify-content: space-between;
|
||||
margin-bottom: var(--espace-xs);
|
||||
font-size: var(--espace-l);
|
||||
line-height: var(--hauteur-ligne-moitie);
|
||||
}
|
||||
#page-succes-commande .contenu__rappel-commande .detail-produit__nom-prix span {
|
||||
min-width: 4rem;
|
||||
font-weight: 600;
|
||||
font-style: initial;
|
||||
text-align: right;
|
||||
}
|
||||
#page-succes-commande .contenu__rappel-commande .detail-produit__description {
|
||||
margin-bottom: var(--espace-l);
|
||||
line-height: var(--hauteur-ligne-moitie);
|
||||
text-transform: lowercase;
|
||||
}
|
||||
@media (width <= 50rem) {
|
||||
#page-succes-commande .contenu {
|
||||
border-right: initial;
|
||||
border-left: initial;
|
||||
}
|
||||
}
|
||||
|
||||
/* # sourceMappingURL=page-succes-commande.css.map */
|
||||
|
|
@ -1 +0,0 @@
|
|||
{"version":3,"sourceRoot":"","sources":["../../../src/sass/pages/page-succes-commande.scss"],"names":[],"mappings":"AAEA;EAEE;AAAA;AAAA;EAKA;EAEA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAIF;EACE;;AAEA;EACE;;AAGF;EACE;EACA;;AAMN;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAIJ;EACE;EACA;EACA;;AAMR;EACE;IACE;IACA","file":"page-succes-commande.css"}
|
||||
|
|
@ -1 +0,0 @@
|
|||
#page-succes-commande{--page-hauteur-minimale:calc(100svh - var(--en-tete-hauteur) - var(--pied-de-page-hauteur) - var(--espace-xl) - 1px);--page-marges-bloc-debut:var(--en-tete-hauteur);margin-top:var(--page-marges-bloc-debut);margin-bottom:var(--espace-xl);border-bottom:1px solid var(--couleur-noir);flex-flow:column;display:flex}#page-succes-commande .contenu{width:min(50rem,100%);min-height:var(--page-hauteur-minimale);border:1px solid var(--couleur-noir);border-bottom:initial;flex-flow:column;place-items:center;margin:auto;font-style:italic;font-weight:500;display:flex}#page-succes-commande .contenu__en-tete{width:100%;padding:var(--espace-m) var(--espace-xl);color:var(--couleur-blanc);background:var(--couleur-noir)}#page-succes-commande .contenu__en-tete h2{text-transform:uppercase;width:fit-content;letter-spacing:var(--espacement-inter-lettres-etendu-l);margin:auto}#page-succes-commande .contenu__textuel{max-width:34rem;height:100%;padding:var(--espace-xl);flex-flow:column;flex:1;place-content:center;font-style:normal;display:flex}#page-succes-commande .contenu__textuel p+p{margin-top:var(--espace-m)}#page-succes-commande .contenu__rappel-commande{border-top:1px solid var(--couleur-noir);flex-flow:column;display:flex}#page-succes-commande .contenu__rappel-commande__produit{border-bottom:1px solid var(--couleur-noir);grid-template-rows:1fr;grid-template-columns:1fr 1fr;display:grid}#page-succes-commande .contenu__rappel-commande__produit:only-child,#page-succes-commande .contenu__rappel-commande__produit:last-of-type{border-bottom:initial}#page-succes-commande .contenu__rappel-commande__produit__illustratif{border-right:1px solid var(--couleur-noir)}#page-succes-commande .contenu__rappel-commande__produit__illustratif picture{overflow:hidden}#page-succes-commande .contenu__rappel-commande__produit__illustratif img{aspect-ratio:1;height:auto}#page-succes-commande .contenu__rappel-commande .detail-produit{width:100%;padding:0 var(--espace-xl);flex-flow:column;place-content:center;font-style:italic;display:flex}#page-succes-commande .contenu__rappel-commande .detail-produit__nom-prix{column-gap:var(--espace-xl);margin-bottom:var(--espace-xs);font-size:var(--espace-l);line-height:var(--hauteur-ligne-moitie);flex-flow:row;justify-content:space-between;display:flex}#page-succes-commande .contenu__rappel-commande .detail-produit__nom-prix span{min-width:4rem;font-weight:600;font-style:initial;text-align:right}#page-succes-commande .contenu__rappel-commande .detail-produit__description{margin-bottom:var(--espace-l);line-height:var(--hauteur-ligne-moitie);text-transform:lowercase}@media (width<=50rem){#page-succes-commande .contenu{border-right:initial;border-left:initial}}
|
||||
|
|
@ -17,6 +17,7 @@ use Psl\Option\Option;
|
|||
use stdClass;
|
||||
use Timber\Timber;
|
||||
use WC_Product;
|
||||
use WP_Term;
|
||||
|
||||
use function add_action;
|
||||
use function assert;
|
||||
|
|
@ -64,8 +65,8 @@ $product_tags = $raw_product->get_tag_ids()
|
|||
id : $id,
|
||||
taxonomy: 'product_tag',
|
||||
)))
|
||||
|> (static fn(/** @var list<Option<WC_Term>> */ $tags) => Arr::reject($tags, static fn($tag) => $tag->isNone()))
|
||||
|> (static fn(/** @var list<Option<WC_Term>> */ $tags) => Arr::map($tags, static fn($tag) => $tag->unwrap()));
|
||||
|> (static fn(/** @var list<Option<WP_Term>> */ $tags) => Arr::reject($tags, static fn($tag) => $tag->isNone()))
|
||||
|> (static fn(/** @var list<Option<WP_Term>> */ $tags) => Arr::map($tags, static fn($tag) => $tag->unwrap()));
|
||||
$tags = get_terms(['taxonomy' => 'product_tag', 'hide_empty' => true]);
|
||||
|
||||
// Injecte les états initiaux des données du Produit sous forme de JSON dans le contexte.
|
||||
|
|
|
|||
|
|
@ -115,7 +115,7 @@
|
|||
}
|
||||
}
|
||||
|
||||
/* * Bouton du compte de Produits dans le Panier. */
|
||||
/* Bouton du compte de Produits dans le Panier. */
|
||||
.compte-panier {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
|
|
@ -123,13 +123,7 @@
|
|||
place-items: center;
|
||||
text-align: center;
|
||||
|
||||
&[disabled] {
|
||||
background: var(--arriere-plan-points);
|
||||
|
||||
a:hover, a:active, a:focus-within {
|
||||
border: 1px solid var(--couleur-noir);
|
||||
}
|
||||
}
|
||||
/* TODO: Utiliser un background sur .compte-panier pour varier l'apparence du bouton */
|
||||
|
||||
a {
|
||||
padding-block: var(--espace-2xs);
|
||||
|
|
@ -141,14 +135,19 @@
|
|||
background: var(--couleur-gris-fond);
|
||||
}
|
||||
|
||||
&:hover, &:focus-within {
|
||||
&:focus-visible, &:focus-within {
|
||||
background: var(--arriere-plan-points);
|
||||
outline-color: var(--couleur-noir);
|
||||
}
|
||||
&:active {
|
||||
color: var(--couleur-blanc);
|
||||
background: var(--couleur-gris-fonce-fond);
|
||||
background: var(--arriere-plan-points);
|
||||
}
|
||||
|
||||
&:active {
|
||||
color: var(--couleur-noir);
|
||||
background: var(--arriere-plan-points);
|
||||
@media (hover: hover) {
|
||||
&:hover {
|
||||
background: var(--arriere-plan-points);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,24 @@
|
|||
import { Console, Layer } from "effect";
|
||||
import { FetchHttpClient } from "effect/unstable/http";
|
||||
import { OtlpSerialization, OtlpTracer } from "effect/unstable/observability";
|
||||
|
||||
const OtlpTracingLayer = OtlpTracer.layer({
|
||||
resource: {
|
||||
attributes: {
|
||||
"deployment.environment": "staging",
|
||||
},
|
||||
serviceName: "haiku-atelier",
|
||||
serviceVersion: "1.0.0",
|
||||
},
|
||||
maxBatchSize: 1,
|
||||
exportInterval: "1 seconds",
|
||||
url: "https://jaeger-http.gcch.local/v1/traces",
|
||||
});
|
||||
|
||||
const ObservabilityLayer = OtlpTracingLayer.pipe(
|
||||
Layer.provide(OtlpSerialization.layerJson),
|
||||
Layer.provide(FetchHttpClient.layer),
|
||||
Layer.tapError(Console.error),
|
||||
);
|
||||
|
||||
export { ObservabilityLayer };
|
||||
|
|
@ -30,10 +30,10 @@ class Product extends Schema.Class<Product>("Product")({
|
|||
grouped_products: Schema.Unknown,
|
||||
has_options: Schema.Boolean,
|
||||
id: Schema.Int,
|
||||
// NOTE: Non-standard, injecté dans la Réponse.
|
||||
image_repos: Schema.String,
|
||||
// NOTE: Non-standard, injecté dans la Réponse.
|
||||
image_survol: Schema.String,
|
||||
// NOTE: Non-standard, injecté dans la Réponse. Optionelle pour éviter une erreur si une image est absente.
|
||||
image_repos: Schema.String.pipe(Schema.optional),
|
||||
// NOTE: Non-standard, injecté dans la Réponse. Optionelle pour éviter une erreur si une image est absente.
|
||||
image_survol: Schema.String.pipe(Schema.optional),
|
||||
images: Schema.Unknown,
|
||||
low_stock_amount: Schema.Union([Schema.Number, Schema.Null]),
|
||||
menu_order: Schema.Int,
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import { Console, Layer, ManagedRuntime, pipe } from "effect";
|
||||
|
||||
import { APIClient } from "../../scripts-effect/lib/api.ts";
|
||||
import { ObservabilityLayer } from "../../scripts-effect/lib/observability.ts";
|
||||
import ShopPageDOM from "./service-dom.ts";
|
||||
import ShopPageElements from "./service-elements.ts";
|
||||
import ShopPageMessages from "./service-messages.ts";
|
||||
|
|
@ -11,6 +12,7 @@ const ShopPageRuntime = ManagedRuntime.make(
|
|||
Layer.provideMerge(ShopPageMessages.Live),
|
||||
Layer.provideMerge(ShopPageElements.Live),
|
||||
Layer.provide(APIClient.Live),
|
||||
Layer.provideMerge(ObservabilityLayer),
|
||||
Layer.tapError(error => Console.error("ProductPageRuntime", "Impossible de créer le Layer :", error.message)),
|
||||
),
|
||||
);
|
||||
|
|
|
|||
|
|
@ -1,18 +1,8 @@
|
|||
import {
|
||||
Array as FxArray,
|
||||
Context,
|
||||
Effect,
|
||||
Layer,
|
||||
Option,
|
||||
pipe,
|
||||
Ref,
|
||||
Schema,
|
||||
SchemaIssue,
|
||||
Stream,
|
||||
SubscriptionRef,
|
||||
} from "effect";
|
||||
import { Array as FxArray, Context, Effect, Layer, Option, pipe, Ref, Schema, SchemaIssue, Stream, SubscriptionRef } from "effect";
|
||||
import { SchemaError } from "effect/Schema";
|
||||
import html from "html-template-tag";
|
||||
|
||||
import { BrowserRuntime } from "@effect/platform-browser";
|
||||
import { APIClient } from "../../scripts-effect/lib/api.ts";
|
||||
import { setLoadingState } from "../../scripts-effect/lib/elements.ts";
|
||||
import { GetProducts, Product } from "../../scripts-effect/schemas/api.ts";
|
||||
|
|
@ -47,27 +37,24 @@ class InvalidShopPageStateError
|
|||
class ShopPageDOM extends Context.Service<ShopPageDOM>()("haikuatelier.fr/Shop/ShopPageDOM", {
|
||||
make: Effect.gen(function*() {
|
||||
const { PageStatesRawJson, ProductsGrid, ShowMoreButton } = yield* ShopPageElements;
|
||||
const { ShowMoreButtonText } = yield* ShopPageMessages;
|
||||
const { ShowMoreButtonText, PageNumber } = yield* ShopPageMessages;
|
||||
const API = yield* APIClient;
|
||||
|
||||
const { authString, nonce } = yield* pipe(
|
||||
// Récupère la valeur de `Nonce` dans le DOM de la page.
|
||||
const { nonce } = yield* pipe(
|
||||
PageStatesRawJson.textContent,
|
||||
(textContent: string) =>
|
||||
Schema.decodeUnknownEffect(Schema.fromJsonString(PageStates))(textContent, { errors: "all" }),
|
||||
Effect.mapError(InvalidShopPageStateError.fromSchemaError),
|
||||
Effect.mapError(error => InvalidShopPageStateError.fromSchemaError(error)),
|
||||
);
|
||||
|
||||
/** ID de la Catégorie des Produits de la Page, si la Page courante est une Archive. */
|
||||
const ProductsCategoryId = yield* pipe(
|
||||
ProductsGrid.getAttribute(ATTRIBUT_ID_CATEGORIE_PRODUITS),
|
||||
Number,
|
||||
Option.fromNullishOr,
|
||||
Ref.make,
|
||||
Option.fromNullishOr(ProductsGrid.getAttribute(ATTRIBUT_ID_CATEGORIE_PRODUITS)),
|
||||
Option.map(categoryId => Number(categoryId)),
|
||||
categoryId => Ref.make(categoryId),
|
||||
);
|
||||
|
||||
// TODO: Créer une SubscriptionRef mettant à jour le DOM au changement de valeur.
|
||||
const PageNumber = yield* Ref.make(1);
|
||||
|
||||
/**
|
||||
* Créé le `DOM` d'une Carte de Produit sous forme de `<article>`.
|
||||
*/
|
||||
|
|
@ -118,7 +105,7 @@ class ShopPageDOM extends Context.Service<ShopPageDOM>()("haikuatelier.fr/Shop/S
|
|||
|
||||
const onMoreProductsWantedHandler = Effect.fn("onMoreProductsWantedHandler")(function*() {
|
||||
/** Le numéro de page souhaitée. */
|
||||
const newPageNumber = yield* Ref.updateAndGet(PageNumber, pageNumber => pageNumber + 1);
|
||||
const newPageNumber = yield* SubscriptionRef.updateAndGet(PageNumber, pageNumber => pageNumber + 1);
|
||||
/** L'ID de la Catégorie de Produits affichée dans la page si elle existe. */
|
||||
const categoryId = pipe(yield* Ref.get(ProductsCategoryId), Option.getOrUndefined);
|
||||
|
||||
|
|
@ -133,6 +120,7 @@ class ShopPageDOM extends Context.Service<ShopPageDOM>()("haikuatelier.fr/Shop/S
|
|||
yield* setLoadingState(ShowMoreButton, true);
|
||||
yield* SubscriptionRef.set(ShowMoreButtonText, "Getting Products...");
|
||||
|
||||
// TODO: Faire une gestion des Erreurs.
|
||||
const newProducts = yield* API.GetProducts(nonce, requestBody);
|
||||
|
||||
// Rétablis le texte du Bouton et réactive les interactions.
|
||||
|
|
@ -146,12 +134,12 @@ class ShopPageDOM extends Context.Service<ShopPageDOM>()("haikuatelier.fr/Shop/S
|
|||
const newProductsFragment = createNewPageDOM(newProducts);
|
||||
ProductsGrid.append(newProductsFragment);
|
||||
ProductsGrid.setAttribute(ATTRIBUT_PAGE, String(newPageNumber));
|
||||
});
|
||||
}, Effect.withSpan("lol"));
|
||||
|
||||
/**
|
||||
* Initialise l'écouteur d'événements de clic sur le bouton de chargement d'une nouvelle page de Produits (« Show more »).
|
||||
*/
|
||||
const initMoreProductsOnButtonClick = Effect.fn("initMoreProductsOnButtonClick")(function*() {
|
||||
const initLoadMoreProductsOnButtonClick = Effect.fn("initLoadMoreProductsOnButtonClick")(function*() {
|
||||
return yield* pipe(
|
||||
Stream.fromEventListener(ShowMoreButton, "click"),
|
||||
Stream.tap(onMoreProductsWantedHandler),
|
||||
|
|
@ -161,7 +149,7 @@ class ShopPageDOM extends Context.Service<ShopPageDOM>()("haikuatelier.fr/Shop/S
|
|||
|
||||
return {
|
||||
ProductsCategoryId,
|
||||
initMoreProductsOnButtonClick,
|
||||
initLoadMoreProductsOnButtonClick,
|
||||
};
|
||||
}),
|
||||
}) {
|
||||
|
|
|
|||
|
|
@ -1,13 +1,15 @@
|
|||
import { Context, Effect, Layer, pipe, Stream, SubscriptionRef } from "effect";
|
||||
|
||||
import { ATTRIBUT_PAGE } from "../constantes/dom.ts";
|
||||
import ShopPageElements from "./service-elements.ts";
|
||||
|
||||
class ShopPageMessages extends Context.Service<ShopPageMessages>()("haikuatelier.fr/Shop/Messages", {
|
||||
make: Effect.gen(function*() {
|
||||
const { ShowMoreButton } = yield* ShopPageElements;
|
||||
const { ShowMoreButton, ProductsGrid } = yield* ShopPageElements;
|
||||
|
||||
const ShowMoreButtonText = yield* SubscriptionRef.make("Show more");
|
||||
// Const ShowMoreErrorText = yield* SubscriptionRef.make<Option.Option<string>>(Option.none());
|
||||
const PageNumber = yield* SubscriptionRef.make(Number(ProductsGrid.getAttribute(ATTRIBUT_PAGE) ?? "1"));
|
||||
|
||||
const initShowMoreButtonUpdates = Effect.fn("initShowMoreButtonUpdates")(function*() {
|
||||
return yield* pipe(
|
||||
|
|
@ -20,7 +22,18 @@ class ShopPageMessages extends Context.Service<ShopPageMessages>()("haikuatelier
|
|||
);
|
||||
});
|
||||
|
||||
return { ShowMoreButtonText, initShowMoreButtonUpdates };
|
||||
const initPageNumberUpdates = Effect.fn("initPageNumberUpdates")(function*() {
|
||||
return yield* pipe(
|
||||
SubscriptionRef.changes(PageNumber),
|
||||
Stream.tap(newPageNumber => {
|
||||
ProductsGrid.setAttribute(ATTRIBUT_PAGE, String(newPageNumber));
|
||||
return Effect.succeed(newPageNumber);
|
||||
}),
|
||||
Stream.runDrain,
|
||||
);
|
||||
});
|
||||
|
||||
return { PageNumber, ShowMoreButtonText, initShowMoreButtonUpdates, initPageNumberUpdates };
|
||||
}),
|
||||
}) {
|
||||
static readonly Live = Layer.effect(this, this.make);
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
import { Console, Layer, ManagedRuntime, pipe } from "effect";
|
||||
|
||||
import { APIClient } from "../../scripts-effect/lib/api.ts";
|
||||
import { ObservabilityLayer } from "../../scripts-effect/lib/observability.ts";
|
||||
import ProductPageDOM from "./service-dom.ts";
|
||||
import ProductPageElements from "./service-elements.ts";
|
||||
import ProductPageMessages from "./service-messages.ts";
|
||||
|
|
@ -9,8 +10,9 @@ const ProductPageRuntime = ManagedRuntime.make(
|
|||
pipe(
|
||||
ProductPageDOM.Live,
|
||||
Layer.provideMerge(ProductPageMessages.Live),
|
||||
Layer.provide(ProductPageElements.Live),
|
||||
Layer.provideMerge(ProductPageElements.Live),
|
||||
Layer.provide(APIClient.Live),
|
||||
Layer.provideMerge(ObservabilityLayer),
|
||||
Layer.tapError(error => Console.error("ProductPageRuntime", "Impossible de créer le Layer :", error)),
|
||||
),
|
||||
);
|
||||
|
|
|
|||
|
|
@ -5,13 +5,7 @@ import { Array as FxArray, Context, Effect, HashMap, Layer, Option, pipe } from
|
|||
import type { DetailEnsemble } from "./types.d.ts";
|
||||
|
||||
import { getAllSelectorFromDocument, getFirstSelectorFromDocument } from "../../scripts-effect/lib/dom.ts";
|
||||
import {
|
||||
ATTRIBUT_ARIA_CONTROLS,
|
||||
DOM_BOUTON_AJOUT_PANIER,
|
||||
DOM_BOUTONS_ACCORDEON,
|
||||
DOM_CONTENUS_ACCORDEON,
|
||||
DOM_PRIX_PRODUIT,
|
||||
} from "../constantes/dom.ts";
|
||||
import { ATTRIBUT_ARIA_CONTROLS, DOM_BOUTON_AJOUT_PANIER, DOM_BOUTONS_ACCORDEON, DOM_CONTENUS_ACCORDEON, DOM_PRIX_PRODUIT } from "../constantes/dom.ts";
|
||||
import { IncoherentDOMError } from "./errors.ts";
|
||||
|
||||
class ProductPageElements
|
||||
|
|
@ -25,6 +19,8 @@ class ProductPageElements
|
|||
|
||||
const PageStatesRawJson = yield* getFirstSelectorFromDocument<HTMLScriptElement>("#page-states");
|
||||
|
||||
const ContextRawJson = yield* getFirstSelectorFromDocument<HTMLScriptElement>("#product-json");
|
||||
|
||||
const ProductPrice = yield* getFirstSelectorFromDocument<HTMLParagraphElement>(DOM_PRIX_PRODUIT);
|
||||
|
||||
const VariationChoiceForm = yield* getFirstSelectorFromDocument<HTMLFormElement>("#variation-choice");
|
||||
|
|
@ -51,6 +47,7 @@ class ProductPageElements
|
|||
|
||||
return {
|
||||
AddToCartButton,
|
||||
ContextRawJson,
|
||||
Details,
|
||||
DetailsButtons,
|
||||
DetailsContents,
|
||||
|
|
|
|||
|
|
@ -2,21 +2,32 @@
|
|||
* Scripts pour les fonctionnalités de la page Boutique.
|
||||
*/
|
||||
|
||||
import { Console, Effect } from "effect";
|
||||
import { Console, Effect, pipe } from "effect";
|
||||
import ShopPageRuntime from "./page-boutique/runtime.ts";
|
||||
import ShopPageDOM from "./page-boutique/service-dom.ts";
|
||||
import ShopPageElements from "./page-boutique/service-elements.ts";
|
||||
import ShopPageMessages from "./page-boutique/service-messages.ts";
|
||||
|
||||
document.addEventListener("DOMContentLoaded", (): void => {
|
||||
// initialisePageBoutique();
|
||||
ShopPageRuntime.runFork(Effect.gen(function*() {
|
||||
const Elements = yield* ShopPageElements;
|
||||
const DOM = yield* ShopPageDOM;
|
||||
const Messages = yield* ShopPageMessages;
|
||||
// TODO: Implémenter l'Observabilité.
|
||||
|
||||
yield* Effect.all([DOM.initMoreProductsOnButtonClick(), Messages.initShowMoreButtonUpdates()], {
|
||||
concurrency: "unbounded",
|
||||
}).pipe(Effect.tapCause(Console.error));
|
||||
}));
|
||||
document.addEventListener("DOMContentLoaded", (): void => {
|
||||
const program = Effect.gen(function*() {
|
||||
const { initLoadMoreProductsOnButtonClick } = yield* ShopPageDOM;
|
||||
const { initShowMoreButtonUpdates, initPageNumberUpdates } = yield* ShopPageMessages;
|
||||
|
||||
yield* pipe(
|
||||
Effect.all([
|
||||
// Initialise le chargement d'une nouvelle page de Produits au clic sur le bouton « Show more ».
|
||||
initLoadMoreProductsOnButtonClick(),
|
||||
// Initialise la mise à jour du texte du bouton « Show more » à la mise à jour de sa référence.
|
||||
initShowMoreButtonUpdates(),
|
||||
// Initialise la mise à jour du numéro de page dans le DOM à la mise à jour de sa référence.
|
||||
initPageNumberUpdates(),
|
||||
], {
|
||||
concurrency: "unbounded",
|
||||
}),
|
||||
Effect.tapCause(Console.error),
|
||||
);
|
||||
});
|
||||
|
||||
ShopPageRuntime.runFork(program);
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
// Scripts pour la Page Produit
|
||||
|
||||
import { Cause, Console, Effect } from "effect";
|
||||
import { Cause, Console, Effect, pipe } from "effect";
|
||||
import ProductPageRuntime from "./page-produit/runtime.ts";
|
||||
import ProductPageDOM from "./page-produit/service-dom.ts";
|
||||
import ProductPageMessages from "./page-produit/service-messages.ts";
|
||||
|
|
@ -10,26 +10,22 @@ document.addEventListener("DOMContentLoaded", (): void => {
|
|||
const DOM = yield* ProductPageDOM;
|
||||
const Messages = yield* ProductPageMessages;
|
||||
|
||||
const effects = Effect.all(
|
||||
[
|
||||
// yield* Effect.forkChild(Effect.gen(function*() {
|
||||
// yield* Effect.log(JSON.parse(Elements.ContextRawJson.textContent));
|
||||
// }));
|
||||
|
||||
yield* pipe(
|
||||
Effect.all([
|
||||
DOM.initAddToCartButtonInitialState(),
|
||||
DOM.initAddToCartButtonUpdates(),
|
||||
DOM.initAddToCartButtonClicks(),
|
||||
DOM.initDetailInteractions(),
|
||||
DOM.initPriceUpdatesOnVariationChange(),
|
||||
Messages.initAddToCartButtonUpdates(),
|
||||
],
|
||||
{
|
||||
concurrency: "unbounded",
|
||||
},
|
||||
], { concurrency: "unbounded" }),
|
||||
Effect.tapCause(cause => Console.error(Cause.pretty(cause))),
|
||||
);
|
||||
|
||||
yield* effects.pipe(Effect.tapCause(cause => Console.error(Cause.pretty(cause))));
|
||||
}).pipe(ProductPageRuntime.runFork);
|
||||
|
||||
document.querySelector("#cart-error button").addEventListener("click", (): void => {
|
||||
document.querySelector("#cart-error").close();
|
||||
});
|
||||
});
|
||||
|
||||
// const ajouteProduitAuPanier = (event: MouseEvent): void => {
|
||||
|
|
|
|||
|
|
@ -1,10 +1,14 @@
|
|||
<header id="en-tete">
|
||||
<div class="logo">
|
||||
<img
|
||||
alt="Haiku Atelier's Logo" decoding="async"
|
||||
height="77" loading="eager"
|
||||
src="{{ site.theme.link }}/assets/img/logos/logo-v2-text.svg" width="307"
|
||||
/>
|
||||
<a
|
||||
aria-label="Go to the Shop" href="/shop"
|
||||
title="Go to the Shop"
|
||||
>
|
||||
<img
|
||||
alt="Haiku Atelier's Logo" height="77"
|
||||
src="{{ site.theme.link }}/assets/img/logos/logo-v2-text.svg" width="307"
|
||||
/>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
{# TODO: Utiliser un Menu WordPress ? #}
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 29 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 398 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 48 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 10 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 350 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 20 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 285 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 278 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 8.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 262 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 7.5 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 251 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 306 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 8.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 323 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 28 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 1,001 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.2 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 457 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 14 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 14 KiB After Width: | Height: | Size: 14 KiB |
|
|
@ -1,69 +0,0 @@
|
|||
#!/usr/bin/fish
|
||||
|
||||
set -f jpg $argv
|
||||
echo $jpg
|
||||
|
||||
set -f avif (path change-extension 'avif' "$jpg")
|
||||
set -f jxl (path change-extension 'jxl' "$jpg")
|
||||
set -f png (path change-extension 'png' "$jpg")
|
||||
|
||||
set -f dimensions (gm identify -format "%w-%h" $jpg)
|
||||
set -f dimensions (string split "-" $dimensions)
|
||||
|
||||
if test $dimensions[1] -eq 1920 || test $dimensions[2] -eq 1920
|
||||
set -f a_bonnes_dimensions true
|
||||
else
|
||||
set -f a_bonnes_dimensions false
|
||||
end
|
||||
|
||||
if test -e $avif && test -e $jxl
|
||||
echo -e "\tAll there."
|
||||
return
|
||||
end
|
||||
|
||||
gm convert "$jpg" -resize 1920x1920\> "$png" >/dev/null
|
||||
|
||||
if ! test -e $jxl
|
||||
# Si les dimensions ne sont pas bonnes, convertis l'image PNG en JPEGXL puis reconstruis une image JPEG.
|
||||
# C'est une forme de redimensionnement lossless.
|
||||
if test $a_bonnes_dimensions = false
|
||||
cjxl \
|
||||
--allow_jpeg_reconstruction=1 \
|
||||
--brotli_effort=11 \
|
||||
--container=1 \
|
||||
--effort=9 \
|
||||
--lossless_jpeg=1 \
|
||||
--num_threads=-1 \
|
||||
--progressive \
|
||||
$png $jxl &>/dev/null
|
||||
|
||||
djxl \
|
||||
--num_threads=-1 \
|
||||
$jxl $jpg &>/dev/null
|
||||
end
|
||||
|
||||
cjxl \
|
||||
--allow_jpeg_reconstruction=0 \
|
||||
--brotli_effort=11 \
|
||||
--container=1 \
|
||||
--effort=10 \
|
||||
--quality=70 \
|
||||
--lossless_jpeg=0 \
|
||||
--num_threads=-1 \
|
||||
--progressive \
|
||||
$png $jxl &>/dev/null
|
||||
echo -e "\t$jxl"
|
||||
|
||||
set -f avif (path change-extension 'avif' "$jpg")
|
||||
if ! test -e $avif
|
||||
avifenc \
|
||||
-q 70 \
|
||||
-s 0 \
|
||||
-c aom \
|
||||
-y 420 \
|
||||
"$png" "$avif" &>/dev/null
|
||||
echo -e "\t$avif"
|
||||
end
|
||||
|
||||
rm $png
|
||||
end
|
||||
Binary file not shown.
Loading…
Add table
Add a link
Reference in a new issue