gcch/haiku-atelier-2024
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

2024-10-09

Browse source
This commit is contained in:
gcch 2024-10-09 15:47:29 +02:00
commit c5c8aa4d3f
37 changed files with 1221 additions and 415 deletions
Download patch file Download diff file Expand all files Collapse all files

56
web/app/themes/haiku-atelier-2024/assets/css/main.css
View file

@ -196,7 +196,6 @@ em {
button {
all: initial;
cursor: pointer;
font: inherit;
text-align: center;
}
button.bouton-case-pleine {
@ -207,6 +206,61 @@ button[disabled] {
cursor: not-allowed;
}
input, select, textarea {
padding: var(--espace-xs);
background: var(--couleur-gris);
border: 1px solid var(--couleur-noir);
outline: 1px solid transparent;
transition: 0.2s background, 0.2s outline;
}
input:focus, input:focus-visible, select:focus, select:focus-visible, textarea:focus, textarea:focus-visible {
background: var(--couleur-jaune);
outline: 1px solid var(--couleur-noir);
}
input:is([type=email], [type=text], [type=tel])::placeholder, textarea::placeholder {
text-transform: lowercase;
}
input:is([type=email], [type=text], [type=tel])::selection, textarea::selection {
color: var(--couleur-blanc);
background: var(--couleur-noir);
}
input:is([type=email], [type=text], [type=tel]):user-valid, textarea:user-valid {
background: var(--couleur-jaune);
}
input:is([type=email], [type=text], [type=tel]):user-invalid, textarea:user-invalid {
background: var(--couleur-gris);
}
input, label, select, textarea {
cursor: pointer;
}
input[type=checkbox], input[type=radio] {
width: var(--espace-l);
height: var(--espace-l);
padding: initial;
appearance: none;
border: 1px solid var(--couleur-noir);
transition: 0.2s background;
/**
* 1. Pour un alignement parfait du label avec la case à cocher.
*/
}
input[type=checkbox]:checked, input[type=radio]:checked {
background: var(--couleur-jaune);
}
input[type=checkbox]:checked::before, input[type=radio]:checked::before {
content: "x";
position: relative;
bottom: 15%;
left: 29%;
}
label:has(~ input[type=checkbox], ~ input[type=radio]), input[type=checkbox] + label, input[type=radio] + label {
padding-top: 1px; /* 1 */
font-size: 0.9rem;
}
/**
* 1. Facilite l'usages des images.
* 2. Affiche les images dans l'intégralité de leur conteneur, en contrepartie d'un recoupage.

2
web/app/themes/haiku-atelier-2024/assets/css/main.css.map
View file

File diff suppressed because one or more lines are too long

60
web/app/themes/haiku-atelier-2024/assets/css/main.min.css vendored
View file

@ -169,7 +169,6 @@ em {
button {
all: initial;
cursor: pointer;
font: inherit;
text-align: center;
}
@ -182,6 +181,65 @@ button[disabled] {
cursor: not-allowed;
}
input, select, textarea {
padding: var(--espace-xs);
background: var(--couleur-gris);
border: 1px solid var(--couleur-noir);
outline: 1px solid #0000;
transition: background .2s, outline .2s;
}
input:focus, input:focus-visible, select:focus, select:focus-visible, textarea:focus, textarea:focus-visible {
background: var(--couleur-jaune);
outline: 1px solid var(--couleur-noir);
}
input:is([type="email"], [type="text"], [type="tel"])::placeholder, textarea::placeholder {
text-transform: lowercase;
}
input:is([type="email"], [type="text"], [type="tel"])::selection, textarea::selection {
color: var(--couleur-blanc);
background: var(--couleur-noir);
}
input:is([type="email"], [type="text"], [type="tel"]):user-valid, textarea:user-valid {
background: var(--couleur-jaune);
}
input:is([type="email"], [type="text"], [type="tel"]):user-invalid, textarea:user-invalid {
background: var(--couleur-gris);
}
input, label, select, textarea {
cursor: pointer;
}
input[type="checkbox"], input[type="radio"] {
width: var(--espace-l);
height: var(--espace-l);
padding: initial;
appearance: none;
border: 1px solid var(--couleur-noir);
transition: background .2s;
}
input[type="checkbox"]:checked, input[type="radio"]:checked {
background: var(--couleur-jaune);
}
input[type="checkbox"]:checked:before, input[type="radio"]:checked:before {
content: "x";
position: relative;
bottom: 15%;
left: 29%;
}
label:has( ~ input[type="checkbox"], ~ input[type="radio"]), input[type="checkbox"] + label, input[type="radio"] + label {
padding-top: 1px;
font-size: .9rem;
}
img, picture {
max-width: 100%;
display: block;

2
web/app/themes/haiku-atelier-2024/assets/css/main.min.css.map
View file

File diff suppressed because one or more lines are too long

145
web/app/themes/haiku-atelier-2024/assets/css/pages/page-panier.css
View file

@ -77,7 +77,6 @@
width: 100%;
text-align: center;
appearance: textfield; /* 1 */
background: initial;
border: initial;
border-right: 1px solid var(--couleur-noir);
border-left: 1px solid var(--couleur-noir);
@ -129,9 +128,6 @@
flex-flow: row nowrap;
column-gap: var(--espace-xl);
text-transform: lowercase;
/**
* 1. Pour un alignement parfait du label avec la case à cocher.
*/
}
#panneau-panier .panneau__emballages__choix__ligne {
display: flex;
@ -139,28 +135,6 @@
gap: 1ch;
place-items: center;
}
#panneau-panier .panneau__emballages__choix input, #panneau-panier .panneau__emballages__choix label {
cursor: pointer;
}
#panneau-panier .panneau__emballages__choix input[type=radio] {
width: var(--espace-l);
height: var(--espace-l);
appearance: none;
border: 1px solid var(--couleur-noir);
}
#panneau-panier .panneau__emballages__choix input[type=radio]:checked {
background: var(--couleur-jaune);
}
#panneau-panier .panneau__emballages__choix input[type=radio]:checked::before {
content: "x";
position: relative;
bottom: 25%;
left: 25%;
}
#panneau-panier .panneau__emballages__choix label {
padding-top: 1px; /* 1 */
font-size: 0.9rem;
}
#panneau-panier .panneau__instructions-code-promo {
width: 100%;
padding: var(--espace-l) var(--espace-xl);
@ -190,13 +164,7 @@
margin: auto;
}
#panneau-panier .panneau__instructions-code-promo__code-promo input {
width: 30ch;
padding: var(--espace-xs);
background: var(--couleur-gris);
border: 1px solid var(--couleur-noir);
}
#panneau-panier .panneau__instructions-code-promo__code-promo input::placeholder {
text-transform: lowercase;
width: 20rem;
}
#panneau-panier .panneau__instructions-code-promo__code-promo button {
padding: var(--espace-xs) var(--espace-xl);
@ -249,6 +217,117 @@
font-style: initial;
}
#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.9rem;
font-style: italic;
}
#panneau-informations-client .panneau__formulaires .panneau__formulaires__separation-adresses label {
text-transform: lowercase;
}
#panneau-informations-client .formulaire {
margin: auto;
padding: 0 var(--espace-xl);
}
#panneau-informations-client .formulaire [hidden] {
display: none;
}
#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 {
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 {
width: 15rem;
}
#panneau-informations-client .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-informations-client .panneau__pied-de-page button {
font: inherit;
color: inherit;
text-transform: inherit;
letter-spacing: inherit;
}
/**
* 1. Applique une marge supérieure égale à la hauteur de l'en-tête pour qu'elle puisse s'afficher
* correctement.

2
web/app/themes/haiku-atelier-2024/assets/css/pages/page-panier.css.map
View file

@ -1 +1 @@
{"version":3,"sourceRoot":"","sources":["../../../src/sass/layouts/_panneau-panier.scss","../../../src/sass/pages/page-panier.scss"],"names":[],"mappings":";AAEA;EACE;;AAEA;EACE;;AAIF;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAGA;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAMN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;AAMA;AAOA;AAAA;AAAA;AAAA;AAqBA;AAOA;;AAvCA;EACE;;AAIF;EACE;EACA;EACA;;AAOF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;;AAKJ;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;IACE;IACA;;;AASZ;EACE;EACA;EACA;EACA;EACA;;AAGA;EACE;EACA;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;AAgCA;AAAA;AAAA;;AA9BA;EACE;EACA;EACA;EACA;;AAGF;EACE;;AAIF;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAEA;EACE;EACA;EACA;EACA;;AAQN;EACE;EACA;;AAMN;EACE;EACA;EACA;EACA;AAEA;AAAA;AAAA;AAAA;;AAIA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAIJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAKN;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;;AAIJ;EACE;EACA;EACA;;AAKJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;;ACvSN;AAAA;AAAA;AAAA;AAIA;AACE;EACA;AAEA;EACA;EAEA;EACA;EACA;EACA;;AAGE;EACE;;AAGF;EACE;;AAIJ;EACE;EACA;EACA;EACA;;AAGA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAON;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA","file":"page-panier.css"}
{"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;EACA;EACA;;AAEA;EACE;EACA;EACA;;AAMN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;EACA;AAMA;AAOA;AAAA;AAAA;AAAA;AAoBA;AAOA;;AAtCA;EACE;;AAIF;EACE;EACA;EACA;;AAOF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;;AAKJ;EACE;EACA;EACA;;AAIF;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;IACE;IACA;;;AASZ;EACE;EACA;EACA;EACA;EACA;;AAGA;EACE;EACA;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAIJ;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;AAMN;EACE;EACA;EACA;EACA;AAEA;AAAA;AAAA;AAAA;;AAIA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;EACA;;AAKN;EACE;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAGF;EACE;;AAIJ;EACE;EACA;EACA;;AAKJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;;;ACjQJ;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;;AAKN;EACE;EACA;;AAEA;EACE;;AAGF;EACE;;AAGF;EACE;EACA;EACA;EACA;EACA;;AAGF;EACE;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAIA;EACE;;AAKN;EACE;EACA;;AAEA;EACE;;AAIJ;EACE;;AAKJ;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;;;ACvIN;AAAA;AAAA;AAAA;AAIA;AACE;EACA;AAEA;EACA;EAEA;EACA;EACA;EACA;;AAGE;EACE;;AAGF;EACE;;AAIJ;EACE;EACA;EACA;EACA;;AAGA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;;AAON;EACE;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EACE;EACA;EACA","file":"page-panier.css"}

168
web/app/themes/haiku-atelier-2024/assets/css/pages/page-panier.min.css vendored
View file

@ -80,7 +80,6 @@
#panneau-panier .panneau__grille-produits .detail-produit__actions input[type="number"] {
text-align: center;
appearance: textfield;
background: initial;
border: initial;
border-right: 1px solid var(--couleur-noir);
border-left: 1px solid var(--couleur-noir);
@ -151,33 +150,6 @@
display: flex;
}
#panneau-panier .panneau__emballages__choix input, #panneau-panier .panneau__emballages__choix label {
cursor: pointer;
}
#panneau-panier .panneau__emballages__choix input[type="radio"] {
width: var(--espace-l);
height: var(--espace-l);
appearance: none;
border: 1px solid var(--couleur-noir);
}
#panneau-panier .panneau__emballages__choix input[type="radio"]:checked {
background: var(--couleur-jaune);
}
#panneau-panier .panneau__emballages__choix input[type="radio"]:checked:before {
content: "x";
position: relative;
bottom: 25%;
left: 25%;
}
#panneau-panier .panneau__emballages__choix label {
padding-top: 1px;
font-size: .9rem;
}
#panneau-panier .panneau__instructions-code-promo {
padding: var(--espace-l) var(--espace-xl);
text-align: center;
@ -206,14 +178,7 @@
}
#panneau-panier .panneau__instructions-code-promo__code-promo input {
padding: var(--espace-xs);
background: var(--couleur-gris);
border: 1px solid var(--couleur-noir);
width: 30ch;
}
#panneau-panier .panneau__instructions-code-promo__code-promo input::placeholder {
text-transform: lowercase;
width: 20rem;
}
#panneau-panier .panneau__instructions-code-promo__code-promo button {
@ -275,6 +240,137 @@
font-style: initial;
}
#panneau-informations-client > * {
text-align: center;
align-content: 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 {
column-gap: var(--espacement-inter-images);
width: var(--longueur-bouton);
height: var(--hauteur-bouton);
background: var(--couleur-noir);
place-content: center;
place-items: center;
margin: auto;
display: flex;
}
#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 {
margin: auto;
margin-bottom: var(--espace-m);
flex-flow: row;
place-items: center;
column-gap: 1ch;
width: fit-content;
font-size: .9rem;
font-style: italic;
display: flex;
position: relative;
}
#panneau-informations-client .panneau__formulaires .panneau__formulaires__separation-adresses label {
text-transform: lowercase;
}
#panneau-informations-client .formulaire {
padding: 0 var(--espace-xl);
margin: auto;
}
#panneau-informations-client .formulaire [hidden] {
display: none;
}
#panneau-informations-client .formulaire + .formulaire {
margin-top: var(--espace-xl);
}
#panneau-informations-client .formulaire .formulaire__titre {
margin-bottom: var(--espace-m);
letter-spacing: 1px;
font-size: 1.25rem;
font-style: italic;
font-weight: 600;
}
#panneau-informations-client .formulaire .formulaire__champs {
text-align: left;
width: fit-content;
margin: auto;
}
#panneau-informations-client .formulaire .formulaire__champs .formulaire__champs__champ {
column-gap: var(--espace-xl);
flex-flow: row;
justify-content: space-between;
place-items: center;
display: flex;
}
#panneau-informations-client .formulaire .formulaire__champs .formulaire__champs__champ + .formulaire__champs__champ {
margin-top: var(--espace-l);
}
#panneau-informations-client .formulaire label {
text-transform: lowercase;
font-weight: 400;
}
#panneau-informations-client .formulaire label:has( + :is(input:required, select:required)) {
font-weight: 600;
}
#panneau-informations-client .formulaire input {
width: 15rem;
}
#panneau-informations-client .panneau__pied-de-page {
padding: var(--espace-l) 0;
color: var(--couleur-blanc);
text-align: center;
text-transform: uppercase;
letter-spacing: 2px;
background: var(--couleur-noir);
align-content: center;
font-size: 1.25rem;
font-style: italic;
}
#panneau-informations-client .panneau__pied-de-page button {
font: inherit;
color: inherit;
text-transform: inherit;
letter-spacing: inherit;
}
#page-panier {
--menu-section-hauteur: var(--menu-categories-produits-hauteur);
--menu-section-marges-bloc-debut: var(--en-tete-hauteur);

2
web/app/themes/haiku-atelier-2024/assets/css/pages/page-panier.min.css.map
View file

File diff suppressed because one or more lines are too long

1
web/app/themes/haiku-atelier-2024/assets/img/paypal/logo-paypal.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="329.449 122.475 21.745 29"><path fill="#fff" d="M349.05 131.283c.28-2.099 0-3.499-1.124-4.898-1.217-1.4-3.37-2-6.085-2h-7.957c-.562 0-1.03.4-1.124 1l-3.276 22.192c-.094.499.187.899.655.899h4.962l-.375 2.299c-.093.3.281.7.562.7h4.213c.468 0 .842-.4.936-.899l.093-.2.749-5.198.094-.3c.094-.6.468-.9.936-.9h.655c4.026 0 7.115-1.799 8.052-6.698.374-2.099.187-3.898-.843-5.098-.374-.299-.749-.699-1.123-.899" opacity=".7"/><path fill="#fff" d="M349.05 131.283c.28-2.099 0-3.499-1.124-4.898-1.217-1.4-3.37-2-6.085-2h-7.957c-.562 0-1.03.4-1.124 1l-3.276 22.192c-.094.499.187.899.655.899h4.962l1.217-8.297-.094.3c.187-.599.562-.999 1.217-.999h2.34c4.588 0 8.145-2 9.175-7.697 0-.2 0-.4.094-.5" opacity=".7"/><path fill="#fff" d="M337.628 131.283c0-.3.188-.6.562-.8.094 0 .281-.1.374-.1h6.273c.749 0 1.404.1 2.059.2.188 0 .281 0 .562.1.094.1.281.1.468.2.094 0 .094 0 .281.1l.843.3c.28-2.099 0-3.499-1.124-4.798-1.217-1.4-3.37-2.1-6.085-2.1h-7.957c-.562 0-1.03.5-1.124 1l-3.276 22.192c-.094.499.187.899.655.899h4.962l1.217-8.297z"/><path fill="#231f20" d="M349.01 131.261c.448.263.846.579 1.145.947.498.579.796 1.316.946 2.157.149-1.683-.1-3.051-.946-4.103-.299-.369-.647-.632-1.045-.895 0 .579 0 1.21-.1 1.894m-19.362 14.995 3.136-20.835c.05-.578.548-.999 1.095-.999h7.964c2.737 0 4.878.631 6.072 2.052.598.736.946 1.578 1.095 2.525.199-1.894-.099-3.209-1.095-4.419-1.194-1.474-3.335-2.105-6.072-2.105h-7.964c-.547 0-1.045.421-1.145 1l-3.285 22.202c0 .21.05.421.199.579m5.127 2.209-.05.316c-.05.211.05.421.199.579l.15-.895z" opacity=".2"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 1.5 KiB

1
web/app/themes/haiku-atelier-2024/assets/img/paypal/titre-paypal.svg Normal file
View file

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="201.754 136.33 100.039 26.6"><path fill="#fff" d="M213.773 136.33h-7.8c-.5 0-1 .4-1.1.9l-3.1 20c-.1.4.2.7.6.7h3.7c.5 0 1-.4 1.1-.9l.8-5.4c.1-.5.5-.9 1.1-.9h2.5c5.1 0 8.1-2.5 8.9-7.4.3-2.1 0-3.8-1-5-1.1-1.3-3.1-2-5.7-2m.9 7.3c-.4 2.8-2.6 2.8-4.6 2.8h-1.2l.8-5.2c0-.3.3-.5.6-.5h.5c1.4 0 2.7 0 3.4.8.5.4.7 1.1.5 2.1m22.3-.1h-3.7c-.3 0-.6.2-.6.5l-.2 1-.3-.4c-.8-1.2-2.6-1.6-4.4-1.6-4.1 0-7.6 3.1-8.3 7.5-.4 2.2.1 4.3 1.4 5.7 1.1 1.3 2.8 1.9 4.7 1.9 3.3 0 5.2-2.1 5.2-2.1l-.2 1c-.1.4.2.8.6.8h3.4c.5 0 1-.4 1.1-.9l2-12.8c.1-.2-.3-.6-.7-.6m-5.1 7.2c-.4 2.1-2 3.6-4.2 3.6-1.1 0-1.9-.3-2.5-1s-.8-1.6-.6-2.6c.3-2.1 2.1-3.6 4.2-3.6 1.1 0 1.9.4 2.5 1 .5.7.7 1.6.6 2.6m25-7.2h-3.7c-.4 0-.7.2-.9.5l-5.2 7.6-2.2-7.3c-.1-.5-.6-.8-1-.8h-3.7c-.4 0-.8.4-.6.9l4.1 12.1-3.9 5.4c-.3.4 0 1 .5 1h3.7c.4 0 .7-.2.9-.5l12.5-18c.3-.3 0-.9-.5-.9m12.4-7.2h-7.8c-.5 0-1 .4-1.1.9l-3.1 19.9c-.1.4.2.7.6.7h4c.4 0 .7-.3.7-.6l.9-5.7c.1-.5.5-.9 1.1-.9h2.5c5.1 0 8.1-2.5 8.9-7.4.3-2.1 0-3.8-1-5-1.2-1.2-3.1-1.9-5.7-1.9m.9 7.3c-.4 2.8-2.6 2.8-4.6 2.8h-1.2l.8-5.2c0-.3.3-.5.6-.5h.5c1.4 0 2.7 0 3.4.8.5.4.6 1.1.5 2.1m22.3-.1h-3.7c-.3 0-.6.2-.6.5l-.2 1-.3-.4c-.8-1.2-2.6-1.6-4.4-1.6-4.1 0-7.6 3.1-8.3 7.5-.4 2.2.1 4.3 1.4 5.7 1.1 1.3 2.8 1.9 4.7 1.9 3.3 0 5.2-2.1 5.2-2.1l-.2 1c-.1.4.2.8.6.8h3.4c.5 0 1-.4 1.1-.9l2-12.8c0-.2-.3-.6-.7-.6m-5.2 7.2c-.4 2.1-2 3.6-4.2 3.6-1.1 0-1.9-.3-2.5-1s-.8-1.6-.6-2.6c.3-2.1 2.1-3.6 4.2-3.6 1.1 0 1.9.4 2.5 1 .6.7.8 1.6.6 2.6m9.6-13.9-3.2 20.3c-.1.4.2.7.6.7h3.2c.5 0 1-.4 1.1-.9l3.2-19.9c.1-.4-.2-.7-.6-.7h-3.6c-.4 0-.6.2-.7.5"/></svg>
Side by side

After

Width:  |  Height:  |  Size: 1.5 KiB

6
web/app/themes/haiku-atelier-2024/assets/js/.vite/manifest.json
View file

@ -51,7 +51,7 @@
"name": "dom",
"src": "web/app/themes/haiku-atelier-2024/src/scripts/constantes/dom.ts",
"isEntry": true,
"integrity": "sha512-g5Of6R9ri+kdLCyHR4tX7pb/JnEhcnJfPqRLLRvs8lHGeRHRzDI4ekFgPR7+7MnRWPxbYlSnXmjq7SM+SV4QZg=="
"integrity": "sha512-u5Gy5kzxh8SdanwxPC6cwZKCkYXxLVzhlTSpKHrp97xgD0JflWs4jOb833HbtRENWBAHWz23O8nU1GzUKShleg=="
},
"web/app/themes/haiku-atelier-2024/src/scripts/constantes/messages.ts": {
"file": "messages3.js",
@ -285,7 +285,7 @@
"web/app/themes/haiku-atelier-2024/src/scripts/lib/schemas/erreurs.ts",
"web/app/themes/haiku-atelier-2024/src/scripts/constantes/cart.ts"
],
"integrity": "sha512-1b76Uu/mQmAiuYRm8ABDYTWd1OBkR/ndy+AI6QXv2etYAt9yM6n2g7pJQrqXa5Jf+aWNUaYFffyBsec6R9M48w=="
"integrity": "sha512-frsxWig5fJoeOmWOYe+D8/1sa++UXTOOhuBSVaXzuv5I1+QFRw0jr3VCGQURdoS0+NlvxJbqdBCSB2Ej8IVgmw=="
},
"web/app/themes/haiku-atelier-2024/src/scripts/scripts-page-produit.ts": {
"file": "scripts-page-produit.js",
@ -313,6 +313,6 @@
"web/app/themes/haiku-atelier-2024/src/scripts/lib/schemas/messages.ts",
"web/app/themes/haiku-atelier-2024/src/scripts/constantes/cart.ts"
],
"integrity": "sha512-yg9MYQDB+arRyL7GeJr/W0NFNSvYVsRor8WQzEeNAM6etWm+QqqNr1n3BfqG0o7eOZrx2ak6He1SaWpflLjtxw=="
"integrity": "sha512-PbnUCgzOC1/ctNi2EMfUGP43tfVYEY/LEYXyPTqVnYM1IqfS9TVxRE98z1au54cRkP9ie0pp+Y3ARWzLgUSPaw=="
}
}

2
web/app/themes/haiku-atelier-2024/assets/js/chunk-7BKSRZNG.C39W3Wne.js.map
View file

@ -1 +1 @@
{"version":3,"file":"chunk-7BKSRZNG.C39W3Wne.js","sources":["../../../../../../node_modules/.pnpm/remeda@2.14.0/node_modules/remeda/dist/chunk-ANXBDSUI.js","../../../../../../node_modules/.pnpm/remeda@2.14.0/node_modules/remeda/dist/chunk-7BKSRZNG.js"],"sourcesContent":["var e={done:!0,hasNext:!1},s={done:!1,hasNext:!1},a=()=>e,o=t=>({hasNext:!0,next:t,done:!1});export{s as a,a as b,o as c};\n","import{a as s}from\"./chunk-ANXBDSUI.js\";function x(t,...o){let n=t,u=o.map(e=>\"lazy\"in e?f(e):void 0),p=0;for(;p<o.length;){if(u[p]===void 0||!B(n)){let i=o[p];n=i(n),p+=1;continue}let r=[];for(let i=p;i<o.length;i++){let l=u[i];if(l===void 0||(r.push(l),l.isSingle))break}let a=[];for(let i of n)if(A(i,a,r))break;let{isSingle:y}=r.at(-1);n=y?a[0]:a,p+=r.length}return n}function A(t,o,n){if(n.length===0)return o.push(t),!1;let u=t,p=s,e=!1;for(let[r,a]of n.entries()){let{index:y,items:i}=a;if(i.push(u),p=a(u,y,i),a.index+=1,p.hasNext){if(p.hasMany??!1){for(let l of p.next)if(A(l,o,n.slice(r+1)))return!0;return e}u=p.next}if(!p.hasNext)break;p.done&&(e=!0)}return p.hasNext&&o.push(u),e}function f(t){let{lazy:o,lazyArgs:n}=t,u=o(...n);return Object.assign(u,{isSingle:o.single??!1,index:0,items:[]})}function B(t){return typeof t==\"string\"||typeof t==\"object\"&&t!==null&&Symbol.iterator in t}export{x as a};\n"],"names":[],"mappings":"AAAG,IAAwB,IAAE,EAAC,MAAK,OAAG,SAAQ,MAAE;ACAR,SAAS,EAAE,MAAK,GAAE;AAAC,MAAI,IAAE,GAAE,IAAE,EAAE,IAAI,OAAG,UAAS,IAAE,EAAE,CAAC,IAAE,MAAM,GAAE,IAAE;AAAE,SAAK,IAAE,EAAE,UAAQ;AAAC,QAAG,EAAE,CAAC,MAAI,UAAQ,CAAC,EAAE,CAAC,GAAE;AAAC,UAAI,IAAE,EAAE,CAAC;AAAE,UAAE,EAAE,CAAC,GAAE,KAAG;AAAE;AAAA,IAAQ;AAAC,QAAI,IAAE,CAAA;AAAG,aAAQ,IAAE,GAAE,IAAE,EAAE,QAAO,KAAI;AAAC,UAAI,IAAE,EAAE,CAAC;AAAE,UAAG,MAAI,WAAS,EAAE,KAAK,CAAC,GAAE,EAAE,UAAU;AAAA,IAAK;AAAC,QAAI,IAAE,CAAA;AAAG,aAAQ,KAAK,EAAE,KAAG,EAAE,GAAE,GAAE,CAAC,EAAE;AAAM,QAAG,EAAC,UAAS,EAAC,IAAE,EAAE,GAAG,EAAE;AAAE,QAAE,IAAE,EAAE,CAAC,IAAE,GAAE,KAAG,EAAE;AAAA,EAAM;AAAC,SAAO;AAAC;AAAC,SAAS,EAAE,GAAE,GAAE,GAAE;AAAC,MAAG,EAAE,WAAS,EAAE,QAAO,EAAE,KAAK,CAAC,GAAE;AAAG,MAAI,IAAE,GAAE,IAAE,GAAE,IAAE;AAAG,WAAO,CAAC,GAAE,CAAC,KAAI,EAAE,QAAO,GAAG;AAAC,QAAG,EAAC,OAAM,GAAE,OAAM,EAAC,IAAE;AAAE,QAAG,EAAE,KAAK,CAAC,GAAE,IAAE,EAAE,GAAE,GAAE,CAAC,GAAE,EAAE,SAAO,GAAE,EAAE,SAAQ;AAAC,UAAG,EAAE,WAAS,OAAG;AAAC,iBAAQ,KAAK,EAAE,KAAK,KAAG,EAAE,GAAE,GAAE,EAAE,MAAM,IAAE,CAAC,CAAC,EAAE,QAAM;AAAG,eAAO;AAAA,MAAC;AAAC,UAAE,EAAE;AAAA,IAAI;AAAC,QAAG,CAAC,EAAE,QAAQ;AAAM,MAAE,SAAO,IAAE;AAAA,EAAG;AAAC,SAAO,EAAE,WAAS,EAAE,KAAK,CAAC,GAAE;AAAC;AAAC,SAAS,EAAE,GAAE;AAAC,MAAG,EAAC,MAAK,GAAE,UAAS,EAAC,IAAE,GAAE,IAAE,EAAE,GAAG,CAAC;AAAE,SAAO,OAAO,OAAO,GAAE,EAAC,UAAS,EAAE,UAAQ,OAAG,OAAM,GAAE,OAAM,CAAE,EAAA,CAAC;AAAC;AAAC,SAAS,EAAE,GAAE;AAAC,SAAO,OAAO,KAAG,YAAU,OAAO,KAAG,YAAU,MAAI,QAAM,OAAO,YAAY;AAAC;","x_google_ignoreList":[0,1]}
{"version":3,"file":"chunk-7BKSRZNG.C39W3Wne.js","sources":["../../../../../../node_modules/.pnpm/remeda@2.15.0/node_modules/remeda/dist/chunk-ANXBDSUI.js","../../../../../../node_modules/.pnpm/remeda@2.15.0/node_modules/remeda/dist/chunk-7BKSRZNG.js"],"sourcesContent":["var e={done:!0,hasNext:!1},s={done:!1,hasNext:!1},a=()=>e,o=t=>({hasNext:!0,next:t,done:!1});export{s as a,a as b,o as c};\n","import{a as s}from\"./chunk-ANXBDSUI.js\";function x(t,...o){let n=t,u=o.map(e=>\"lazy\"in e?f(e):void 0),p=0;for(;p<o.length;){if(u[p]===void 0||!B(n)){let i=o[p];n=i(n),p+=1;continue}let r=[];for(let i=p;i<o.length;i++){let l=u[i];if(l===void 0||(r.push(l),l.isSingle))break}let a=[];for(let i of n)if(A(i,a,r))break;let{isSingle:y}=r.at(-1);n=y?a[0]:a,p+=r.length}return n}function A(t,o,n){if(n.length===0)return o.push(t),!1;let u=t,p=s,e=!1;for(let[r,a]of n.entries()){let{index:y,items:i}=a;if(i.push(u),p=a(u,y,i),a.index+=1,p.hasNext){if(p.hasMany??!1){for(let l of p.next)if(A(l,o,n.slice(r+1)))return!0;return e}u=p.next}if(!p.hasNext)break;p.done&&(e=!0)}return p.hasNext&&o.push(u),e}function f(t){let{lazy:o,lazyArgs:n}=t,u=o(...n);return Object.assign(u,{isSingle:o.single??!1,index:0,items:[]})}function B(t){return typeof t==\"string\"||typeof t==\"object\"&&t!==null&&Symbol.iterator in t}export{x as a};\n"],"names":[],"mappings":"AAAG,IAAwB,IAAE,EAAC,MAAK,OAAG,SAAQ,MAAE;ACAR,SAAS,EAAE,MAAK,GAAE;AAAC,MAAI,IAAE,GAAE,IAAE,EAAE,IAAI,OAAG,UAAS,IAAE,EAAE,CAAC,IAAE,MAAM,GAAE,IAAE;AAAE,SAAK,IAAE,EAAE,UAAQ;AAAC,QAAG,EAAE,CAAC,MAAI,UAAQ,CAAC,EAAE,CAAC,GAAE;AAAC,UAAI,IAAE,EAAE,CAAC;AAAE,UAAE,EAAE,CAAC,GAAE,KAAG;AAAE;AAAA,IAAQ;AAAC,QAAI,IAAE,CAAA;AAAG,aAAQ,IAAE,GAAE,IAAE,EAAE,QAAO,KAAI;AAAC,UAAI,IAAE,EAAE,CAAC;AAAE,UAAG,MAAI,WAAS,EAAE,KAAK,CAAC,GAAE,EAAE,UAAU;AAAA,IAAK;AAAC,QAAI,IAAE,CAAA;AAAG,aAAQ,KAAK,EAAE,KAAG,EAAE,GAAE,GAAE,CAAC,EAAE;AAAM,QAAG,EAAC,UAAS,EAAC,IAAE,EAAE,GAAG,EAAE;AAAE,QAAE,IAAE,EAAE,CAAC,IAAE,GAAE,KAAG,EAAE;AAAA,EAAM;AAAC,SAAO;AAAC;AAAC,SAAS,EAAE,GAAE,GAAE,GAAE;AAAC,MAAG,EAAE,WAAS,EAAE,QAAO,EAAE,KAAK,CAAC,GAAE;AAAG,MAAI,IAAE,GAAE,IAAE,GAAE,IAAE;AAAG,WAAO,CAAC,GAAE,CAAC,KAAI,EAAE,QAAO,GAAG;AAAC,QAAG,EAAC,OAAM,GAAE,OAAM,EAAC,IAAE;AAAE,QAAG,EAAE,KAAK,CAAC,GAAE,IAAE,EAAE,GAAE,GAAE,CAAC,GAAE,EAAE,SAAO,GAAE,EAAE,SAAQ;AAAC,UAAG,EAAE,WAAS,OAAG;AAAC,iBAAQ,KAAK,EAAE,KAAK,KAAG,EAAE,GAAE,GAAE,EAAE,MAAM,IAAE,CAAC,CAAC,EAAE,QAAM;AAAG,eAAO;AAAA,MAAC;AAAC,UAAE,EAAE;AAAA,IAAI;AAAC,QAAG,CAAC,EAAE,QAAQ;AAAM,MAAE,SAAO,IAAE;AAAA,EAAG;AAAC,SAAO,EAAE,WAAS,EAAE,KAAK,CAAC,GAAE;AAAC;AAAC,SAAS,EAAE,GAAE;AAAC,MAAG,EAAC,MAAK,GAAE,UAAS,EAAC,IAAE,GAAE,IAAE,EAAE,GAAG,CAAC;AAAE,SAAO,OAAO,OAAO,GAAE,EAAC,UAAS,EAAE,UAAQ,OAAG,OAAM,GAAE,OAAM,CAAE,EAAA,CAAC;AAAC;AAAC,SAAS,EAAE,GAAE;AAAC,SAAO,OAAO,KAAG,YAAU,OAAO,KAAG,YAAU,MAAI,QAAM,OAAO,YAAY;AAAC;","x_google_ignoreList":[0,1]}

2
web/app/themes/haiku-atelier-2024/assets/js/chunk-RU7WR4KH.D5j7HXCF.js.map
View file

@ -1 +1 @@
{"version":3,"file":"chunk-RU7WR4KH.D5j7HXCF.js","sources":["../../../../../../node_modules/.pnpm/remeda@2.14.0/node_modules/remeda/dist/chunk-RU7WR4KH.js"],"sourcesContent":["import{a as t}from\"./chunk-RAAYCPUM.js\";function r(...n){return t(e,n)}function e(n,o){return o(n),n}export{r as a};\n"],"names":["t"],"mappings":";AAAwC,SAAS,KAAK,GAAE;AAAC,SAAOA,EAAE,GAAE,CAAC;AAAC;AAAC,SAAS,EAAE,GAAE,GAAE;AAAC,SAAO,EAAE,CAAC,GAAE;AAAC;","x_google_ignoreList":[0]}
{"version":3,"file":"chunk-RU7WR4KH.D5j7HXCF.js","sources":["../../../../../../node_modules/.pnpm/remeda@2.15.0/node_modules/remeda/dist/chunk-RU7WR4KH.js"],"sourcesContent":["import{a as t}from\"./chunk-RAAYCPUM.js\";function r(...n){return t(e,n)}function e(n,o){return o(n),n}export{r as a};\n"],"names":["t"],"mappings":";AAAwC,SAAS,KAAK,GAAE;AAAC,SAAOA,EAAE,GAAE,CAAC;AAAC;AAAC,SAAS,EAAE,GAAE,GAAE;AAAC,SAAO,EAAE,CAAC,GAAE;AAAC;","x_google_ignoreList":[0]}

32
web/app/themes/haiku-atelier-2024/assets/js/dom.js
View file

@ -17,6 +17,9 @@ const SELECTEUR_CHAMP_QUANTITE_LIGNE_PANIER = "input";
const SELECTEUR_PRIX_LIGNE_PANIER = ".detail-produit__nom-prix span";
const SELECTEUR_SOUS_TOTAL_PANIER = "#panneau-panier .panneau__sous-totaux__ligne strong";
const SELECTEUR_TOTAL_PANIER = "#panneau-panier .panneau__pied-de-page p span";
const SELECTEUR_BOUTON_SEPARATION_ADRESSES = "#separation-adresses";
const SELECTEUR_FORMULAIRE_LIVRAISON = "#panneau-informations-client .panneau__formulaires__livraison";
const SELECTEUR_FORMULAIRE_FACTURATION = "#panneau-informations-client .panneau__formulaires__facturation";
export {
ATTRIBUT_CONTIENT_ARTICLES as A,
SELECTEUR_BOUTON_PANIER as S,
@ -24,18 +27,21 @@ export {
SELECTEUR_CONTENEUR_PANIER as b,
SELECTEUR_SOUS_TOTAL_PANIER as c,
SELECTEUR_TOTAL_PANIER as d,
ATTRIBUT_CLE_PANIER as e,
SELECTEUR_BOUTON_SOUSTRACTION_QUANTITE as f,
SELECTEUR_CHAMP_QUANTITE_LIGNE_PANIER as g,
SELECTEUR_BOUTON_ADDITION_QUANTITE as h,
SELECTEUR_BOUTON_SUPPRESSION_PANIER as i,
SELECTEUR_PRIX_LIGNE_PANIER as j,
ATTRIBUT_DESACTIVE as k,
SELECTEUR_BOUTON_AJOUT_PANIER as l,
SELECTEUR_SELECTEUR_QUANTITE as m,
SELECTEUR_LIENS_ONGLETS as n,
SELECTEUR_SECTIONS_CONTENUS as o,
ATTRIBUT_ARIA_SELECTED as p,
ATTRIBUT_HIDDEN as q
SELECTEUR_BOUTON_SEPARATION_ADRESSES as e,
SELECTEUR_FORMULAIRE_LIVRAISON as f,
SELECTEUR_FORMULAIRE_FACTURATION as g,
ATTRIBUT_CLE_PANIER as h,
SELECTEUR_BOUTON_SOUSTRACTION_QUANTITE as i,
SELECTEUR_CHAMP_QUANTITE_LIGNE_PANIER as j,
SELECTEUR_BOUTON_ADDITION_QUANTITE as k,
SELECTEUR_BOUTON_SUPPRESSION_PANIER as l,
SELECTEUR_PRIX_LIGNE_PANIER as m,
ATTRIBUT_HIDDEN as n,
ATTRIBUT_DESACTIVE as o,
SELECTEUR_BOUTON_AJOUT_PANIER as p,
SELECTEUR_SELECTEUR_QUANTITE as q,
SELECTEUR_LIENS_ONGLETS as r,
SELECTEUR_SECTIONS_CONTENUS as s,
ATTRIBUT_ARIA_SELECTED as t
};
//# sourceMappingURL=dom.js.map

2
web/app/themes/haiku-atelier-2024/assets/js/dom.js.map
View file

@ -1 +1 @@
{"version":3,"file":"dom.js","sources":["../../src/scripts/constantes/dom.ts"],"sourcesContent":["/** Constantes de valeurs pour la manipulation du DOM : sélecteurs et attributs. */\n\nexport const ATTRIBUT_ARIA_SELECTED = \"aria-selected\";\nexport const ATTRIBUT_ARIA_HIDDEN = \"aria-hidden\";\nexport const ATTRIBUT_HIDDEN = \"hidden\";\nexport const ATTRIBUT_CONTIENT_ARTICLES = \"data-contient-articles\";\nexport const ATTRIBUT_DESACTIVE = \"disabled\";\nexport const ATTRIBUT_CLE_PANIER = \"data-cle-panier\";\n\nexport const SELECTEUR_CONTENEUR_PANIER = \"#page-panier\";\nexport const SELECTEUR_BOUTON_PANIER = \".compte-panier a[rel='cart']\";\nexport const SELECTEUR_SELECTEUR_QUANTITE = \"#selecteur-variation\";\nexport const SELECTEUR_BOUTON_AJOUT_PANIER = \"#bouton-ajout-panier\";\nexport const SELECTEUR_LIENS_ONGLETS = \"a[role='tab']\";\nexport const SELECTEUR_SECTIONS_CONTENUS = \"section[role='tabpanel']\";\n\n// Panier\nexport const SELECTEUR_ENTREES_PANIER = \"article\";\nexport const SELECTEUR_BOUTON_SUPPRESSION_PANIER = \"button.detail-produit__actions__suppression\";\nexport const SELECTEUR_BOUTON_SOUSTRACTION_QUANTITE = \"button.detail-produit__actions__soustraction\";\nexport const SELECTEUR_BOUTON_ADDITION_QUANTITE = \"button.detail-produit__actions__addition\";\nexport const SELECTEUR_CHAMP_QUANTITE_LIGNE_PANIER = \"input\";\nexport const SELECTEUR_PRIX_LIGNE_PANIER = \".detail-produit__nom-prix span\";\nexport const SELECTEUR_SOUS_TOTAL_PANIER = \"#panneau-panier .panneau__sous-totaux__ligne strong\";\nexport const SELECTEUR_TOTAL_PANIER = \"#panneau-panier .panneau__pied-de-page p span\";\n"],"names":[],"mappings":"AAEO,MAAM,yBAAyB;AAE/B,MAAM,kBAAkB;AACxB,MAAM,6BAA6B;AACnC,MAAM,qBAAqB;AAC3B,MAAM,sBAAsB;AAE5B,MAAM,6BAA6B;AACnC,MAAM,0BAA0B;AAChC,MAAM,+BAA+B;AACrC,MAAM,gCAAgC;AACtC,MAAM,0BAA0B;AAChC,MAAM,8BAA8B;AAGpC,MAAM,2BAA2B;AACjC,MAAM,sCAAsC;AAC5C,MAAM,yCAAyC;AAC/C,MAAM,qCAAqC;AAC3C,MAAM,wCAAwC;AAC9C,MAAM,8BAA8B;AACpC,MAAM,8BAA8B;AACpC,MAAM,yBAAyB;"}
{"version":3,"file":"dom.js","sources":["../../src/scripts/constantes/dom.ts"],"sourcesContent":["/** Constantes de valeurs pour la manipulation du DOM : sélecteurs et attributs. */\n\nexport const ATTRIBUT_ARIA_SELECTED = \"aria-selected\";\nexport const ATTRIBUT_ARIA_HIDDEN = \"aria-hidden\";\nexport const ATTRIBUT_HIDDEN = \"hidden\";\nexport const ATTRIBUT_CONTIENT_ARTICLES = \"data-contient-articles\";\nexport const ATTRIBUT_DESACTIVE = \"disabled\";\nexport const ATTRIBUT_CLE_PANIER = \"data-cle-panier\";\n\nexport const SELECTEUR_CONTENEUR_PANIER = \"#page-panier\";\nexport const SELECTEUR_BOUTON_PANIER = \".compte-panier a[rel='cart']\";\nexport const SELECTEUR_SELECTEUR_QUANTITE = \"#selecteur-variation\";\nexport const SELECTEUR_BOUTON_AJOUT_PANIER = \"#bouton-ajout-panier\";\nexport const SELECTEUR_LIENS_ONGLETS = \"a[role='tab']\";\nexport const SELECTEUR_SECTIONS_CONTENUS = \"section[role='tabpanel']\";\n\n// Panier\nexport const SELECTEUR_ENTREES_PANIER = \"article\";\nexport const SELECTEUR_BOUTON_SUPPRESSION_PANIER = \"button.detail-produit__actions__suppression\";\nexport const SELECTEUR_BOUTON_SOUSTRACTION_QUANTITE = \"button.detail-produit__actions__soustraction\";\nexport const SELECTEUR_BOUTON_ADDITION_QUANTITE = \"button.detail-produit__actions__addition\";\nexport const SELECTEUR_CHAMP_QUANTITE_LIGNE_PANIER = \"input\";\nexport const SELECTEUR_PRIX_LIGNE_PANIER = \".detail-produit__nom-prix span\";\nexport const SELECTEUR_SOUS_TOTAL_PANIER = \"#panneau-panier .panneau__sous-totaux__ligne strong\";\nexport const SELECTEUR_TOTAL_PANIER = \"#panneau-panier .panneau__pied-de-page p span\";\nexport const SELECTEUR_BOUTON_SEPARATION_ADRESSES = \"#separation-adresses\";\nexport const SELECTEUR_FORMULAIRE_LIVRAISON = \"#panneau-informations-client .panneau__formulaires__livraison\";\nexport const SELECTEUR_FORMULAIRE_FACTURATION = \"#panneau-informations-client .panneau__formulaires__facturation\";\n"],"names":[],"mappings":"AAEO,MAAM,yBAAyB;AAE/B,MAAM,kBAAkB;AACxB,MAAM,6BAA6B;AACnC,MAAM,qBAAqB;AAC3B,MAAM,sBAAsB;AAE5B,MAAM,6BAA6B;AACnC,MAAM,0BAA0B;AAChC,MAAM,+BAA+B;AACrC,MAAM,gCAAgC;AACtC,MAAM,0BAA0B;AAChC,MAAM,8BAA8B;AAGpC,MAAM,2BAA2B;AACjC,MAAM,sCAAsC;AAC5C,MAAM,yCAAyC;AAC/C,MAAM,qCAAqC;AAC3C,MAAM,wCAAwC;AAC9C,MAAM,8BAA8B;AACpC,MAAM,8BAA8B;AACpC,MAAM,yBAAyB;AAC/B,MAAM,uCAAuC;AAC7C,MAAM,iCAAiC;AACvC,MAAM,mCAAmC;"}

2
web/app/themes/haiku-atelier-2024/assets/js/dom2.js.map
View file

File diff suppressed because one or more lines are too long

2
web/app/themes/haiku-atelier-2024/assets/js/index.DD7qm8S6.js.map
View file

File diff suppressed because one or more lines are too long

20
web/app/themes/haiku-atelier-2024/assets/js/scripts-page-panier.js
View file

@ -3,7 +3,7 @@ import { a as recupereElementsDocumentEither, r as recupereElementDocumentEither
import { x } from "./chunk-7BKSRZNG.C39W3Wne.js";
import { p as parse } from "./index.DD7qm8S6.js";
import { R as ROUTE_API_RETIRE_ARTICLE_PANIER, b as ROUTE_API_MAJ_ARTICLE_PANIER } from "./api2.js";
import { a as SELECTEUR_ENTREES_PANIER, b as SELECTEUR_CONTENEUR_PANIER, c as SELECTEUR_SOUS_TOTAL_PANIER, d as SELECTEUR_TOTAL_PANIER, e as ATTRIBUT_CLE_PANIER, f as SELECTEUR_BOUTON_SOUSTRACTION_QUANTITE, g as SELECTEUR_CHAMP_QUANTITE_LIGNE_PANIER, h as SELECTEUR_BOUTON_ADDITION_QUANTITE, i as SELECTEUR_BOUTON_SUPPRESSION_PANIER, A as ATTRIBUT_CONTIENT_ARTICLES, j as SELECTEUR_PRIX_LIGNE_PANIER, k as ATTRIBUT_DESACTIVE } from "./dom.js";
import { a as SELECTEUR_ENTREES_PANIER, b as SELECTEUR_CONTENEUR_PANIER, c as SELECTEUR_SOUS_TOTAL_PANIER, d as SELECTEUR_TOTAL_PANIER, e as SELECTEUR_BOUTON_SEPARATION_ADRESSES, f as SELECTEUR_FORMULAIRE_LIVRAISON, g as SELECTEUR_FORMULAIRE_FACTURATION, h as ATTRIBUT_CLE_PANIER, i as SELECTEUR_BOUTON_SOUSTRACTION_QUANTITE, j as SELECTEUR_CHAMP_QUANTITE_LIGNE_PANIER, k as SELECTEUR_BOUTON_ADDITION_QUANTITE, l as SELECTEUR_BOUTON_SUPPRESSION_PANIER, A as ATTRIBUT_CONTIENT_ARTICLES, m as SELECTEUR_PRIX_LIGNE_PANIER, n as ATTRIBUT_HIDDEN, o as ATTRIBUT_DESACTIVE } from "./dom.js";
import { N as NOM_CANAL_BOUTON_PANIER, a as NOM_CANAL_CONTENU_PANIER } from "./messages3.js";
import { r as recupereElementOuLeve, a as recupereElementAvecSelecteur } from "./dom2.js";
import { l as leveServerError, r as reporteErreur } from "./erreurs.js";
@ -35,6 +35,18 @@ const TOTAL_PANIER = x(
recupereElementDocumentEither(SELECTEUR_TOTAL_PANIER),
recupereElementOuLeve
);
const BOUTON_SEPARATION_ADRESSES = x(
recupereElementDocumentEither(SELECTEUR_BOUTON_SEPARATION_ADRESSES),
recupereElementOuLeve
);
x(
recupereElementDocumentEither(SELECTEUR_FORMULAIRE_LIVRAISON),
recupereElementOuLeve
);
const FORMULAIRE_FACTURATION = x(
recupereElementDocumentEither(SELECTEUR_FORMULAIRE_FACTURATION),
recupereElementOuLeve
);
const recupereElementDansEntreePanierOuLeve = (entree) => (selecteur) => x(
recupereElementAvecSelecteur(entree)(selecteur),
recupereElementOuLeve
@ -237,9 +249,15 @@ const initialiseMajContenuPanier = () => {
});
};
};
const initialiseMajFormulairesPanier = () => {
BOUTON_SEPARATION_ADRESSES.addEventListener("click", () => {
BOUTON_SEPARATION_ADRESSES.checked ? FORMULAIRE_FACTURATION.removeAttribute(ATTRIBUT_HIDDEN) : FORMULAIRE_FACTURATION.setAttribute(ATTRIBUT_HIDDEN, "");
});
};
document.addEventListener("DOMContentLoaded", () => {
initialiseMajEntreesPanier();
initialiseMajConteneurPanier();
initialiseMajContenuPanier();
initialiseMajFormulairesPanier();
});
//# sourceMappingURL=scripts-page-panier.js.map

2
web/app/themes/haiku-atelier-2024/assets/js/scripts-page-panier.js.map
View file

File diff suppressed because one or more lines are too long

2
web/app/themes/haiku-atelier-2024/assets/js/scripts-page-produit.js
View file

@ -4,7 +4,7 @@ import { x } from "./chunk-7BKSRZNG.C39W3Wne.js";
import { z, N } from "./index.CeK6pfoJ.js";
import { p as parse } from "./index.DD7qm8S6.js";
import { c as ROUTE_API_AJOUTE_ARTICLE_PANIER, d as ENTETE_WC_NONCE } from "./api2.js";
import { l as SELECTEUR_BOUTON_AJOUT_PANIER, m as SELECTEUR_SELECTEUR_QUANTITE, n as SELECTEUR_LIENS_ONGLETS, o as SELECTEUR_SECTIONS_CONTENUS, p as ATTRIBUT_ARIA_SELECTED, q as ATTRIBUT_HIDDEN, k as ATTRIBUT_DESACTIVE } from "./dom.js";
import { p as SELECTEUR_BOUTON_AJOUT_PANIER, q as SELECTEUR_SELECTEUR_QUANTITE, r as SELECTEUR_LIENS_ONGLETS, s as SELECTEUR_SECTIONS_CONTENUS, t as ATTRIBUT_ARIA_SELECTED, n as ATTRIBUT_HIDDEN, o as ATTRIBUT_DESACTIVE } from "./dom.js";
import { r as recupereElementOuLeve, b as recupereElementsOuLeve } from "./dom2.js";
import { l as leveServerError, a as leveBadRequestError, b as leveUnauthorizedError, c as leveNotFoundError, E as ErreurInconnue, d as leveErreur, r as reporteErreur } from "./erreurs.js";
import { b as estHTMLSelectElement, e as estReponse500, a as estError } from "./gardes.js";

2
web/app/themes/haiku-atelier-2024/assets/js/utils.js.map
View file

@ -1 +1 @@
{"version":3,"file":"utils.js","sources":["../../../../../../node_modules/.pnpm/remeda@2.14.0/node_modules/remeda/dist/chunk-K26VP6CL.js","../../../../../../node_modules/.pnpm/remeda@2.14.0/node_modules/remeda/dist/chunk-RAAYCPUM.js","../../../../../../node_modules/.pnpm/remeda@2.14.0/node_modules/remeda/dist/chunk-VROY5Y5B.js","../../src/scripts/lib/utils.ts"],"sourcesContent":["function u(t,n,a){let o=r=>t(r,...n);return a===void 0?o:Object.assign(o,{lazy:a,lazyArgs:n})}export{u as a};\n","import{a as t}from\"./chunk-K26VP6CL.js\";function u(r,n,a){let o=r.length-n.length;if(o===0)return r(...n);if(o===1)return t(r,n,a);throw new Error(\"Wrong number of arguments\")}export{u as a};\n","import{a as n}from\"./chunk-RAAYCPUM.js\";function p(...o){return n(t,o)}var t=(o,e)=>o[e];export{p as a,t as b};\n","import { type Either, Maybe } from \"purify-ts\";\nimport { prop } from \"remeda\";\n\nimport { recupereElementAvecSelecteur, recupereElementsAvecSelecteur } from \"./dom.ts\";\nimport { CleNonTrouveError } from \"./erreurs.ts\";\n\nexport const recupereElementsDocumentEither: <E extends Element = Element>(\n selecteur: string,\n) => Either<SyntaxError, Array<E>> = recupereElementsAvecSelecteur(document);\n\nexport const recupereElementDocumentEither: <E extends Element = Element>(selecteur: string) => Either<SyntaxError, E> =\n recupereElementAvecSelecteur(document);\n\nexport const propEither = <T, K extends keyof T>(cle: K) => (donnees: T): Either<CleNonTrouveError, T[K]> =>\n Maybe\n .fromNullable(prop(donnees, cle))\n .toEither(\n new CleNonTrouveError(`La clé « ${String(cle)} » n'a pas été trouvé dans l'objet.`, { objet: donnees }),\n );\n"],"names":["u","t","n","prop"],"mappings":";;;;;AAAA,SAASA,IAAEC,IAAE,GAAE,GAAE;AAAC,MAAI,IAAE,OAAGA,GAAE,GAAE,GAAG,CAAC;AAAE,SAAO,MAAI,SAAO,IAAE,OAAO,OAAO,GAAE,EAAC,MAAK,GAAE,UAAS,EAAC,CAAC;AAAC;ACArD,SAAS,EAAE,GAAE,GAAE,GAAE;AAAC,MAAI,IAAE,EAAE,SAAO,EAAE;AAAO,MAAG,MAAI,EAAE,QAAO,EAAE,GAAG,CAAC;AAAE,MAAG,MAAI,EAAE,QAAOA,IAAE,GAAE,GAAE,CAAC;AAAE,QAAM,IAAI,MAAM,2BAA2B;AAAC;ACAvI,SAAS,KAAK,GAAE;AAAC,SAAOC,EAAE,GAAE,CAAC;AAAC;AAAC,IAAI,IAAE,CAAC,GAAE,MAAI,EAAE,CAAC;ACM1E,MAAA,iCAEwB,8BAA8B,QAAQ;AAE9D,MAAA,gCACX,6BAA6B,QAAQ;AAE1B,MAAA,aAAa,CAAuB,QAAW,CAAC,YAC3D,MACG,aAAaC,EAAK,SAAS,GAAG,CAAC,EAC/B;AAAA,EACC,IAAI,kBAAkB,YAAY,OAAO,GAAG,CAAC,uCAAuC,EAAE,OAAO,SAAS;AACxG;","x_google_ignoreList":[0,1,2]}
{"version":3,"file":"utils.js","sources":["../../../../../../node_modules/.pnpm/remeda@2.15.0/node_modules/remeda/dist/chunk-K26VP6CL.js","../../../../../../node_modules/.pnpm/remeda@2.15.0/node_modules/remeda/dist/chunk-RAAYCPUM.js","../../../../../../node_modules/.pnpm/remeda@2.15.0/node_modules/remeda/dist/chunk-VROY5Y5B.js","../../src/scripts/lib/utils.ts"],"sourcesContent":["function u(t,n,a){let o=r=>t(r,...n);return a===void 0?o:Object.assign(o,{lazy:a,lazyArgs:n})}export{u as a};\n","import{a as t}from\"./chunk-K26VP6CL.js\";function u(r,n,a){let o=r.length-n.length;if(o===0)return r(...n);if(o===1)return t(r,n,a);throw new Error(\"Wrong number of arguments\")}export{u as a};\n","import{a as n}from\"./chunk-RAAYCPUM.js\";function p(...o){return n(t,o)}var t=(o,e)=>o[e];export{p as a,t as b};\n","import { type Either, Maybe } from \"purify-ts\";\nimport { prop } from \"remeda\";\n\nimport { recupereElementAvecSelecteur, recupereElementsAvecSelecteur } from \"./dom.ts\";\nimport { CleNonTrouveError } from \"./erreurs.ts\";\n\nexport const recupereElementsDocumentEither: <E extends Element = Element>(\n selecteur: string,\n) => Either<SyntaxError, Array<E>> = recupereElementsAvecSelecteur(document);\n\nexport const recupereElementDocumentEither: <E extends Element = Element>(selecteur: string) => Either<SyntaxError, E> =\n recupereElementAvecSelecteur(document);\n\nexport const propEither = <T, K extends keyof T>(cle: K) => (donnees: T): Either<CleNonTrouveError, T[K]> =>\n Maybe\n .fromNullable(prop(donnees, cle))\n .toEither(\n new CleNonTrouveError(`La clé « ${String(cle)} » n'a pas été trouvé dans l'objet.`, { objet: donnees }),\n );\n"],"names":["u","t","n","prop"],"mappings":";;;;;AAAA,SAASA,IAAEC,IAAE,GAAE,GAAE;AAAC,MAAI,IAAE,OAAGA,GAAE,GAAE,GAAG,CAAC;AAAE,SAAO,MAAI,SAAO,IAAE,OAAO,OAAO,GAAE,EAAC,MAAK,GAAE,UAAS,EAAC,CAAC;AAAC;ACArD,SAAS,EAAE,GAAE,GAAE,GAAE;AAAC,MAAI,IAAE,EAAE,SAAO,EAAE;AAAO,MAAG,MAAI,EAAE,QAAO,EAAE,GAAG,CAAC;AAAE,MAAG,MAAI,EAAE,QAAOA,IAAE,GAAE,GAAE,CAAC;AAAE,QAAM,IAAI,MAAM,2BAA2B;AAAC;ACAvI,SAAS,KAAK,GAAE;AAAC,SAAOC,EAAE,GAAE,CAAC;AAAC;AAAC,IAAI,IAAE,CAAC,GAAE,MAAI,EAAE,CAAC;ACM1E,MAAA,iCAEwB,8BAA8B,QAAQ;AAE9D,MAAA,gCACX,6BAA6B,QAAQ;AAE1B,MAAA,aAAa,CAAuB,QAAW,CAAC,YAC3D,MACG,aAAaC,EAAK,SAAS,GAAG,CAAC,EAC/B;AAAA,EACC,IAAI,kBAAkB,YAAY,OAAO,GAAG,CAAC,uCAAuC,EAAE,OAAO,SAAS;AACxG;","x_google_ignoreList":[0,1,2]}

9
web/app/themes/haiku-atelier-2024/page-cart.php
View file

@ -42,6 +42,15 @@ $contexte["total_panier"] = $total_panier;
$contexte["sous_total_panier"] = $sous_total_panier;
$contexte["produits_panier"] = $panier;
// Récupère les Pays pris en charge par WooCommerce
// $countries_obj = new WC_Shipping_Zones();
// $chosen_shipping_methods = WC()->session;
echo "<pre>";
// print_r($countries_obj);
// print_r($chosen_shipping_methods);
echo "</pre>";
// Charge les scripts et styles de la page
function charge_scripts_styles_page_panier(): void {
wp_enqueue_style(

1
web/app/themes/haiku-atelier-2024/src/sass/base/elements/_boutons.scss
View file

@ -6,7 +6,6 @@
button {
all: initial;
cursor: pointer;
font: inherit;
text-align: center;
&.bouton-case-pleine {

71
web/app/themes/haiku-atelier-2024/src/sass/base/elements/_formulaires.scss Normal file
View file

@ -0,0 +1,71 @@
// Styles de base pour les éléments de formulaires.
input, select, textarea {
padding: var(--espace-xs);
background: var(--couleur-gris);
border: 1px solid var(--couleur-noir);
outline: 1px solid transparent;
transition: 0.2s background, 0.2s outline;
&:focus, &:focus-visible {
background: var(--couleur-jaune);
outline: 1px solid var(--couleur-noir);
}
}
input:is([type="email"], [type="text"], [type="tel"]), textarea {
&::placeholder {
text-transform: lowercase;
}
&::selection {
color: var(--couleur-blanc);
background: var(--couleur-noir);
}
&:user-valid {
background: var(--couleur-jaune);
}
&:user-invalid {
background: var(--couleur-gris);
}
// &:user-invalid {
// border-color: red;
// }
}
input, label, select, textarea {
cursor: pointer;
}
// Champs
input[type="checkbox"], input[type="radio"] {
width: var(--espace-l);
height: var(--espace-l);
padding: initial;
appearance: none;
border: 1px solid var(--couleur-noir);
transition: 0.2s background;
&:checked {
background: var(--couleur-jaune);
// TODO: Utiliser un SVG plutôt qu'un « x » ?
&::before {
content: "x";
position: relative;
bottom: 15%;
left: 29%;
}
}
/**
* 1. Pour un alignement parfait du label avec la case à cocher.
*/
label:has(~ &), + label {
padding-top: 1px; /* 1 */
font-size: 0.9rem;
}
}

144
web/app/themes/haiku-atelier-2024/src/sass/layouts/_panneau-informations-client.scss Normal file
View file

@ -0,0 +1,144 @@
// Styles pour le panneau « Your info » du Panier
#panneau-informations-client {
> * {
align-content: center;
text-align: center;
}
// PayPal Express Checkout
.panneau__paypal-express {
// Dimensions
--hauteur-images-bouton: 18px;
--hauteur-bouton: calc(var(--hauteur-images-bouton) * 2);
--longueur-bouton: 250px;
// Espaces et marges
--espacement-inter-images: var(--espace-xs);
padding: var(--espace-xl);
border-bottom: 1px solid var(--couleur-noir);
p {
margin-bottom: var(--espace-s);
font-style: italic;
}
// Bouton « PayPal »
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);
img {
height: var(--hauteur-images-bouton);
background: inherit;
}
img:first-of-type {
margin-top: -1px;
}
}
}
// Formulaires
.panneau__formulaires {
padding: var(--espace-xl) 0;
.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.9rem;
font-style: italic;
label {
text-transform: lowercase;
}
}
}
.formulaire {
margin: auto;
padding: 0 var(--espace-xl);
[hidden] {
display: none;
}
+ .formulaire {
margin-top: var(--espace-xl);
}
.formulaire__titre {
margin-bottom: var(--espace-m);
font-size: 1.25rem;
font-weight: 600;
font-style: italic;
letter-spacing: 1px;
}
.formulaire__champs {
width: fit-content;
margin: auto;
text-align: left;
.formulaire__champs__champ {
display: flex;
flex-flow: row nowrap;
column-gap: var(--espace-xl);
place-items: center;
justify-content: space-between;
// width: min(25rem, 100%);
+ .formulaire__champs__champ {
margin-top: var(--espace-l);
}
}
}
label {
font-weight: 400;
text-transform: lowercase;
&:has(+ :is(input:required, select:required)) {
font-weight: 600;
}
}
input {
width: 15rem;
}
}
// Total de la commande
.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);
button {
font: inherit;
color: inherit;
text-transform: inherit;
letter-spacing: inherit;
}
}
}

41
web/app/themes/haiku-atelier-2024/src/sass/layouts/_panneau-panier.scss
View file

@ -89,7 +89,6 @@
width: 100%;
text-align: center;
appearance: textfield; /* 1 */
background: initial;
border: initial;
border-right: 1px solid var(--couleur-noir);
border-left: 1px solid var(--couleur-noir);
@ -164,37 +163,6 @@
gap: 1ch;
place-items: center;
}
input, label {
cursor: pointer;
}
// TODO: Utiliser un SVG plutôt qu'un « x » ?
input[type="radio"] {
width: var(--espace-l);
height: var(--espace-l);
appearance: none;
border: 1px solid var(--couleur-noir);
&:checked {
background: var(--couleur-jaune);
&::before {
content: "x";
position: relative;
bottom: 25%;
left: 25%;
}
}
}
/**
* 1. Pour un alignement parfait du label avec la case à cocher.
*/
label {
padding-top: 1px; /* 1 */
font-size: 0.9rem;
}
}
}
@ -229,14 +197,7 @@
margin: auto;
input {
width: 30ch;
padding: var(--espace-xs);
background: var(--couleur-gris);
border: 1px solid var(--couleur-noir);
&::placeholder {
text-transform: lowercase;
}
width: 20rem;
}
button {

1
web/app/themes/haiku-atelier-2024/src/sass/main.scss
View file

@ -8,6 +8,7 @@
// 1.2 Éléments
@use "base/elements/boutons" as boutons;
@use "base/elements/formulaires" as formulaires;
@use "base/elements/images" as images;
@use "base/elements/liens" as liens;
@use "base/elements/listes" as listes;

1
web/app/themes/haiku-atelier-2024/src/sass/pages/page-panier.scss
View file

@ -1,6 +1,7 @@
// Styles pour la page Panier (« Cart »)
@forward "../layouts/panneau-panier";
@forward "../layouts/panneau-informations-client";
/**
* 1. Applique une marge supérieure égale à la hauteur de l'en-tête pour qu'elle puisse s'afficher

3
web/app/themes/haiku-atelier-2024/src/scripts/constantes/dom.ts
View file

@ -23,3 +23,6 @@ export const SELECTEUR_CHAMP_QUANTITE_LIGNE_PANIER = "input";
export const SELECTEUR_PRIX_LIGNE_PANIER = ".detail-produit__nom-prix span";
export const SELECTEUR_SOUS_TOTAL_PANIER = "#panneau-panier .panneau__sous-totaux__ligne strong";
export const SELECTEUR_TOTAL_PANIER = "#panneau-panier .panneau__pied-de-page p span";
export const SELECTEUR_BOUTON_SEPARATION_ADRESSES = "#separation-adresses";
export const SELECTEUR_FORMULAIRE_LIVRAISON = "#panneau-informations-client .panneau__formulaires__livraison";
export const SELECTEUR_FORMULAIRE_FACTURATION = "#panneau-informations-client .panneau__formulaires__facturation";

25
web/app/themes/haiku-atelier-2024/src/scripts/scripts-page-panier.ts
View file

@ -13,12 +13,16 @@ import {
ATTRIBUT_CLE_PANIER,
ATTRIBUT_CONTIENT_ARTICLES,
ATTRIBUT_DESACTIVE,
ATTRIBUT_HIDDEN,
SELECTEUR_BOUTON_ADDITION_QUANTITE,
SELECTEUR_BOUTON_SEPARATION_ADRESSES,
SELECTEUR_BOUTON_SOUSTRACTION_QUANTITE,
SELECTEUR_BOUTON_SUPPRESSION_PANIER,
SELECTEUR_CHAMP_QUANTITE_LIGNE_PANIER,
SELECTEUR_CONTENEUR_PANIER,
SELECTEUR_ENTREES_PANIER,
SELECTEUR_FORMULAIRE_FACTURATION,
SELECTEUR_FORMULAIRE_LIVRAISON,
SELECTEUR_PRIX_LIGNE_PANIER,
SELECTEUR_SOUS_TOTAL_PANIER,
SELECTEUR_TOTAL_PANIER,
@ -72,6 +76,18 @@ const TOTAL_PANIER: HTMLParagraphElement = pipe(
recupereElementDocumentEither<HTMLParagraphElement>(SELECTEUR_TOTAL_PANIER),
recupereElementOuLeve,
);
const BOUTON_SEPARATION_ADRESSES: HTMLInputElement = pipe(
recupereElementDocumentEither<HTMLInputElement>(SELECTEUR_BOUTON_SEPARATION_ADRESSES),
recupereElementOuLeve,
);
const FORMULAIRE_LIVRAISON: HTMLDivElement = pipe(
recupereElementDocumentEither<HTMLDivElement>(SELECTEUR_FORMULAIRE_LIVRAISON),
recupereElementOuLeve,
);
const FORMULAIRE_FACTURATION: HTMLDivElement = pipe(
recupereElementDocumentEither<HTMLDivElement>(SELECTEUR_FORMULAIRE_FACTURATION),
recupereElementOuLeve,
);
/**
* Fonction utilitaire pour récupérer un Élément dans une ligne (entrée) du Panier, en levant une
@ -379,8 +395,17 @@ const initialiseMajContenuPanier = (): void => {
};
};
const initialiseMajFormulairesPanier = (): void => {
BOUTON_SEPARATION_ADRESSES.addEventListener("click", () => {
BOUTON_SEPARATION_ADRESSES.checked
? FORMULAIRE_FACTURATION.removeAttribute(ATTRIBUT_HIDDEN)
: FORMULAIRE_FACTURATION.setAttribute(ATTRIBUT_HIDDEN, "");
});
};
document.addEventListener("DOMContentLoaded", (): void => {
initialiseMajEntreesPanier();
initialiseMajConteneurPanier();
initialiseMajContenuPanier();
initialiseMajFormulairesPanier();
});

7
web/app/themes/haiku-atelier-2024/views/panier.twig
View file

@ -20,13 +20,8 @@
<main id="page-panier" data-contient-articles="{{ articles_presents }}">
{# « Your Cart » #}
{% include "parts/pages/panier/panneau-panier.twig" %}
{# Your Info #}
<section class="panneau" id="panneau-informations-client">
<header class="panneau__en-tete">
<h2>Your info</h2>
</header>
</section>
{% include "parts/pages/panier/panneau-informations-client.twig" %}
<div class="panier-vide">
<p>Sorry! Your cart is empty.</p>

260
web/app/themes/haiku-atelier-2024/views/parts/pages/panier/panneau-informations-client.twig Normal file
View file

@ -0,0 +1,260 @@
<section class="panneau" id="panneau-informations-client">
<header class="panneau__en-tete">
<h2>Your info</h2>
</header>
{# « PayPal Express Checkout » #}
<div class="panneau__paypal-express">
<p>Express Check-out</p>
{# Bouton PayPal #}
<button type="button">
<img
alt="PayPal's Logo"
height="18"
src="{{ site.theme.link }}/assets/img/paypal/logo-paypal.svg"
width="13.48"
>
<img
alt="PayPal"
height="18"
src="{{ site.theme.link }}/assets/img/paypal/titre-paypal.svg"
width="67.69"
>
</button>
</div>
<form action="" class="panneau__formulaires" method="post">
{# Formulaires pour la livraison et facturation #}
<div class="panneau__formulaires__separation-adresses">
<input id="separation-adresses" name="separation-adresses" type="checkbox">
<label for="separation-adresses">Use a separate billing address</label>
</div>
<div class="panneau__formulaires__livraison formulaire">
<h3 class="formulaire__titre">Delivery:</h3>
<div class="formulaire__champs">
<div class="formulaire__champs__champ">
<label for="livraison-prenom">First name</label>
<input
autocomplete="given-name"
id="livraison-prenom"
name="livraison-prenom"
minlength="2"
required
type="text"
/>
</div>
<div class="formulaire__champs__champ">
<label for="livraison-nom">Last name</label>
<input
autocomplete="family-name"
id="livraison-nom"
name="livraison-nom"
minlength="2"
required
type="text"
/>
</div>
<div class="formulaire__champs__champ">
<label for="livraison-adresse">Address</label>
<input
autocomplete="street-address"
id="livraison-adresse"
name="livraison-adresse"
required
type="text"
/>
</div>
<div class="formulaire__champs__champ">
<label for="livraison-code-postal">Postcode</label>
<input
autocomplete="postal-code"
id="livraison-code-postal"
minlength="3"
name="livraison-code-postal"
required
type="text"
/>
</div>
<div class="formulaire__champs__champ">
<label for="livraison-ville">City</label>
<input
autocomplete="address-level2"
id="livraison-ville"
minlength="2"
name="livraison-ville"
required
type="text"
/>
</div>
<div class="formulaire__champs__champ">
<label for="livraison-region-etat">Region/State</label>
<input
autocomplete="address-level1"
id="livraison-region-etat"
name="livraison-region-etat"
placeholder="If applicable"
type="text"
/>
</div>
<div class="formulaire__champs__champ">
<label for="livraison-pays">Country</label>
<select
id="livraison-pays"
name="livraison-pays"
required
>
</select>
</div>
<div class="formulaire__champs__champ">
<label for="livraison-telephone">Phone</label>
<input
autocomplete="tel"
id="livraison-telephone"
minlength="6"
name="livraison-telephone"
placeholder="+33 6 03 03 03 03"
required
type="tel"
/>
</div>
<div class="formulaire__champs__champ">
<label for="livraison-email">Email Address</label>
<input
autocomplete="email"
id="livraison-email"
minlength="4"
name="livraison-email"
placeholder="moshimoshi@email.com"
required
type="email"
/>
</div>
</div>
</div>
<div class="panneau__formulaires__facturation formulaire" hidden>
<h3 class="formulaire__titre">Billing:</h3>
<div class="formulaire__champs">
<div class="formulaire__champs__champ">
<label for="facturation-prenom">First name</label>
<input
autocomplete="given-name"
id="facturation-prenom"
name="facturation-prenom"
required
type="text"
/>
</div>
<div class="formulaire__champs__champ">
<label for="facturation-nom">Last name</label>
<input
autocomplete="family-name"
id="facturation-nom"
name="facturation-nom"
required
type="text"
/>
</div>
<div class="formulaire__champs__champ">
<label for="facturation-adresse">Address</label>
<input
autocomplete="street-address"
id="facturation-adresse"
name="facturation-adresse"
required
type="text"
/>
</div>
<div class="formulaire__champs__champ">
<label for="facturation-code-postal">Postcode</label>
<input
autocomplete="postal-code"
id="facturation-code-postal"
name="facturation-code-postal"
required
type="text"
/>
</div>
<div class="formulaire__champs__champ">
<label for="facturation-ville">City</label>
<input
autocomplete="address-level2"
id="facturation-ville"
name="facturation-ville"
required
type="text"
/>
</div>
<div class="formulaire__champs__champ">
<label for="facturation-region-etat">Region/State</label>
<input
autocomplete="address-level1"
id="facturation-region-etat"
name="facturation-region-etat"
placeholder="If applicable"
type="text"
/>
</div>
<div class="formulaire__champs__champ">
<label for="facturation-pays">Country</label>
<select
id="facturation-pays"
name="facturation-pays"
required
>
</select>
</div>
<div class="formulaire__champs__champ">
<label for="facturation-telephone">Phone</label>
<input
autocomplete="tel"
id="facturation-telephone"
name="facturation-telephone"
placeholder="+33 6 03 43 60 16"
required
type="tel"
/>
</div>
<div class="formulaire__champs__champ">
<label for="facturation-email">Email Address</label>
<input
autocomplete="email"
id="facturation-email"
name="facturation-email"
placeholder="moshimoshi@email.com"
required
type="email"
/>
</div>
</div>
</div>
<div class="panneau__formulaires__paiement formulaire">
<h3 class="formulaire__titre">Payment:</h3>
</div>
</form>
<footer class="panneau__pied-de-page">
<button type="submit">Check-out</button>
</footer>
</section>