2024-12-09
This commit is contained in:
parent
110d5e6745
commit
ace47f1701
42 changed files with 1556 additions and 691 deletions
|
|
@ -3,7 +3,10 @@
|
|||
<head>
|
||||
<!-- #ddev-generated -->
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1.0"
|
||||
>
|
||||
<title>vite not running</title>
|
||||
<style>
|
||||
html, body {
|
||||
|
|
@ -26,7 +29,7 @@
|
|||
}
|
||||
|
||||
body {
|
||||
background: #dddddd;
|
||||
background: #ddd;
|
||||
display: grid;
|
||||
align-items: center;
|
||||
justify-items: center;
|
||||
|
|
@ -38,9 +41,9 @@
|
|||
|
||||
main {
|
||||
max-width: 36rem;
|
||||
background: #ffffff;
|
||||
background: #fff;
|
||||
padding: 1.5rem;
|
||||
border: 1px #999999 solid;
|
||||
border: 1px #999 solid;
|
||||
}
|
||||
|
||||
code {
|
||||
|
|
|
|||
|
|
@ -43,6 +43,7 @@
|
|||
"wpackagist-plugin/query-monitor": "^3.17.0",
|
||||
"wpackagist-plugin/redis-cache": "^2.5.4",
|
||||
"wpackagist-plugin/wc-multishipping": "^2.5.4",
|
||||
"wpackagist-plugin/woo-preview-emails": "^2.2.13",
|
||||
"wpackagist-plugin/woocommerce": "^9.4.3",
|
||||
"wpackagist-plugin/wp-mail-logging": "^1.13.1",
|
||||
"wpackagist-plugin/wp-mail-smtp": "^4.2",
|
||||
|
|
|
|||
40
composer.lock
generated
40
composer.lock
generated
|
|
@ -4,7 +4,7 @@
|
|||
"Read more about it at https://getcomposer.org/doc/01-basic-usage.md#installing-dependencies",
|
||||
"This file is @generated automatically"
|
||||
],
|
||||
"content-hash": "2410b3c293c63aaed50ade0d8d3a2846",
|
||||
"content-hash": "c785707c9df9c91d85b0ebd9d836de05",
|
||||
"packages": [
|
||||
{
|
||||
"name": "brick/math",
|
||||
|
|
@ -2453,8 +2453,8 @@
|
|||
"type": "library",
|
||||
"extra": {
|
||||
"thanks": {
|
||||
"name": "symfony/polyfill",
|
||||
"url": "https://github.com/symfony/polyfill"
|
||||
"url": "https://github.com/symfony/polyfill",
|
||||
"name": "symfony/polyfill"
|
||||
}
|
||||
},
|
||||
"autoload": {
|
||||
|
|
@ -2606,8 +2606,8 @@
|
|||
"type": "library",
|
||||
"extra": {
|
||||
"thanks": {
|
||||
"name": "symfony/polyfill",
|
||||
"url": "https://github.com/symfony/polyfill"
|
||||
"url": "https://github.com/symfony/polyfill",
|
||||
"name": "symfony/polyfill"
|
||||
}
|
||||
},
|
||||
"autoload": {
|
||||
|
|
@ -2686,8 +2686,8 @@
|
|||
"type": "library",
|
||||
"extra": {
|
||||
"thanks": {
|
||||
"name": "symfony/polyfill",
|
||||
"url": "https://github.com/symfony/polyfill"
|
||||
"url": "https://github.com/symfony/polyfill",
|
||||
"name": "symfony/polyfill"
|
||||
}
|
||||
},
|
||||
"autoload": {
|
||||
|
|
@ -2762,8 +2762,8 @@
|
|||
"type": "library",
|
||||
"extra": {
|
||||
"thanks": {
|
||||
"name": "symfony/polyfill",
|
||||
"url": "https://github.com/symfony/polyfill"
|
||||
"url": "https://github.com/symfony/polyfill",
|
||||
"name": "symfony/polyfill"
|
||||
}
|
||||
},
|
||||
"autoload": {
|
||||
|
|
@ -2844,8 +2844,8 @@
|
|||
"type": "library",
|
||||
"extra": {
|
||||
"thanks": {
|
||||
"name": "symfony/polyfill",
|
||||
"url": "https://github.com/symfony/polyfill"
|
||||
"url": "https://github.com/symfony/polyfill",
|
||||
"name": "symfony/polyfill"
|
||||
}
|
||||
},
|
||||
"autoload": {
|
||||
|
|
@ -3574,6 +3574,24 @@
|
|||
"type": "wordpress-plugin",
|
||||
"homepage": "https://wordpress.org/plugins/wc-multishipping/"
|
||||
},
|
||||
{
|
||||
"name": "wpackagist-plugin/woo-preview-emails",
|
||||
"version": "2.2.13",
|
||||
"source": {
|
||||
"type": "svn",
|
||||
"url": "https://plugins.svn.wordpress.org/woo-preview-emails/",
|
||||
"reference": "tags/2.2.13"
|
||||
},
|
||||
"dist": {
|
||||
"type": "zip",
|
||||
"url": "https://downloads.wordpress.org/plugin/woo-preview-emails.2.2.13.zip"
|
||||
},
|
||||
"require": {
|
||||
"composer/installers": "^1.0 || ^2.0"
|
||||
},
|
||||
"type": "wordpress-plugin",
|
||||
"homepage": "https://wordpress.org/plugins/woo-preview-emails/"
|
||||
},
|
||||
{
|
||||
"name": "wpackagist-plugin/woocommerce",
|
||||
"version": "9.4.3",
|
||||
|
|
|
|||
|
|
@ -34,11 +34,11 @@
|
|||
"malva": {
|
||||
"alignComments": true,
|
||||
"attrValueQuotes": "always",
|
||||
"blockSelectorLinebreak": "consistent",
|
||||
"blockSelectorLinebreak": "wrap",
|
||||
"declarationOrder": null,
|
||||
"formatComments": true,
|
||||
"hexCase": "lower",
|
||||
"hexColorLength": "long",
|
||||
"hexColorLength": "short",
|
||||
"indentWidth": 2,
|
||||
"keyframeSelectorNotation": "keyword",
|
||||
"lineBreak": "lf",
|
||||
|
|
@ -60,13 +60,10 @@
|
|||
"doctypeKeywordCase": "lower",
|
||||
"formatComments": true,
|
||||
"html.normal.selfClosing": false,
|
||||
"html.scriptIndent": false,
|
||||
"html.styleIndent": false,
|
||||
"html.void.selfClosing": false,
|
||||
"indentWidth": 2,
|
||||
"lineBreak": "lf",
|
||||
"maxAttrsPerLine": 2,
|
||||
"preferAttrsSingleLine": true,
|
||||
"maxAttrsPerLine": 1,
|
||||
"printWidth": 120,
|
||||
"quotes": "double",
|
||||
"scriptFormatter": "dprint",
|
||||
|
|
|
|||
20
pnpm-lock.yaml
generated
20
pnpm-lock.yaml
generated
|
|
@ -774,8 +774,8 @@ packages:
|
|||
cpu: [x64]
|
||||
os: [win32]
|
||||
|
||||
'@bufbuild/protobuf@2.2.2':
|
||||
resolution: {integrity: sha512-UNtPCbrwrenpmrXuRwn9jYpPoweNXj8X5sMvYgsqYyaH8jQ6LfUJSk3dJLnBK+6sfYPrF4iAIo5sd5HQ+tg75A==}
|
||||
'@bufbuild/protobuf@2.2.3':
|
||||
resolution: {integrity: sha512-tFQoXHJdkEOSwj5tRIZSPNUuXK3RaR7T1nUrPgbYX1pUbvqqaaZAsfo+NXBPsz5rZMSKVFrgK1WL8Q/MSLvprg==}
|
||||
|
||||
'@csstools/css-parser-algorithms@3.0.4':
|
||||
resolution: {integrity: sha512-Up7rBoV77rv29d3uKHUIVubz1BTcgyUK72IvCQAbfbMv584xHcGKCKbWh7i8hPrRJ7qU4Y8IO3IY9m+iTB7P3A==}
|
||||
|
|
@ -1841,8 +1841,8 @@ packages:
|
|||
resolution: {integrity: sha512-zkDT5WAF4hSSoUgyfg5tFIxz8XQK+25W/TLVojJTMKBaxevLBBtLxgqguAuVQB8PVW79FVjHcU+GJ9tVbDZ9mQ==}
|
||||
engines: {node: '>=14.16'}
|
||||
|
||||
call-bind-apply-helpers@1.0.0:
|
||||
resolution: {integrity: sha512-CCKAP2tkPau7D3GE8+V8R6sQubA9R5foIzGp+85EXCVSCivuxBNAWqcpn72PKYiIcqoViv/kcUDpaEIMBVi1lQ==}
|
||||
call-bind-apply-helpers@1.0.1:
|
||||
resolution: {integrity: sha512-BhYE+WDaywFg2TBWYNXAE+8B1ATnThNBqXHP5nQu0jWJdVvY2hvkpyB3qOmtmDePiS5/BDQ8wASEWGMWRG148g==}
|
||||
engines: {node: '>= 0.4'}
|
||||
|
||||
call-bind@1.0.8:
|
||||
|
|
@ -4370,7 +4370,7 @@ snapshots:
|
|||
'@biomejs/cli-win32-x64@1.9.4':
|
||||
optional: true
|
||||
|
||||
'@bufbuild/protobuf@2.2.2': {}
|
||||
'@bufbuild/protobuf@2.2.3': {}
|
||||
|
||||
'@csstools/css-parser-algorithms@3.0.4(@csstools/css-tokenizer@3.0.3)':
|
||||
dependencies:
|
||||
|
|
@ -5340,14 +5340,14 @@ snapshots:
|
|||
normalize-url: 8.0.1
|
||||
responselike: 3.0.0
|
||||
|
||||
call-bind-apply-helpers@1.0.0:
|
||||
call-bind-apply-helpers@1.0.1:
|
||||
dependencies:
|
||||
es-errors: 1.3.0
|
||||
function-bind: 1.1.2
|
||||
|
||||
call-bind@1.0.8:
|
||||
dependencies:
|
||||
call-bind-apply-helpers: 1.0.0
|
||||
call-bind-apply-helpers: 1.0.1
|
||||
es-define-property: 1.0.1
|
||||
get-intrinsic: 1.2.5
|
||||
set-function-length: 1.2.2
|
||||
|
|
@ -5534,7 +5534,7 @@ snapshots:
|
|||
|
||||
dunder-proto@1.0.0:
|
||||
dependencies:
|
||||
call-bind-apply-helpers: 1.0.0
|
||||
call-bind-apply-helpers: 1.0.1
|
||||
es-errors: 1.3.0
|
||||
gopd: 1.2.0
|
||||
|
||||
|
|
@ -5807,7 +5807,7 @@ snapshots:
|
|||
|
||||
get-intrinsic@1.2.5:
|
||||
dependencies:
|
||||
call-bind-apply-helpers: 1.0.0
|
||||
call-bind-apply-helpers: 1.0.1
|
||||
dunder-proto: 1.0.0
|
||||
es-define-property: 1.0.1
|
||||
es-errors: 1.3.0
|
||||
|
|
@ -6589,7 +6589,7 @@ snapshots:
|
|||
|
||||
sass-embedded@1.82.0:
|
||||
dependencies:
|
||||
'@bufbuild/protobuf': 2.2.2
|
||||
'@bufbuild/protobuf': 2.2.3
|
||||
buffer-builder: 0.2.0
|
||||
colorjs.io: 0.5.2
|
||||
immutable: 5.0.3
|
||||
|
|
|
|||
|
|
@ -33,14 +33,14 @@
|
|||
}
|
||||
:root {
|
||||
/* Couleurs */
|
||||
--couleur-blanc: #ffffff;
|
||||
--couleur-blanc: #fff;
|
||||
--couleur-blanc-fond: rgb(255 255 255 / 90%);
|
||||
--couleur-gris: #eceaeb;
|
||||
--couleur-gris-fonce: #808080;
|
||||
--couleur-gris-fonce-fond: rgb(128 128 128 / 80%);
|
||||
--couleur-bordeaux: #490918;
|
||||
--couleur-bordeaux-fond: rgb(73 9 24 / 80%);
|
||||
--couleur-jaune: #ebffb8;
|
||||
--couleur-jaune: #defdb5;
|
||||
--couleur-jaune-fond: rgb(235 255 184 / 80%);
|
||||
--couleur-noir: #202020;
|
||||
--couleur-fond: rgb(236 234 235 / 80%);
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -5,7 +5,7 @@
|
|||
width="330.107px" height="330.773px" viewBox="0 0 330.107 330.773" enable-background="new 0 0 330.107 330.773"
|
||||
xml:space="preserve">
|
||||
<g id="logo_x2F_colors">
|
||||
<ellipse display="none" fill="#EBFFB8" cx="165.872" cy="162.37" rx="164.236" ry="161.992"/>
|
||||
<ellipse display="none" fill="#DEFDB5" cx="165.872" cy="162.37" rx="164.236" ry="161.992"/>
|
||||
<g>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" fill="#202020" d="M256.14,137.243c0.624,1.266,0.236,5.389,0.142,5.907
|
||||
c-0.165,0.873-0.366,5.486-0.339,6.494c0.03,0.981-0.037,5.803-0.067,6.871c-0.061,2.059-0.419,3.634-0.353,5.689
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 13 KiB After Width: | Height: | Size: 13 KiB |
|
|
@ -25,4 +25,21 @@ function cree_champs_personnalises_produit(): void {
|
|||
]);
|
||||
}
|
||||
|
||||
function cree_champ_personnalise_commande($order): void {
|
||||
woocommerce_wp_text_input([
|
||||
"id" => "tracking_number",
|
||||
"label" => "Tracking Number:",
|
||||
"value" => $order->get_meta("tracking_number"),
|
||||
"wrapper_class" => "form-field-wide",
|
||||
]);
|
||||
}
|
||||
|
||||
function maj_champ_personnalise_commande($order_id): void {
|
||||
$order = wc_get_order($order_id);
|
||||
$order->update_meta_data("tracking_number", wc_clean($_POST["tracking_number"]));
|
||||
$order->save();
|
||||
}
|
||||
|
||||
add_action("carbon_fields_register_fields", "cree_champs_personnalises_produit");
|
||||
add_action("woocommerce_admin_order_data_after_shipping_address", "cree_champ_personnalise_commande");
|
||||
add_action("woocommerce_process_shop_order_meta", "maj_champ_personnalise_commande");
|
||||
|
|
|
|||
|
|
@ -2,14 +2,14 @@
|
|||
|
||||
:root {
|
||||
/* Couleurs */
|
||||
--couleur-blanc: #ffffff;
|
||||
--couleur-blanc: #fff;
|
||||
--couleur-blanc-fond: rgb(255 255 255 / 90%);
|
||||
--couleur-gris: #eceaeb;
|
||||
--couleur-gris-fonce: #808080;
|
||||
--couleur-gris-fonce-fond: rgb(128 128 128 / 80%);
|
||||
--couleur-bordeaux: #490918;
|
||||
--couleur-bordeaux-fond: rgb(73 9 24 / 80%);
|
||||
--couleur-jaune: #ebffb8;
|
||||
--couleur-jaune: #defdb5;
|
||||
--couleur-jaune-fond: rgb(235 255 184 / 80%);
|
||||
--couleur-noir: #202020;
|
||||
--couleur-fond: rgb(236 234 235 / 80%);
|
||||
|
|
|
|||
|
|
@ -215,14 +215,6 @@ export const initialiseBoutonCalculLivraison = (): void => {
|
|||
.ifLeft(
|
||||
(erreur: ErreurAdresseInvalide | FetchErrors | HttpCodeErrors | ValiError<AnySchema>): void => {
|
||||
match(erreur)
|
||||
.when(estErreurHttp, (e): void => {
|
||||
reporteEtJournaliseErreur(e);
|
||||
E.MESSAGE_ADRESSES.textContent = ERREUR_GENERIQUE_SOUMISSION_ADRESSES;
|
||||
})
|
||||
.when(estErreurFetch, (e): void => {
|
||||
reporteEtJournaliseErreur(e);
|
||||
E.MESSAGE_ADRESSES.textContent = ERREUR_GENERIQUE_RESEAU;
|
||||
})
|
||||
.with(P.instanceOf(ValiError), (e: ValiError<AnySchema>): void => {
|
||||
reporteEtJournaliseErreur(e);
|
||||
console.error(e.issues);
|
||||
|
|
@ -245,6 +237,14 @@ export const initialiseBoutonCalculLivraison = (): void => {
|
|||
E.MESSAGE_ADRESSES.textContent = ERREUR_GENERIQUE_SOUMISSION_ADRESSES;
|
||||
});
|
||||
})
|
||||
.when(estErreurHttp, (e): void => {
|
||||
reporteEtJournaliseErreur(e);
|
||||
E.MESSAGE_ADRESSES.textContent = ERREUR_GENERIQUE_SOUMISSION_ADRESSES;
|
||||
})
|
||||
.when(estErreurFetch, (e): void => {
|
||||
reporteEtJournaliseErreur(e);
|
||||
E.MESSAGE_ADRESSES.textContent = ERREUR_GENERIQUE_RESEAU;
|
||||
})
|
||||
.exhaustive();
|
||||
|
||||
E.BOUTON_ACTIONS_FORMULAIRE.textContent = "Submit your addresses";
|
||||
|
|
|
|||
|
|
@ -1,7 +1,10 @@
|
|||
{% extends "base.twig" %}
|
||||
|
||||
{% block contenu %}
|
||||
<main class="page-modele-simple" id="page-404">
|
||||
<main
|
||||
class="page-modele-simple"
|
||||
id="page-404"
|
||||
>
|
||||
<div class="contenu">
|
||||
<header class="contenu__en-tete">
|
||||
<h2>Sorry!</h2>
|
||||
|
|
@ -13,7 +16,10 @@
|
|||
</p>
|
||||
|
||||
<p>
|
||||
<a class="lien-lien" href="/shop">
|
||||
<a
|
||||
class="lien-lien"
|
||||
href="/shop"
|
||||
>
|
||||
Go back to the Shop
|
||||
</a>
|
||||
</p>
|
||||
|
|
|
|||
|
|
@ -12,71 +12,103 @@
|
|||
|
||||
{# Épingles #}
|
||||
<button
|
||||
aria-label="First pin" class="epingle"
|
||||
data-id-ensemble-epingle-boite="1" type="button"
|
||||
aria-label="First pin"
|
||||
class="epingle"
|
||||
data-id-ensemble-epingle-boite="1"
|
||||
type="button"
|
||||
>
|
||||
<img
|
||||
alt="" height="56"
|
||||
src="{{ site.theme.link }}/assets/img/icons/aboutlclick-black.svg" width="82"
|
||||
alt=""
|
||||
height="56"
|
||||
src="{{ site.theme.link }}/assets/img/icons/aboutlclick-black.svg"
|
||||
width="82"
|
||||
>
|
||||
</button>
|
||||
|
||||
<button
|
||||
aria-label="Second pin" class="epingle"
|
||||
data-id-ensemble-epingle-boite="2" type="button"
|
||||
aria-label="Second pin"
|
||||
class="epingle"
|
||||
data-id-ensemble-epingle-boite="2"
|
||||
type="button"
|
||||
>
|
||||
<img
|
||||
alt="" height="56"
|
||||
src="{{ site.theme.link }}/assets/img/icons/aboutlclick-black.svg" width="82"
|
||||
alt=""
|
||||
height="56"
|
||||
src="{{ site.theme.link }}/assets/img/icons/aboutlclick-black.svg"
|
||||
width="82"
|
||||
>
|
||||
</button>
|
||||
|
||||
<button
|
||||
aria-label="Third pin" class="epingle"
|
||||
data-id-ensemble-epingle-boite="3" type="button"
|
||||
aria-label="Third pin"
|
||||
class="epingle"
|
||||
data-id-ensemble-epingle-boite="3"
|
||||
type="button"
|
||||
>
|
||||
<img
|
||||
alt="" height="56"
|
||||
src="{{ site.theme.link }}/assets/img/icons/aboutlclick-black.svg" width="82"
|
||||
alt=""
|
||||
height="56"
|
||||
src="{{ site.theme.link }}/assets/img/icons/aboutlclick-black.svg"
|
||||
width="82"
|
||||
>
|
||||
</button>
|
||||
|
||||
<button
|
||||
aria-label="Fourth pin" class="epingle"
|
||||
data-id-ensemble-epingle-boite="4" type="button"
|
||||
aria-label="Fourth pin"
|
||||
class="epingle"
|
||||
data-id-ensemble-epingle-boite="4"
|
||||
type="button"
|
||||
>
|
||||
<img
|
||||
alt="" height="56"
|
||||
src="{{ site.theme.link }}/assets/img/icons/aboutlclick-black.svg" width="82"
|
||||
alt=""
|
||||
height="56"
|
||||
src="{{ site.theme.link }}/assets/img/icons/aboutlclick-black.svg"
|
||||
width="82"
|
||||
>
|
||||
</button>
|
||||
|
||||
<button
|
||||
aria-label="Fifth pin" class="epingle"
|
||||
data-id-ensemble-epingle-boite="5" type="button"
|
||||
aria-label="Fifth pin"
|
||||
class="epingle"
|
||||
data-id-ensemble-epingle-boite="5"
|
||||
type="button"
|
||||
>
|
||||
<img
|
||||
alt="" height="56"
|
||||
src="{{ site.theme.link }}/assets/img/icons/aboutlclick-black.svg" width="82"
|
||||
alt=""
|
||||
height="56"
|
||||
src="{{ site.theme.link }}/assets/img/icons/aboutlclick-black.svg"
|
||||
width="82"
|
||||
>
|
||||
</button>
|
||||
|
||||
<button
|
||||
aria-label="Sixth pin" class="epingle"
|
||||
data-id-ensemble-epingle-boite="6" type="button"
|
||||
aria-label="Sixth pin"
|
||||
class="epingle"
|
||||
data-id-ensemble-epingle-boite="6"
|
||||
type="button"
|
||||
>
|
||||
<img
|
||||
alt="" height="56"
|
||||
src="{{ site.theme.link }}/assets/img/icons/aboutlclick-black.svg" width="82"
|
||||
alt=""
|
||||
height="56"
|
||||
src="{{ site.theme.link }}/assets/img/icons/aboutlclick-black.svg"
|
||||
width="82"
|
||||
>
|
||||
</button>
|
||||
|
||||
{# Boîtes de texte #}
|
||||
<div class="boite-texte" data-id-ensemble-epingle-boite="1">
|
||||
<button class="boite-texte__bouton-fermeture" type="button">
|
||||
<div
|
||||
class="boite-texte"
|
||||
data-id-ensemble-epingle-boite="1"
|
||||
>
|
||||
<button
|
||||
class="boite-texte__bouton-fermeture"
|
||||
type="button"
|
||||
>
|
||||
<img
|
||||
alt="An icon in form of a cross" height="20"
|
||||
src="{{ site.theme.link }}/assets/img/icons/cross.svg" width="20"
|
||||
alt="An icon in form of a cross"
|
||||
height="20"
|
||||
src="{{ site.theme.link }}/assets/img/icons/cross.svg"
|
||||
width="20"
|
||||
>
|
||||
</button>
|
||||
|
||||
|
|
@ -88,11 +120,19 @@
|
|||
<p>More than poetry, it’s a philosophy.</p>
|
||||
</div>
|
||||
|
||||
<div class="boite-texte" data-id-ensemble-epingle-boite="2">
|
||||
<button class="boite-texte__bouton-fermeture" type="button">
|
||||
<div
|
||||
class="boite-texte"
|
||||
data-id-ensemble-epingle-boite="2"
|
||||
>
|
||||
<button
|
||||
class="boite-texte__bouton-fermeture"
|
||||
type="button"
|
||||
>
|
||||
<img
|
||||
alt="An icon in form of a cross" height="20"
|
||||
src="{{ site.theme.link }}/assets/img/icons/cross.svg" width="20"
|
||||
alt="An icon in form of a cross"
|
||||
height="20"
|
||||
src="{{ site.theme.link }}/assets/img/icons/cross.svg"
|
||||
width="20"
|
||||
>
|
||||
</button>
|
||||
|
||||
|
|
@ -106,11 +146,19 @@
|
|||
</p>
|
||||
</div>
|
||||
|
||||
<div class="boite-texte" data-id-ensemble-epingle-boite="3">
|
||||
<button class="boite-texte__bouton-fermeture" type="button">
|
||||
<div
|
||||
class="boite-texte"
|
||||
data-id-ensemble-epingle-boite="3"
|
||||
>
|
||||
<button
|
||||
class="boite-texte__bouton-fermeture"
|
||||
type="button"
|
||||
>
|
||||
<img
|
||||
alt="An icon in form of a cross" height="20"
|
||||
src="{{ site.theme.link }}/assets/img/icons/cross.svg" width="20"
|
||||
alt="An icon in form of a cross"
|
||||
height="20"
|
||||
src="{{ site.theme.link }}/assets/img/icons/cross.svg"
|
||||
width="20"
|
||||
>
|
||||
</button>
|
||||
|
||||
|
|
@ -125,11 +173,19 @@
|
|||
</p>
|
||||
</div>
|
||||
|
||||
<div class="boite-texte" data-id-ensemble-epingle-boite="4">
|
||||
<button class="boite-texte__bouton-fermeture" type="button">
|
||||
<div
|
||||
class="boite-texte"
|
||||
data-id-ensemble-epingle-boite="4"
|
||||
>
|
||||
<button
|
||||
class="boite-texte__bouton-fermeture"
|
||||
type="button"
|
||||
>
|
||||
<img
|
||||
alt="An icon in form of a cross" height="20"
|
||||
src="{{ site.theme.link }}/assets/img/icons/cross.svg" width="20"
|
||||
alt="An icon in form of a cross"
|
||||
height="20"
|
||||
src="{{ site.theme.link }}/assets/img/icons/cross.svg"
|
||||
width="20"
|
||||
>
|
||||
</button>
|
||||
|
||||
|
|
@ -143,11 +199,19 @@
|
|||
</p>
|
||||
</div>
|
||||
|
||||
<div class="boite-texte" data-id-ensemble-epingle-boite="5">
|
||||
<button class="boite-texte__bouton-fermeture" type="button">
|
||||
<div
|
||||
class="boite-texte"
|
||||
data-id-ensemble-epingle-boite="5"
|
||||
>
|
||||
<button
|
||||
class="boite-texte__bouton-fermeture"
|
||||
type="button"
|
||||
>
|
||||
<img
|
||||
alt="An icon in form of a cross" height="20"
|
||||
src="{{ site.theme.link }}/assets/img/icons/cross.svg" width="20"
|
||||
alt="An icon in form of a cross"
|
||||
height="20"
|
||||
src="{{ site.theme.link }}/assets/img/icons/cross.svg"
|
||||
width="20"
|
||||
>
|
||||
</button>
|
||||
|
||||
|
|
@ -165,11 +229,19 @@
|
|||
</p>
|
||||
</div>
|
||||
|
||||
<div class="boite-texte" data-id-ensemble-epingle-boite="6">
|
||||
<button class="boite-texte__bouton-fermeture" type="button">
|
||||
<div
|
||||
class="boite-texte"
|
||||
data-id-ensemble-epingle-boite="6"
|
||||
>
|
||||
<button
|
||||
class="boite-texte__bouton-fermeture"
|
||||
type="button"
|
||||
>
|
||||
<img
|
||||
alt="An icon in form of a cross" height="20"
|
||||
src="{{ site.theme.link }}/assets/img/icons/cross.svg" width="20"
|
||||
alt="An icon in form of a cross"
|
||||
height="20"
|
||||
src="{{ site.theme.link }}/assets/img/icons/cross.svg"
|
||||
width="20"
|
||||
>
|
||||
</button>
|
||||
|
||||
|
|
|
|||
|
|
@ -5,21 +5,29 @@
|
|||
<main id="page-accueil">
|
||||
<div class="storytelling">
|
||||
<div class="storytelling__conteneur">
|
||||
<div class="storytelling__image" data-index="0">
|
||||
<div
|
||||
class="storytelling__image"
|
||||
data-index="0"
|
||||
>
|
||||
{{
|
||||
images.genere_source_img_multi_formats("#{ site.theme.link }/assets/img/storytelling/scroll0", "", 903, 1080, "image-scroll0")
|
||||
}}
|
||||
</div>
|
||||
|
||||
<div class="storytelling__image" data-index="1">
|
||||
<div
|
||||
class="storytelling__image"
|
||||
data-index="1"
|
||||
>
|
||||
{{
|
||||
images.genere_source_img_multi_formats("#{ site.theme.link }/assets/img/storytelling/scroll1", "", 903, 1080, "image-scroll1")
|
||||
}}
|
||||
</div>
|
||||
|
||||
<div
|
||||
aria-hidden class="storytelling__image"
|
||||
data-cache data-index="2"
|
||||
aria-hidden
|
||||
class="storytelling__image"
|
||||
data-cache
|
||||
data-index="2"
|
||||
>
|
||||
{{
|
||||
images.genere_source_img_multi_formats("#{ site.theme.link }/assets/img/storytelling/scroll2", "", 903, 1080, "image-scroll2")
|
||||
|
|
@ -27,8 +35,10 @@
|
|||
</div>
|
||||
|
||||
<div
|
||||
aria-hidden class="storytelling__image"
|
||||
data-cache data-index="3"
|
||||
aria-hidden
|
||||
class="storytelling__image"
|
||||
data-cache
|
||||
data-index="3"
|
||||
>
|
||||
{{
|
||||
images.genere_source_img_multi_formats("#{ site.theme.link }/assets/img/storytelling/scroll3", "", 903, 1080, "image-scroll3")
|
||||
|
|
@ -36,8 +46,10 @@
|
|||
</div>
|
||||
|
||||
<div
|
||||
aria-hidden class="storytelling__image"
|
||||
data-cache data-index="4"
|
||||
aria-hidden
|
||||
class="storytelling__image"
|
||||
data-cache
|
||||
data-index="4"
|
||||
>
|
||||
{{
|
||||
images.genere_source_img_multi_formats("#{ site.theme.link }/assets/img/storytelling/scroll4", "", 903, 1080, "image-scroll4")
|
||||
|
|
@ -45,8 +57,10 @@
|
|||
</div>
|
||||
|
||||
<div
|
||||
aria-hidden class="storytelling__image"
|
||||
data-cache data-index="5"
|
||||
aria-hidden
|
||||
class="storytelling__image"
|
||||
data-cache
|
||||
data-index="5"
|
||||
>
|
||||
{{
|
||||
images.genere_source_img_multi_formats("#{ site.theme.link }/assets/img/storytelling/scroll5", "", 903, 1080, "image-scroll5")
|
||||
|
|
@ -54,8 +68,10 @@
|
|||
</div>
|
||||
|
||||
<div
|
||||
aria-hidden class="storytelling__image"
|
||||
data-cache data-index="6"
|
||||
aria-hidden
|
||||
class="storytelling__image"
|
||||
data-cache
|
||||
data-index="6"
|
||||
>
|
||||
{{
|
||||
images.genere_source_img_multi_formats("#{ site.theme.link }/assets/img/storytelling/scroll6", "", 903, 1080, "image-scroll6")
|
||||
|
|
@ -63,8 +79,10 @@
|
|||
</div>
|
||||
|
||||
<div
|
||||
aria-hidden class="storytelling__image"
|
||||
data-cache data-index="7"
|
||||
aria-hidden
|
||||
class="storytelling__image"
|
||||
data-cache
|
||||
data-index="7"
|
||||
>
|
||||
{{
|
||||
images.genere_source_img_multi_formats("#{ site.theme.link }/assets/img/storytelling/scroll7", "", 903, 1080, "image-scroll7")
|
||||
|
|
@ -72,8 +90,10 @@
|
|||
</div>
|
||||
|
||||
<div
|
||||
aria-hidden class="storytelling__image"
|
||||
data-cache data-index="8"
|
||||
aria-hidden
|
||||
class="storytelling__image"
|
||||
data-cache
|
||||
data-index="8"
|
||||
>
|
||||
{{
|
||||
images.genere_source_img_multi_formats("#{ site.theme.link }/assets/img/storytelling/scroll8", "", 903, 1080, "image-scroll8")
|
||||
|
|
@ -81,8 +101,10 @@
|
|||
</div>
|
||||
|
||||
<div
|
||||
aria-hidden class="storytelling__image"
|
||||
data-cache data-index="9"
|
||||
aria-hidden
|
||||
class="storytelling__image"
|
||||
data-cache
|
||||
data-index="9"
|
||||
>
|
||||
{{
|
||||
images.genere_source_img_multi_formats("#{ site.theme.link }/assets/img/storytelling/scroll9", "", 903, 1080, "image-scroll9")
|
||||
|
|
@ -90,8 +112,10 @@
|
|||
</div>
|
||||
|
||||
<div
|
||||
aria-hidden class="storytelling__image"
|
||||
data-cache data-index="10"
|
||||
aria-hidden
|
||||
class="storytelling__image"
|
||||
data-cache
|
||||
data-index="10"
|
||||
>
|
||||
{{
|
||||
images.genere_source_img_multi_formats("#{ site.theme.link }/assets/img/storytelling/scroll10", "", 903, 1080, "image-scroll10")
|
||||
|
|
@ -99,8 +123,10 @@
|
|||
</div>
|
||||
|
||||
<div
|
||||
aria-hidden class="storytelling__image"
|
||||
data-cache data-index="11"
|
||||
aria-hidden
|
||||
class="storytelling__image"
|
||||
data-cache
|
||||
data-index="11"
|
||||
>
|
||||
{{
|
||||
images.genere_source_img_multi_formats("#{ site.theme.link }/assets/img/storytelling/scroll11", "", 903, 1080, "image-scroll11")
|
||||
|
|
@ -108,8 +134,10 @@
|
|||
</div>
|
||||
|
||||
<div
|
||||
aria-hidden class="storytelling__image"
|
||||
data-cache data-index="12"
|
||||
aria-hidden
|
||||
class="storytelling__image"
|
||||
data-cache
|
||||
data-index="12"
|
||||
>
|
||||
{{
|
||||
images.genere_source_img_multi_formats("#{ site.theme.link }/assets/img/storytelling/scroll12", "", 903, 1080, "image-scroll12")
|
||||
|
|
@ -117,8 +145,10 @@
|
|||
</div>
|
||||
|
||||
<div
|
||||
aria-hidden class="storytelling__image"
|
||||
data-cache data-index="13"
|
||||
aria-hidden
|
||||
class="storytelling__image"
|
||||
data-cache
|
||||
data-index="13"
|
||||
>
|
||||
{{
|
||||
images.genere_source_img_multi_formats("#{ site.theme.link }/assets/img/storytelling/scroll13", "", 903, 1080, "image-scroll13")
|
||||
|
|
|
|||
|
|
@ -8,7 +8,10 @@
|
|||
{% endblock head %}
|
||||
{% endblock conteneur_html_head %}
|
||||
|
||||
<body class="{{ body_class }}" data-langue="{{ langue_courante }}">
|
||||
<body
|
||||
class="{{ body_class }}"
|
||||
data-langue="{{ langue_courante }}"
|
||||
>
|
||||
{# En-tête #}
|
||||
{% include "parts/en-tete.twig" %}
|
||||
|
||||
|
|
@ -18,11 +21,14 @@
|
|||
|
||||
{# Bouton Revenir en haut #}
|
||||
<button
|
||||
aria-hidden class="bouton-retour-haut"
|
||||
id="bouton-retour-haut" type="button"
|
||||
aria-hidden
|
||||
class="bouton-retour-haut"
|
||||
id="bouton-retour-haut"
|
||||
type="button"
|
||||
>
|
||||
<img
|
||||
alt="An arrow pointing to the top" src="{{ site.theme.link }}/assets/img/icons/arrow.svg"
|
||||
alt="An arrow pointing to the top"
|
||||
src="{{ site.theme.link }}/assets/img/icons/arrow.svg"
|
||||
aria-hidden
|
||||
>
|
||||
<span class="visuellement-cache">Back to top</span>
|
||||
|
|
|
|||
|
|
@ -21,8 +21,10 @@ const _etats = {
|
|||
|
||||
<div class="actions">
|
||||
<button
|
||||
{{produits|length == 12 ? "" : "hidden"}} class="bouton-case-pleine bouton-blanc-sur-noir"
|
||||
id="bouton-plus-de-produits" type="button"
|
||||
{{produits|length == 12 ? "" : "hidden"}}
|
||||
class="bouton-case-pleine bouton-blanc-sur-noir"
|
||||
id="bouton-plus-de-produits"
|
||||
type="button"
|
||||
>
|
||||
Show more products
|
||||
</button>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,10 @@
|
|||
{% extends "base.twig" %}
|
||||
|
||||
{% block contenu %}
|
||||
<main class="page-modele-simple" id="page-cgv">
|
||||
<main
|
||||
class="page-modele-simple"
|
||||
id="page-cgv"
|
||||
>
|
||||
<div class="contenu">
|
||||
<header class="contenu__en-tete">
|
||||
<h2>Terms & Conditions</h2>
|
||||
|
|
@ -49,7 +52,9 @@
|
|||
</p>
|
||||
|
||||
<p>
|
||||
To start a return you can contact us at <a class="lien-lien" href="mailto:haiku.atelier@gmail.com"
|
||||
To start a return you can contact us at <a
|
||||
class="lien-lien"
|
||||
href="mailto:haiku.atelier@gmail.com"
|
||||
>haiku.atelier@gmail.com</a>. Please note that returns and exchange will need to be send back our workshop
|
||||
in Brussels.
|
||||
</p>
|
||||
|
|
@ -169,7 +174,9 @@
|
|||
|
||||
<p>
|
||||
<strong>Contact:</strong><br>
|
||||
For inquiries and customer service, please refer to <a class="lien-lien" href="/contact"
|
||||
For inquiries and customer service, please refer to <a
|
||||
class="lien-lien"
|
||||
href="/contact"
|
||||
>our Contact page</a>.
|
||||
</p>
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,10 @@
|
|||
{% extends "base.twig" %}
|
||||
|
||||
{% block contenu %}
|
||||
<main class="page-modele-simple" id="page-contact">
|
||||
<main
|
||||
class="page-modele-simple"
|
||||
id="page-contact"
|
||||
>
|
||||
<div class="contenu">
|
||||
<header class="contenu__en-tete">
|
||||
<h2>Say hi!</h2>
|
||||
|
|
@ -10,9 +13,15 @@
|
|||
<div class="contenu__textuel">
|
||||
<p>
|
||||
For any inquiries, from simple information questions to problems with your products, or just to say hi, don't
|
||||
hesitate to contact us at <a class="lien-lien" href="mailto:haikuatelier@gmail.com">
|
||||
hesitate to contact us at <a
|
||||
class="lien-lien"
|
||||
href="mailto:haikuatelier@gmail.com"
|
||||
>
|
||||
haikuatelier@gmail.com
|
||||
</a> or on Instagram at <a class="lien-lien" href="https://www.instagram.com/haiku.atelier">
|
||||
</a> or on Instagram at <a
|
||||
class="lien-lien"
|
||||
href="https://www.instagram.com/haiku.atelier"
|
||||
>
|
||||
haiku.atelier
|
||||
</a>.
|
||||
</p>
|
||||
|
|
|
|||
|
|
@ -1,7 +1,10 @@
|
|||
{% extends "base.twig" %}
|
||||
|
||||
{% block contenu %}
|
||||
<main class="page-modele-simple" id="page-succes-commande">
|
||||
<main
|
||||
class="page-modele-simple"
|
||||
id="page-succes-commande"
|
||||
>
|
||||
<div class="contenu">
|
||||
<header class="contenu__en-tete">
|
||||
<h2>Failed order!</h2>
|
||||
|
|
@ -11,7 +14,8 @@
|
|||
<p>Sadly, something went wrong during your order, or you chose to cancel it. You can try again if you want: your
|
||||
cart is still there.</p>
|
||||
<p>If an error persists and you don't know what's going on, please don't hesitate to <a
|
||||
class="lien-lien" href="/contact"
|
||||
class="lien-lien"
|
||||
href="/contact"
|
||||
>contact us</a>!</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,13 +1,25 @@
|
|||
{% macro genere_source_img_multi_formats(rel_url, alt="", width, height, id="") %}
|
||||
<picture id="{{ id }}">
|
||||
<source srcset="{{ rel_url }}.jxl" type="image/jxl">
|
||||
<source srcset="{{ rel_url }}.avif" type="image/avif">
|
||||
<source srcset="{{ rel_url }}.webp" type="image/webp">
|
||||
<source
|
||||
srcset="{{ rel_url }}.jxl"
|
||||
type="image/jxl"
|
||||
>
|
||||
<source
|
||||
srcset="{{ rel_url }}.avif"
|
||||
type="image/avif"
|
||||
>
|
||||
<source
|
||||
srcset="{{ rel_url }}.webp"
|
||||
type="image/webp"
|
||||
>
|
||||
|
||||
<img
|
||||
alt="{{ alt }}" decoding="sync"
|
||||
height="{{ height }}" loading="eager"
|
||||
src="{{ rel_url }}.jpg" width="{{ width }}"
|
||||
alt="{{ alt }}"
|
||||
decoding="sync"
|
||||
height="{{ height }}"
|
||||
loading="eager"
|
||||
src="{{ rel_url }}.jpg"
|
||||
width="{{ width }}"
|
||||
onload="this.style.opacity=1"
|
||||
>
|
||||
</picture>
|
||||
|
|
|
|||
|
|
@ -12,7 +12,10 @@ const _etats = {
|
|||
{% endblock head %}
|
||||
|
||||
{% block contenu %}
|
||||
<main id="page-panier" data-contient-articles="{{ articles_presents }}">
|
||||
<main
|
||||
id="page-panier"
|
||||
data-contient-articles="{{ articles_presents }}"
|
||||
>
|
||||
{# « Your Cart » #}
|
||||
{% include "parts/pages/panier/panneau-panier.twig" %}
|
||||
{# Your Info #}
|
||||
|
|
@ -20,7 +23,10 @@ const _etats = {
|
|||
|
||||
<div class="panier-vide">
|
||||
<p>Sorry! Your cart is empty.</p>
|
||||
<a class="lien-bouton" href="{{ pages.shop.lien }}">
|
||||
<a
|
||||
class="lien-bouton"
|
||||
href="{{ pages.shop.lien }}"
|
||||
>
|
||||
Go back to the Shop
|
||||
</a>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -1,24 +1,36 @@
|
|||
<header id="en-tete">
|
||||
{# Bouton (dés)activant le menu mobile #}
|
||||
<section class="logo">
|
||||
<button id="bouton-menu-mobile" type="button">
|
||||
<button
|
||||
id="bouton-menu-mobile"
|
||||
type="button"
|
||||
>
|
||||
<img
|
||||
alt="Haiku Atelier's Logo" decoding="async"
|
||||
height="25" loading="eager"
|
||||
src="{{ site.theme.link }}/assets/img/logos/logo-lines.svg" width="80"
|
||||
alt="Haiku Atelier's Logo"
|
||||
decoding="async"
|
||||
height="25"
|
||||
loading="eager"
|
||||
src="{{ site.theme.link }}/assets/img/logos/logo-lines.svg"
|
||||
width="80"
|
||||
>
|
||||
</button>
|
||||
</section>
|
||||
|
||||
{# TODO: Utiliser un Menu WordPress #}
|
||||
{# TODO: Utiliser des <span> À L'INTÉRIEUR de <li> #}
|
||||
<nav class="menu-navigation" id="menu-navigation-en-tete">
|
||||
<nav
|
||||
class="menu-navigation"
|
||||
id="menu-navigation-en-tete"
|
||||
>
|
||||
<ul>
|
||||
<li
|
||||
class="{{ page_courante == pages.home.lien ? 'menu-navigation__entree menu-navigation__entree--courante' : "menu-navigation__entree" }}"
|
||||
>
|
||||
<span>
|
||||
<a class="lien-menu" href="{{ pages.home.lien }}">
|
||||
<a
|
||||
class="lien-menu"
|
||||
href="{{ pages.home.lien }}"
|
||||
>
|
||||
{{ pages.home.nom }}
|
||||
</a>
|
||||
</span>
|
||||
|
|
@ -27,7 +39,10 @@
|
|||
class="{{ est_page_boutique ? 'menu-navigation__entree menu-navigation__entree--courante' : "menu-navigation__entree" }}"
|
||||
>
|
||||
<span>
|
||||
<a class="lien-menu" href="{{ pages.shop.lien }}">
|
||||
<a
|
||||
class="lien-menu"
|
||||
href="{{ pages.shop.lien }}"
|
||||
>
|
||||
{{ pages.shop.nom }}
|
||||
</a>
|
||||
</span>
|
||||
|
|
@ -36,7 +51,10 @@
|
|||
class="{{ page_courante == pages.about.lien ? 'menu-navigation__entree menu-navigation__entree--courante' : "menu-navigation__entree" }}"
|
||||
>
|
||||
<span>
|
||||
<a class="lien-menu" href="{{ pages.about.lien }}">
|
||||
<a
|
||||
class="lien-menu"
|
||||
href="{{ pages.about.lien }}"
|
||||
>
|
||||
{{ pages.about.nom }}
|
||||
</a>
|
||||
</span>
|
||||
|
|
@ -46,7 +64,10 @@
|
|||
class="{{ page_courante == pages.contact.lien ? 'menu-navigation__entree menu-navigation__entree--courante' : "menu-navigation__entree" }}"
|
||||
>
|
||||
<span>
|
||||
<a class="lien-menu" href="{{ pages.contact.lien }}">
|
||||
<a
|
||||
class="lien-menu"
|
||||
href="{{ pages.contact.lien }}"
|
||||
>
|
||||
{{ pages.contact.nom }}
|
||||
</a>
|
||||
</span>
|
||||
|
|
@ -57,8 +78,10 @@
|
|||
{# Bouton « Panier » avec l'indicateur de quantité de Produits #}
|
||||
<section class="compte-panier">
|
||||
<a
|
||||
class="lien-bouton" data-contient-articles="{{ articles_presents }}"
|
||||
href="{{ pages.cart.lien }}" rel="cart"
|
||||
class="lien-bouton"
|
||||
data-contient-articles="{{ articles_presents }}"
|
||||
href="{{ pages.cart.lien }}"
|
||||
rel="cart"
|
||||
>
|
||||
cart ({{ quantite_articles }})
|
||||
</a>
|
||||
|
|
@ -66,19 +89,30 @@
|
|||
|
||||
{# Menu mobile #}
|
||||
<div
|
||||
aria-hidden="true" aria-labelledby="menu-mobile"
|
||||
class="menu-modale" id="menu-mobile"
|
||||
aria-hidden="true"
|
||||
aria-labelledby="menu-mobile"
|
||||
class="menu-modale"
|
||||
id="menu-mobile"
|
||||
>
|
||||
<div class="menu-modale__fond" data-a11y-dialog-hide></div>
|
||||
<div
|
||||
class="menu-modale__fond"
|
||||
data-a11y-dialog-hide
|
||||
></div>
|
||||
|
||||
<div class="menu-modale__conteneur">
|
||||
<nav class="menu-navigation" id="menu-navigation-mobile">
|
||||
<nav
|
||||
class="menu-navigation"
|
||||
id="menu-navigation-mobile"
|
||||
>
|
||||
<ul>
|
||||
<li
|
||||
class="{{ page_courante == pages.home.lien ? 'menu-navigation__entree menu-navigation__entree--courante' : "menu-navigation__entree" }}"
|
||||
>
|
||||
<span>
|
||||
<a class="lien-menu" href="{{ pages.home.lien }}">
|
||||
<a
|
||||
class="lien-menu"
|
||||
href="{{ pages.home.lien }}"
|
||||
>
|
||||
{{ pages.home.nom }}
|
||||
</a>
|
||||
</span>
|
||||
|
|
@ -88,7 +122,10 @@
|
|||
class="{{ est_page_boutique ? 'menu-navigation__entree menu-navigation__entree--courante' : "menu-navigation__entree" }}"
|
||||
>
|
||||
<span>
|
||||
<a class="lien-menu" href="{{ pages.shop.lien }}">
|
||||
<a
|
||||
class="lien-menu"
|
||||
href="{{ pages.shop.lien }}"
|
||||
>
|
||||
{{ pages.shop.nom }}
|
||||
</a>
|
||||
</span>
|
||||
|
|
@ -98,7 +135,10 @@
|
|||
class="{{ page_courante == pages.about.lien ? 'menu-navigation__entree menu-navigation__entree--courante' : "menu-navigation__entree" }}"
|
||||
>
|
||||
<span>
|
||||
<a class="lien-menu" href="{{ pages.about.lien }}">
|
||||
<a
|
||||
class="lien-menu"
|
||||
href="{{ pages.about.lien }}"
|
||||
>
|
||||
{{ pages.about.nom }}
|
||||
</a>
|
||||
</span>
|
||||
|
|
@ -108,7 +148,10 @@
|
|||
class="{{ page_courante == pages.contact.lien ? 'menu-navigation__entree menu-navigation__entree--courante' : "menu-navigation__entree" }}"
|
||||
>
|
||||
<span>
|
||||
<a class="lien-menu" href="{{ pages.contact.lien }}">
|
||||
<a
|
||||
class="lien-menu"
|
||||
href="{{ pages.contact.lien }}"
|
||||
>
|
||||
{{ pages.contact.nom }}
|
||||
</a>
|
||||
</span>
|
||||
|
|
|
|||
|
|
@ -1,43 +1,67 @@
|
|||
<head>
|
||||
<meta charset="{{ site.charset }}">
|
||||
<meta name="description" content="{{ site.description }}">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta
|
||||
name="description"
|
||||
content="{{ site.description }}"
|
||||
>
|
||||
<meta
|
||||
name="viewport"
|
||||
content="width=device-width, initial-scale=1"
|
||||
>
|
||||
|
||||
{# Pinterest #}
|
||||
<meta name="p:domain_verify" content="98fed4c924501d2f2a90c5b37e165085">
|
||||
<meta
|
||||
name="p:domain_verify"
|
||||
content="98fed4c924501d2f2a90c5b37e165085"
|
||||
>
|
||||
|
||||
{# Favicon #}
|
||||
<link rel="apple-touch-icon" href="{{ site.theme.link }}/assets/img/apple-touch-icon.png">
|
||||
<link
|
||||
rel="icon" href="{{ site.theme.link }}/assets/img/favicon.ico"
|
||||
rel="apple-touch-icon"
|
||||
href="{{ site.theme.link }}/assets/img/apple-touch-icon.png"
|
||||
>
|
||||
<link
|
||||
rel="icon"
|
||||
href="{{ site.theme.link }}/assets/img/favicon.ico"
|
||||
sizes="48x48"
|
||||
>
|
||||
<link
|
||||
rel="icon" href="{{ site.theme.link }}/assets/img/favicon.svg"
|
||||
rel="icon"
|
||||
href="{{ site.theme.link }}/assets/img/favicon.svg"
|
||||
type="image/svg+xml"
|
||||
>
|
||||
<link rel="manifest" href="{{ site.theme.link }}/assets/site.webmanifest">
|
||||
<link
|
||||
rel="manifest"
|
||||
href="{{ site.theme.link }}/assets/site.webmanifest"
|
||||
>
|
||||
|
||||
{# Préchargements #}
|
||||
<link
|
||||
as="image" href="{{ site.theme.link }}/assets/img/icons/cloud-gris.svg"
|
||||
rel="preload" type="image/svg+xml"
|
||||
as="image"
|
||||
href="{{ site.theme.link }}/assets/img/icons/cloud-gris.svg"
|
||||
rel="preload"
|
||||
type="image/svg+xml"
|
||||
>
|
||||
<link
|
||||
as="font" crossorigin
|
||||
href="{{ site.theme.link }}/assets/fonts/lato/lato-variable-webfont.woff2" rel="preload"
|
||||
as="font"
|
||||
crossorigin
|
||||
href="{{ site.theme.link }}/assets/fonts/lato/lato-variable-webfont.woff2"
|
||||
rel="preload"
|
||||
type="font/woff2"
|
||||
>
|
||||
<link
|
||||
as="font" crossorigin
|
||||
href="{{ site.theme.link }}/assets/fonts/lato/lato-variable-italic-webfont.woff2" rel="preload"
|
||||
as="font"
|
||||
crossorigin
|
||||
href="{{ site.theme.link }}/assets/fonts/lato/lato-variable-italic-webfont.woff2"
|
||||
rel="preload"
|
||||
type="font/woff2"
|
||||
>
|
||||
|
||||
{# Plausible #}
|
||||
{% if environnement == "production" %}
|
||||
<script
|
||||
data-domain="haikuatelier.com" defer
|
||||
data-domain="haikuatelier.com"
|
||||
defer
|
||||
src="https://greyhound.haikuatelier.com/js/script.js"
|
||||
></script>
|
||||
{% endif %}
|
||||
|
|
|
|||
|
|
@ -1,11 +1,15 @@
|
|||
<nav
|
||||
id="menu-categories-produits" class="menu-categories-produits"
|
||||
id="menu-categories-produits"
|
||||
class="menu-categories-produits"
|
||||
data-entrees-presentes-fin
|
||||
>
|
||||
<svg
|
||||
id="fleche-defilement-categories-produits-gauche" height="15"
|
||||
transform="scale(-1 1)" viewBox="0 0 15 15"
|
||||
width="15" xmlns="http://www.w3.org/2000/svg"
|
||||
id="fleche-defilement-categories-produits-gauche"
|
||||
height="15"
|
||||
transform="scale(-1 1)"
|
||||
viewBox="0 0 15 15"
|
||||
width="15"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M8.293 2.293a1 1 0 0 1 1.414 0l4.5 4.5a1 1 0 0 1 0 1.414l-4.5 4.5a1 1 0 0 1-1.414-1.414L11 8.5H1.5a1 1 0 0 1 0-2H11L8.293 3.707a1 1 0 0 1 0-1.414"
|
||||
|
|
@ -16,14 +20,19 @@
|
|||
<li {{ est_page_tous_produits ? "class='categorie-courante'" : '' }}><a href="{{ pages.shop.lien }}">All</a></li>
|
||||
{% for categorie in categories_produits %}
|
||||
{# TODO: Factoriser l'injection de classe d'une manière plus propre #}
|
||||
<li {{ categorie.courante ? "class='categorie-courante'" : '' }} id="categorie-{{ categorie.slug|e }}">
|
||||
<li
|
||||
{{ categorie.courante ? "class='categorie-courante'" : '' }}
|
||||
id="categorie-{{ categorie.slug|e }}"
|
||||
>
|
||||
<a href="/{{ base_categorie_produit }}/{{ categorie.slug|e }}">{{ categorie.nom|e }}</a>
|
||||
</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
<svg
|
||||
id="fleche-defilement-categories-produits-droite" height="15"
|
||||
viewBox="0 0 15 15" width="15"
|
||||
id="fleche-defilement-categories-produits-droite"
|
||||
height="15"
|
||||
viewBox="0 0 15 15"
|
||||
width="15"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
|
|
|
|||
|
|
@ -1,33 +1,45 @@
|
|||
<section class="panneau" id="panneau-informations-client">
|
||||
<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" hidden>
|
||||
<div
|
||||
class="panneau__paypal-express"
|
||||
hidden
|
||||
>
|
||||
<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"
|
||||
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"
|
||||
alt="PayPal"
|
||||
height="18"
|
||||
src="{{ site.theme.link }}/assets/img/paypal/titre-paypal.svg"
|
||||
width="67.69"
|
||||
>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<form
|
||||
class="panneau__formulaires" id="formulaire-commande"
|
||||
class="panneau__formulaires"
|
||||
id="formulaire-commande"
|
||||
method="post"
|
||||
>
|
||||
{# Formulaires pour la livraison et facturation #}
|
||||
<div class="panneau__formulaires__separation-adresses">
|
||||
<input
|
||||
id="separation-adresses" name="separation-adresses"
|
||||
id="separation-adresses"
|
||||
name="separation-adresses"
|
||||
type="checkbox"
|
||||
>
|
||||
<label for="separation-adresses">Use a separate billing address</label>
|
||||
|
|
@ -40,9 +52,12 @@
|
|||
<div class="formulaire__champs__champ">
|
||||
<label for="livraison-prenom">First name</label>
|
||||
<input
|
||||
autocomplete="given-name" id="livraison-prenom"
|
||||
minlength="2" name="livraison-prenom"
|
||||
required type="text"
|
||||
autocomplete="given-name"
|
||||
id="livraison-prenom"
|
||||
minlength="2"
|
||||
name="livraison-prenom"
|
||||
required
|
||||
type="text"
|
||||
value="{{ adresse_livraison.first_name }}"
|
||||
>
|
||||
</div>
|
||||
|
|
@ -50,9 +65,12 @@
|
|||
<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"
|
||||
autocomplete="family-name"
|
||||
id="livraison-nom"
|
||||
name="livraison-nom"
|
||||
minlength="2"
|
||||
required
|
||||
type="text"
|
||||
value="{{ adresse_livraison.last_name }}"
|
||||
>
|
||||
</div>
|
||||
|
|
@ -60,27 +78,36 @@
|
|||
<div class="formulaire__champs__champ">
|
||||
<label for="livraison-adresse">Address</label>
|
||||
<input
|
||||
autocomplete="street-address" id="livraison-adresse"
|
||||
name="livraison-adresse" required
|
||||
type="text" value="{{ adresse_livraison.address_1 }}"
|
||||
autocomplete="street-address"
|
||||
id="livraison-adresse"
|
||||
name="livraison-adresse"
|
||||
required
|
||||
type="text"
|
||||
value="{{ adresse_livraison.address_1 }}"
|
||||
>
|
||||
</div>
|
||||
|
||||
<div class="formulaire__champs__champ">
|
||||
<label for="livraison-code-postal">Postcode</label>
|
||||
<input
|
||||
id="livraison-code-postal" minlength="3"
|
||||
name="livraison-code-postal" required
|
||||
type="text" value="{{ adresse_livraison.postcode }}"
|
||||
id="livraison-code-postal"
|
||||
minlength="3"
|
||||
name="livraison-code-postal"
|
||||
required
|
||||
type="text"
|
||||
value="{{ adresse_livraison.postcode }}"
|
||||
>
|
||||
</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"
|
||||
autocomplete="address-level2"
|
||||
id="livraison-ville"
|
||||
minlength="2"
|
||||
name="livraison-ville"
|
||||
required
|
||||
type="text"
|
||||
value="{{ adresse_livraison.city }}"
|
||||
>
|
||||
</div>
|
||||
|
|
@ -88,20 +115,27 @@
|
|||
<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" value="{{ adresse_livraison.state }}"
|
||||
autocomplete="address-level1"
|
||||
id="livraison-region-etat"
|
||||
name="livraison-region-etat"
|
||||
placeholder="If applicable"
|
||||
type="text"
|
||||
value="{{ adresse_livraison.state }}"
|
||||
>
|
||||
</div>
|
||||
|
||||
<div class="formulaire__champs__champ">
|
||||
<label for="livraison-pays">Country</label>
|
||||
<select
|
||||
id="livraison-pays" name="livraison-pays"
|
||||
id="livraison-pays"
|
||||
name="livraison-pays"
|
||||
required
|
||||
>
|
||||
{% for cle, pays in pays_livraison %}
|
||||
<option {{cle == adresse_livraison.country ? "selected" : ""}} value="{{cle}}">
|
||||
<option
|
||||
{{cle == adresse_livraison.country ? "selected" : ""}}
|
||||
value="{{cle}}"
|
||||
>
|
||||
{{ pays }}
|
||||
</option>
|
||||
{% endfor %}
|
||||
|
|
@ -111,9 +145,12 @@
|
|||
<div class="formulaire__champs__champ">
|
||||
<label for="livraison-telephone">Phone</label>
|
||||
<input
|
||||
autocomplete="tel" id="livraison-telephone"
|
||||
minlength="6" name="livraison-telephone"
|
||||
required type="tel"
|
||||
autocomplete="tel"
|
||||
id="livraison-telephone"
|
||||
minlength="6"
|
||||
name="livraison-telephone"
|
||||
required
|
||||
type="tel"
|
||||
value="{{ adresse_livraison.phone }}"
|
||||
>
|
||||
</div>
|
||||
|
|
@ -121,45 +158,62 @@
|
|||
<div class="formulaire__champs__champ">
|
||||
<label for="livraison-email">Email Address</label>
|
||||
<input
|
||||
autocomplete="email" id="livraison-email"
|
||||
minlength="4" name="livraison-email"
|
||||
required type="email"
|
||||
autocomplete="email"
|
||||
id="livraison-email"
|
||||
minlength="4"
|
||||
name="livraison-email"
|
||||
required
|
||||
type="email"
|
||||
value="{{ email }}"
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="panneau__formulaires__facturation formulaire" hidden>
|
||||
<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" disabled
|
||||
id="facturation-prenom" name="facturation-prenom"
|
||||
minlength="2" required
|
||||
type="text" value="{{ adresse_facturation.first_name }}"
|
||||
autocomplete="given-name"
|
||||
disabled
|
||||
id="facturation-prenom"
|
||||
name="facturation-prenom"
|
||||
minlength="2"
|
||||
required
|
||||
type="text"
|
||||
value="{{ adresse_facturation.first_name }}"
|
||||
>
|
||||
</div>
|
||||
|
||||
<div class="formulaire__champs__champ">
|
||||
<label for="facturation-nom">Last name</label>
|
||||
<input
|
||||
autocomplete="family-name" disabled
|
||||
id="facturation-nom" name="facturation-nom"
|
||||
minlength="2" required
|
||||
type="text" value="{{ adresse_facturation.last_name }}"
|
||||
autocomplete="family-name"
|
||||
disabled
|
||||
id="facturation-nom"
|
||||
name="facturation-nom"
|
||||
minlength="2"
|
||||
required
|
||||
type="text"
|
||||
value="{{ adresse_facturation.last_name }}"
|
||||
>
|
||||
</div>
|
||||
|
||||
<div class="formulaire__champs__champ">
|
||||
<label for="facturation-adresse">Address</label>
|
||||
<input
|
||||
autocomplete="street-address" disabled
|
||||
id="facturation-adresse" name="facturation-adresse"
|
||||
required type="text"
|
||||
autocomplete="street-address"
|
||||
disabled
|
||||
id="facturation-adresse"
|
||||
name="facturation-adresse"
|
||||
required
|
||||
type="text"
|
||||
value="{{ adresse_facturation.address_1 }}"
|
||||
>
|
||||
</div>
|
||||
|
|
@ -167,9 +221,12 @@
|
|||
<div class="formulaire__champs__champ">
|
||||
<label for="facturation-code-postal">Postcode</label>
|
||||
<input
|
||||
disabled id="facturation-code-postal"
|
||||
minlength="3" name="facturation-code-postal"
|
||||
required type="text"
|
||||
disabled
|
||||
id="facturation-code-postal"
|
||||
minlength="3"
|
||||
name="facturation-code-postal"
|
||||
required
|
||||
type="text"
|
||||
value="{{ adresse_facturation.postcode }}"
|
||||
>
|
||||
</div>
|
||||
|
|
@ -177,19 +234,26 @@
|
|||
<div class="formulaire__champs__champ">
|
||||
<label for="facturation-ville">City</label>
|
||||
<input
|
||||
autocomplete="address-level2" disabled
|
||||
id="facturation-ville" minlength="2"
|
||||
name="facturation-ville" required
|
||||
type="text" value="{{ adresse_facturation.city }}"
|
||||
autocomplete="address-level2"
|
||||
disabled
|
||||
id="facturation-ville"
|
||||
minlength="2"
|
||||
name="facturation-ville"
|
||||
required
|
||||
type="text"
|
||||
value="{{ adresse_facturation.city }}"
|
||||
>
|
||||
</div>
|
||||
|
||||
<div class="formulaire__champs__champ">
|
||||
<label for="facturation-region-etat">Region/State</label>
|
||||
<input
|
||||
autocomplete="address-level1" disabled
|
||||
id="facturation-region-etat" name="facturation-region-etat"
|
||||
placeholder="If applicable" type="text"
|
||||
autocomplete="address-level1"
|
||||
disabled
|
||||
id="facturation-region-etat"
|
||||
name="facturation-region-etat"
|
||||
placeholder="If applicable"
|
||||
type="text"
|
||||
value="{{ adresse_facturation.state }}"
|
||||
>
|
||||
</div>
|
||||
|
|
@ -197,11 +261,15 @@
|
|||
<div class="formulaire__champs__champ">
|
||||
<label for="facturation-pays">Country</label>
|
||||
<select
|
||||
id="facturation-pays" name="facturation-pays"
|
||||
id="facturation-pays"
|
||||
name="facturation-pays"
|
||||
required
|
||||
>
|
||||
{% for cle, pays in pays_livraison %}
|
||||
<option {{cle == adresse_livraison.country ? "selected" : ""}} value="{{cle}}">
|
||||
<option
|
||||
{{cle == adresse_livraison.country ? "selected" : ""}}
|
||||
value="{{cle}}"
|
||||
>
|
||||
{{ pays }}
|
||||
</option>
|
||||
{% endfor %}
|
||||
|
|
@ -211,27 +279,39 @@
|
|||
<div class="formulaire__champs__champ">
|
||||
<label for="facturation-telephone">Phone</label>
|
||||
<input
|
||||
autocomplete="tel" disabled
|
||||
id="facturation-telephone" minlength="6"
|
||||
name="facturation-telephone" required
|
||||
type="tel" value="{{ adresse_facturation.phone }}"
|
||||
autocomplete="tel"
|
||||
disabled
|
||||
id="facturation-telephone"
|
||||
minlength="6"
|
||||
name="facturation-telephone"
|
||||
required
|
||||
type="tel"
|
||||
value="{{ adresse_facturation.phone }}"
|
||||
>
|
||||
</div>
|
||||
|
||||
<div class="formulaire__champs__champ">
|
||||
<label for="facturation-email">Email Address</label>
|
||||
<input
|
||||
autocomplete="email" disabled
|
||||
id="facturation-email" minlength="4"
|
||||
name="facturation-email" required
|
||||
type="email" value="{{ email }} "
|
||||
autocomplete="email"
|
||||
disabled
|
||||
id="facturation-email"
|
||||
minlength="4"
|
||||
name="facturation-email"
|
||||
required
|
||||
type="email"
|
||||
value="{{ email }} "
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="panneau__formulaires__message">
|
||||
<p class="message" id="message-formulaire-adresses"> </p>
|
||||
<p
|
||||
class="message"
|
||||
id="message-formulaire-adresses"
|
||||
>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
{# Formulaire de paiement #}
|
||||
|
|
@ -247,10 +327,14 @@
|
|||
</p>
|
||||
</div>
|
||||
|
||||
<div class="formulaire__paiement__choix" hidden>
|
||||
<div
|
||||
class="formulaire__paiement__choix"
|
||||
hidden
|
||||
>
|
||||
<label for="paiement-stripe">Credit card</label>
|
||||
<input
|
||||
id="paiement-stripe" name="type-paiement"
|
||||
id="paiement-stripe"
|
||||
name="type-paiement"
|
||||
type="radio"
|
||||
>
|
||||
</div>
|
||||
|
|
@ -259,7 +343,10 @@
|
|||
</form>
|
||||
|
||||
<footer class="panneau__pied-de-page">
|
||||
<button form="formulaire-commande" type="submit">
|
||||
<button
|
||||
form="formulaire-commande"
|
||||
type="submit"
|
||||
>
|
||||
Calculate shipping
|
||||
</button>
|
||||
</footer>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,7 @@
|
|||
<section class="panneau" id="panneau-panier">
|
||||
<section
|
||||
class="panneau"
|
||||
id="panneau-panier"
|
||||
>
|
||||
<header class="panneau__en-tete">
|
||||
<h2>Your cart</h2>
|
||||
</header>
|
||||
|
|
@ -6,8 +9,10 @@
|
|||
<div class="panneau__grille-produits">
|
||||
{% for produit in produits_panier %}
|
||||
<article
|
||||
class="panneau__grille-produits__produit" data-cle-panier="{{ produit.cle }}"
|
||||
data-id-produit="{{ produit.id_produit }}" data-id-variation="{{ produit.id_variation }}"
|
||||
class="panneau__grille-produits__produit"
|
||||
data-cle-panier="{{ produit.cle }}"
|
||||
data-id-produit="{{ produit.id_produit }}"
|
||||
data-id-variation="{{ produit.id_variation }}"
|
||||
data-quantite="{{ produit.quantite }}"
|
||||
>
|
||||
<div class="panneau__grille-produits__produit__illustratif">
|
||||
|
|
@ -34,20 +39,28 @@
|
|||
|
||||
<div class="detail-produit__actions">
|
||||
<button
|
||||
class="detail-produit__actions__soustraction" {{ produit.quantite > 1 ? "" : "disabled" }}
|
||||
class="detail-produit__actions__soustraction"
|
||||
{{ produit.quantite > 1 ? "" : "disabled" }}
|
||||
type="button"
|
||||
>
|
||||
-
|
||||
</button>
|
||||
<input
|
||||
min="1" type="number"
|
||||
min="1"
|
||||
type="number"
|
||||
value="{{ produit.quantite }}"
|
||||
>
|
||||
<button class="detail-produit__actions__addition" type="button">
|
||||
<button
|
||||
class="detail-produit__actions__addition"
|
||||
type="button"
|
||||
>
|
||||
+
|
||||
</button>
|
||||
|
||||
<button class="detail-produit__actions__suppression" type="button">
|
||||
<button
|
||||
class="detail-produit__actions__suppression"
|
||||
type="button"
|
||||
>
|
||||
Remove
|
||||
</button>
|
||||
</div>
|
||||
|
|
@ -58,27 +71,38 @@
|
|||
|
||||
<div class="panneau__instructions-code-promo">
|
||||
<textarea
|
||||
class="panneau__instructions-code-promo__instructions" id="instructions-client"
|
||||
maxlength="2000" minlength="10"
|
||||
class="panneau__instructions-code-promo__instructions"
|
||||
id="instructions-client"
|
||||
maxlength="2000"
|
||||
minlength="10"
|
||||
name="instructions"
|
||||
placeholder="Add special instructions for your order: specify the products you want wrapped and how (i.e. all in one bag or separated), a gift message, etc."
|
||||
resizable="false" rows="3"
|
||||
resizable="false"
|
||||
rows="3"
|
||||
spellcheck="true"
|
||||
></textarea>
|
||||
|
||||
<form
|
||||
action="" class="panneau__instructions-code-promo__code-promo"
|
||||
{{ code_promo ? "data-code-promo-present" : "" }} id="ensemble-code-promo"
|
||||
action=""
|
||||
class="panneau__instructions-code-promo__code-promo"
|
||||
{{ code_promo ? "data-code-promo-present" : "" }}
|
||||
id="ensemble-code-promo"
|
||||
>
|
||||
<input
|
||||
{{ code_promo ? "disabled" : "" }} id="champ-code-promo"
|
||||
maxlength="20" minlength="3"
|
||||
name="code-promo" placeholder="Discount code or gift card"
|
||||
type="text" value='{{ code_promo ? code_promo : ""}}'
|
||||
{{ code_promo ? "disabled" : "" }}
|
||||
id="champ-code-promo"
|
||||
maxlength="20"
|
||||
minlength="3"
|
||||
name="code-promo"
|
||||
placeholder="Discount code or gift card"
|
||||
type="text"
|
||||
value='{{ code_promo ? code_promo : ""}}'
|
||||
>
|
||||
<button
|
||||
class="bouton-blanc-sur-noir" for="code-promo"
|
||||
id="bouton-code-promo" type="button"
|
||||
class="bouton-blanc-sur-noir"
|
||||
for="code-promo"
|
||||
id="bouton-code-promo"
|
||||
type="button"
|
||||
>
|
||||
{{ code_promo ? "Remove" : "Apply" }}
|
||||
</button>
|
||||
|
|
@ -88,20 +112,27 @@
|
|||
</div>
|
||||
|
||||
<div class="panneau__sous-totaux">
|
||||
<div class="panneau__sous-totaux__ligne" id="sous-total-produits">
|
||||
<div
|
||||
class="panneau__sous-totaux__ligne"
|
||||
id="sous-total-produits"
|
||||
>
|
||||
<p>Subtotal:</p>
|
||||
<p><strong>{{ sous_total_panier }}€</strong></p>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="panneau__sous-totaux__ligne" id="sous-total-reduction"
|
||||
class="panneau__sous-totaux__ligne"
|
||||
id="sous-total-reduction"
|
||||
{{ code_promo ? "" : "hidden"}}
|
||||
>
|
||||
<p>Discount:</p>
|
||||
<p><strong>-{{ sous_total_reduction }}€</strong></p>
|
||||
</div>
|
||||
|
||||
<div class="panneau__sous-totaux__ligne" id="sous-total-livraison">
|
||||
<div
|
||||
class="panneau__sous-totaux__ligne"
|
||||
id="sous-total-livraison"
|
||||
>
|
||||
<p>Shipping:</p>
|
||||
{% if sous_total_livraison == 0 %}
|
||||
<p>
|
||||
|
|
|
|||
|
|
@ -2,27 +2,36 @@
|
|||
Boîte flottante contenant les informations sur le Produit, en détails, et le sélecteur de quantité/taille pour l'ajout au Panier
|
||||
#}
|
||||
|
||||
<aside aria-label="Product's details and variation selection" class="informations-produit">
|
||||
<aside
|
||||
aria-label="Product's details and variation selection"
|
||||
class="informations-produit"
|
||||
>
|
||||
<div class="informations-produit__conteneur">
|
||||
<section class="onglets-details-produit">
|
||||
{# Contenus #}
|
||||
<section
|
||||
aria-labelledby="label-details-produit" hidden
|
||||
id="details-produit" role="tabpanel"
|
||||
aria-labelledby="label-details-produit"
|
||||
hidden
|
||||
id="details-produit"
|
||||
role="tabpanel"
|
||||
>
|
||||
{{ produit.details }}
|
||||
</section>
|
||||
|
||||
<section
|
||||
aria-labelledby="label-conditions-livraison" hidden
|
||||
id="conditions-livraison" role="tabpanel"
|
||||
aria-labelledby="label-conditions-livraison"
|
||||
hidden
|
||||
id="conditions-livraison"
|
||||
role="tabpanel"
|
||||
>
|
||||
{{ descriptions_produits.texte_conditions_livraison }}
|
||||
</section>
|
||||
|
||||
<section
|
||||
aria-labelledby="label-entretien-produit" hidden
|
||||
id="entretien-produit" role="tabpanel"
|
||||
aria-labelledby="label-entretien-produit"
|
||||
hidden
|
||||
id="entretien-produit"
|
||||
role="tabpanel"
|
||||
>
|
||||
{{ descriptions_produits.texte_entretien_produit }}
|
||||
</section>
|
||||
|
|
@ -31,8 +40,10 @@
|
|||
<ul role="tablist">
|
||||
<li role="presentation">
|
||||
<a
|
||||
aria-selected="false" href="#details-produit"
|
||||
id="label-details-produit" role="tab"
|
||||
aria-selected="false"
|
||||
href="#details-produit"
|
||||
id="label-details-produit"
|
||||
role="tab"
|
||||
>
|
||||
Details
|
||||
</a>
|
||||
|
|
@ -40,8 +51,10 @@
|
|||
|
||||
<li role="presentation">
|
||||
<a
|
||||
aria-selected="false" href="#conditions-livraison"
|
||||
id="label-conditions-livraison" role="tab"
|
||||
aria-selected="false"
|
||||
href="#conditions-livraison"
|
||||
id="label-conditions-livraison"
|
||||
role="tab"
|
||||
>
|
||||
Shipping
|
||||
</a>
|
||||
|
|
@ -49,8 +62,10 @@
|
|||
|
||||
<li role="presentation">
|
||||
<a
|
||||
aria-selected="false" href="#entretien-produit"
|
||||
id="label-entretien-produit" role="tab"
|
||||
aria-selected="false"
|
||||
href="#entretien-produit"
|
||||
id="label-entretien-produit"
|
||||
role="tab"
|
||||
>
|
||||
Care
|
||||
</a>
|
||||
|
|
@ -63,23 +78,32 @@
|
|||
|
||||
{% if variations_produit|length > 1 %}
|
||||
<div class="selecteur-produit__selection-variation">
|
||||
<label for="selecteur-variation" id="label-selecteur-variation">
|
||||
<label
|
||||
for="selecteur-variation"
|
||||
id="label-selecteur-variation"
|
||||
>
|
||||
Variation:
|
||||
</label>
|
||||
|
||||
<div class="selecteur-produit__selection-variation__selecteurs">
|
||||
<select
|
||||
aria-labelledby="label-selecteur-variation" class="selecteur-natif"
|
||||
id="selecteur-variation" name="variations"
|
||||
aria-labelledby="label-selecteur-variation"
|
||||
class="selecteur-natif"
|
||||
id="selecteur-variation"
|
||||
name="variations"
|
||||
>
|
||||
<option
|
||||
disabled selected
|
||||
disabled
|
||||
selected
|
||||
value=""
|
||||
>
|
||||
--
|
||||
</option>
|
||||
{% for variation in variations_produit %}
|
||||
<option data-prix="{{ variation.prix }}" value="{{ variation.id }}">
|
||||
<option
|
||||
data-prix="{{ variation.prix }}"
|
||||
value="{{ variation.id }}"
|
||||
>
|
||||
{{ variation.titre }}
|
||||
</option>
|
||||
{% endfor %}
|
||||
|
|
@ -93,8 +117,10 @@
|
|||
|
||||
<section class="actions-produit">
|
||||
<button
|
||||
class="bouton-case-pleine" {{ variations_produit|length > 1 ? "disabled" : "" }}
|
||||
id="bouton-ajout-panier" type="button"
|
||||
class="bouton-case-pleine"
|
||||
{{ variations_produit|length > 1 ? "disabled" : "" }}
|
||||
id="bouton-ajout-panier"
|
||||
type="button"
|
||||
>
|
||||
Add to cart
|
||||
</button>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,8 @@
|
|||
<div class="fleches-defilement">
|
||||
<button class="fleches-defilement__bouton bouton-fleche" type="button">
|
||||
<button
|
||||
class="fleches-defilement__bouton bouton-fleche"
|
||||
type="button"
|
||||
>
|
||||
{#
|
||||
<svg
|
||||
height="2rem"
|
||||
|
|
@ -15,8 +18,10 @@
|
|||
</svg>
|
||||
#}
|
||||
<svg
|
||||
height="1.5rem" transform="scale(-1 1)"
|
||||
viewBox="94.634 56.652 88.879 79.521" width="1.5rem"
|
||||
height="1.5rem"
|
||||
transform="scale(-1 1)"
|
||||
viewBox="94.634 56.652 88.879 79.521"
|
||||
width="1.5rem"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
|
|
@ -26,10 +31,15 @@
|
|||
</svg>
|
||||
</button>
|
||||
|
||||
<button class="fleches-defilement__bouton bouton-fleche" type="button">
|
||||
<button
|
||||
class="fleches-defilement__bouton bouton-fleche"
|
||||
type="button"
|
||||
>
|
||||
<svg
|
||||
height="1.5rem" viewBox="94.634 56.652 88.879 79.521"
|
||||
width="1.5rem" xmlns="http://www.w3.org/2000/svg"
|
||||
height="1.5rem"
|
||||
viewBox="94.634 56.652 88.879 79.521"
|
||||
width="1.5rem"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="m94.623 136.156 88.869-36.863-88.869-42.648s21.33 20.87 21.33 39.756c0 18.891-21.33 39.755-21.33 39.755"
|
||||
|
|
@ -40,7 +50,10 @@
|
|||
</div>
|
||||
|
||||
<main class="photos-produit">
|
||||
<div aria-label="Photo of the Product alone" class="colonne colonne-gauche">
|
||||
<div
|
||||
aria-label="Photo of the Product alone"
|
||||
class="colonne colonne-gauche"
|
||||
>
|
||||
{% for photo in produit.photos_colonne_gauche %}
|
||||
<figure data-index="0">
|
||||
<picture>
|
||||
|
|
@ -50,7 +63,10 @@
|
|||
{% endfor %}
|
||||
</div>
|
||||
|
||||
<div aria-label="Photos of the Product worn" class="colonne colonne-droite">
|
||||
<div
|
||||
aria-label="Photos of the Product worn"
|
||||
class="colonne colonne-droite"
|
||||
>
|
||||
{% for photo in produit.photos_colonne_droite %}
|
||||
<figure data-index="{{ loop.index }}">
|
||||
<picture>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,7 @@
|
|||
<section aria-label="Products in the same Collection" class="produits-similaires">
|
||||
<section
|
||||
aria-label="Products in the same Collection"
|
||||
class="produits-similaires"
|
||||
>
|
||||
<header><h2>From the same Collection</h2></header>
|
||||
|
||||
{% include "parts/pages/produit/grille-produits-similaires.twig" %}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
<div
|
||||
class="grille-produits" data-page="1"
|
||||
class="grille-produits"
|
||||
data-page="1"
|
||||
{% if id_categorie_produits %}data-id-categorie-produits="{{ id_categorie_produits }}"{% endif %}
|
||||
>
|
||||
{% if produits|length > 0 %}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,9 @@
|
|||
<footer id="pied-de-page">
|
||||
<section class="zone-menu-navigation-secondaire">
|
||||
<nav class="menu-navigation" id="menu-navigation-secondaire">
|
||||
<nav
|
||||
class="menu-navigation"
|
||||
id="menu-navigation-secondaire"
|
||||
>
|
||||
<ul>
|
||||
<li><a href="/contact">Contact</a></li>
|
||||
<li><a href="/terms-and-conditions">Terms & Conditions</a></li>
|
||||
|
|
@ -10,12 +13,18 @@
|
|||
</section>
|
||||
|
||||
<section class="zone-liens-reseaux-sociaux">
|
||||
<nav class="menu-navigation" id="liens-reseaux-sociaux">
|
||||
<nav
|
||||
class="menu-navigation"
|
||||
id="liens-reseaux-sociaux"
|
||||
>
|
||||
<ul>
|
||||
{% for lien in liens_reseaux_sociaux %}
|
||||
{% if lien.url %}
|
||||
<li>
|
||||
<a href="{{ lien.url }}" target="_blank">
|
||||
<a
|
||||
href="{{ lien.url }}"
|
||||
target="_blank"
|
||||
>
|
||||
{{ lien.nom }}
|
||||
</a>
|
||||
</li>
|
||||
|
|
|
|||
|
|
@ -17,7 +17,10 @@
|
|||
</p>
|
||||
|
||||
<p>
|
||||
Don't hesitate to <a class="lien-lien" href="/contact">contact us</a> if you have any questions!
|
||||
Don't hesitate to <a
|
||||
class="lien-lien"
|
||||
href="/contact"
|
||||
>contact us</a> if you have any questions!
|
||||
</p>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -0,0 +1,42 @@
|
|||
<?php
|
||||
/**
|
||||
* Le modèle de l'email envoyé au client à la finalisation/l'envoi de la commande (« Completed Order »).
|
||||
*/
|
||||
|
||||
use Automattic\WooCommerce\Admin\Overrides\Order;
|
||||
use Carbon\Carbon;
|
||||
use Timber\Timber;
|
||||
use Illuminate\Support\Str;
|
||||
|
||||
if (!defined("ABSPATH")) {
|
||||
exit();
|
||||
}
|
||||
|
||||
// Initialise Timber
|
||||
Timber::init();
|
||||
// Sélectionne le répertoire contenant les modèles Twig
|
||||
Timber::$dirname = ["views"];
|
||||
// Contexte et modèles
|
||||
$contexte = Timber::context();
|
||||
$modeles = ["email-commande-envoyee.twig"];
|
||||
/** @var Order $commande La Commande issue du contexte contenu dans la variable $order. */
|
||||
$commande = $order;
|
||||
/** @var Carbon $date */
|
||||
$date = new Carbon($commande->get_date_created());
|
||||
|
||||
$email = [
|
||||
"commande" => [
|
||||
"date" => $date->toDateString(),
|
||||
"id" => $commande->get_id(),
|
||||
],
|
||||
"livraison" => [
|
||||
"transporteur" => Str::of($commande->get_shipping_method())->replace(" (Free)", ""),
|
||||
"numero_suivi" => blank($commande->get_meta("tracking_number"))
|
||||
? "UNKNOWN_TRACKING_NUMBER"
|
||||
: $commande->get_meta("tracking_number"),
|
||||
],
|
||||
];
|
||||
|
||||
$contexte["commande"] = $email;
|
||||
// Rendu
|
||||
Timber::render(filenames: $modeles, data: $contexte);
|
||||
|
|
@ -1,12 +1,13 @@
|
|||
<?php
|
||||
/**
|
||||
* Le modèle du reçu envoyé au client.
|
||||
* Le modèle du reçu envoyé au client (« Order Details »).
|
||||
*/
|
||||
|
||||
use Automattic\WooCommerce\Admin\Overrides\Order;
|
||||
use Carbon\Carbon;
|
||||
use Illuminate\Support\Number;
|
||||
use Illuminate\Support\Str;
|
||||
use Timber\Timber;
|
||||
use Carbon\Carbon;
|
||||
|
||||
if (!defined("ABSPATH")) {
|
||||
exit();
|
||||
|
|
@ -14,15 +15,12 @@ if (!defined("ABSPATH")) {
|
|||
|
||||
// Initialise Timber
|
||||
Timber::init();
|
||||
|
||||
// Sélectionne le répertoire contenant les modèles Twig
|
||||
Timber::$dirname = ["views"];
|
||||
|
||||
// Contexte et modèles
|
||||
$contexte = Timber::context();
|
||||
$modeles = ["email-base.twig"];
|
||||
|
||||
/** @var Order $commande */
|
||||
/** @var Order $commande La Commande issue du contexte contenu dans la variable $order. */
|
||||
$commande = $order;
|
||||
/** @var Carbon $date */
|
||||
$date = new Carbon($commande->get_date_created());
|
||||
|
|
@ -36,7 +34,10 @@ $email = [
|
|||
"date" => $date->toDateString(),
|
||||
"id" => $commande->get_id(),
|
||||
],
|
||||
"livraison" => $commande->get_shipping_method(),
|
||||
"livraison" => [
|
||||
"methode" => $commande->get_shipping_method(),
|
||||
"numero_suivi" => $commande->get_meta("tracking_number"),
|
||||
],
|
||||
"paiement" => [
|
||||
"methode" => "",
|
||||
],
|
||||
|
|
@ -47,12 +48,14 @@ $email = [
|
|||
$produit_article = $article->get_product();
|
||||
|
||||
return [
|
||||
// Récupère l'Attribut d'un Produit variable ou renvoie un tableau vide
|
||||
"attribut" => $produit->is_type("variable")
|
||||
? collect($produit->get_attributes())
|
||||
->mapWithKeys(function ($atr, $cle) use ($produit_article) {
|
||||
$nom_attribut = Str::lower(wc_attribute_label($cle, $produit_article));
|
||||
$valeur_attribut = $produit_article->get_attribute($cle);
|
||||
return ["nom" => $nom_attribut, "valeur" => $valeur_attribut];
|
||||
return [
|
||||
"nom" => Str::lower(wc_attribute_label($cle, $produit_article)),
|
||||
"valeur" => $produit_article->get_attribute($cle),
|
||||
];
|
||||
})
|
||||
->toArray()
|
||||
: [],
|
||||
|
|
@ -76,11 +79,6 @@ $email = [
|
|||
$email["adresses"]["livraison"]["country"] = WC()->countries->countries[$commande->get_shipping_country()];
|
||||
$email["adresses"]["facturation"]["country"] = WC()->countries->countries[$commande->get_billing_country()];
|
||||
|
||||
// echo "<pre>";
|
||||
// print_r($commande);
|
||||
// echo "</pre>";
|
||||
|
||||
$contexte["commande"] = $email;
|
||||
|
||||
// Rendu
|
||||
Timber::render(filenames: $modeles, data: $contexte);
|
||||
|
|
|
|||
|
|
@ -1,10 +1,13 @@
|
|||
<?php
|
||||
/**
|
||||
* Customer processing order email
|
||||
* Le modèle de l'email envoyé au client quand la Commande a été confirmée (« Processing Order »).
|
||||
*/
|
||||
|
||||
use Timber\Timber;
|
||||
use Automattic\WooCommerce\Admin\Overrides\Order;
|
||||
use Carbon\Carbon;
|
||||
use Illuminate\Support\Number;
|
||||
use Illuminate\Support\Str;
|
||||
use Timber\Timber;
|
||||
|
||||
if (!defined("ABSPATH")) {
|
||||
exit();
|
||||
|
|
@ -12,47 +15,66 @@ if (!defined("ABSPATH")) {
|
|||
|
||||
// Initialise Timber
|
||||
Timber::init();
|
||||
|
||||
// Sélectionne le répertoire contenant les modèles Twig
|
||||
Timber::$dirname = ["views"];
|
||||
|
||||
// Contexte et modèles
|
||||
$contexte = Timber::context();
|
||||
$modeles = ["email-base.twig"];
|
||||
|
||||
/** @var WC_Order $commande */
|
||||
$modeles = ["email-commande-recue.twig"];
|
||||
/** @var Order $commande La Commande issue du contexte contenu dans la variable $order. */
|
||||
$commande = $order;
|
||||
/** @var Carbon $date */
|
||||
$date = new Carbon($commande->get_date_created());
|
||||
|
||||
$email = [
|
||||
"adresses" => [
|
||||
"facturation" => [],
|
||||
"livraison" => [],
|
||||
"facturation" => $commande->get_address("billing"),
|
||||
"livraison" => $commande->get_address("shipping"),
|
||||
],
|
||||
"commande" => [
|
||||
"date" => $date->toDateString(),
|
||||
"id" => $commande->get_id(),
|
||||
],
|
||||
"livraison" => [],
|
||||
"produits" => collect($commande->get_items())->map(function (WC_Order_Item $produit) {
|
||||
"paiement" => [
|
||||
"methode" => "",
|
||||
],
|
||||
"produits" => collect($commande->get_items())->map(function (WC_Order_Item_Product $article) {
|
||||
/** @var WC_Product_Simple|WC_Product_Variable $produit */
|
||||
$produit = wc_get_product($article["product_id"]);
|
||||
/** @var WC_Product_Simple|WC_Product_Variation $produit_article */
|
||||
$produit_article = $article->get_product();
|
||||
|
||||
return [
|
||||
// Récupère l'Attribut d'un Produit variable ou renvoie un tableau vide
|
||||
"attribut" => $produit->is_type("variable")
|
||||
? collect($produit->get_attributes())
|
||||
->mapWithKeys(function ($atr, $cle) use ($produit_article) {
|
||||
return [
|
||||
"nom" => Str::lower(wc_attribute_label($cle, $produit_article)),
|
||||
"valeur" => $produit_article->get_attribute($cle),
|
||||
];
|
||||
})
|
||||
->toArray()
|
||||
: [],
|
||||
"lien" => $produit->get_permalink(),
|
||||
"nom" => $produit->get_name(),
|
||||
"prix_total" => $produit->get_total(),
|
||||
"quantite" => $produit->get_quantity(),
|
||||
"titre_variation" => "",
|
||||
"nom" => $produit->get_title(),
|
||||
"prix_total" => $article->get_total(),
|
||||
"quantite" => $article->get_quantity(),
|
||||
];
|
||||
}),
|
||||
"totaux" => [
|
||||
"sous_total_livraison" => $commande->get_shipping_total(),
|
||||
"sous_total_produits" => $commande->get_subtotal(),
|
||||
"sous_total_reduction" => $commande->get_discount_total(),
|
||||
"total" => $commande->get_total(),
|
||||
"sous_total_livraison" => $commande->get_shipping_total() == "0" ? "Free" : $commande->get_shipping_total() . "€",
|
||||
"sous_total_produits" => $commande->get_subtotal() . "€",
|
||||
"sous_total_reduction" =>
|
||||
$commande->get_discount_total == "0.00"
|
||||
? "0"
|
||||
: Number::format($commande->get_discount_total(), maxPrecision: 2) . "€",
|
||||
"total" => Number::format($commande->get_total(), maxPrecision: 2) . "€",
|
||||
],
|
||||
];
|
||||
// Transforme les codes de pays en noms de pays
|
||||
$email["adresses"]["livraison"]["country"] = WC()->countries->countries[$commande->get_shipping_country()];
|
||||
$email["adresses"]["facturation"]["country"] = WC()->countries->countries[$commande->get_billing_country()];
|
||||
|
||||
$contexte["commande"] = $email;
|
||||
|
||||
// Rendu
|
||||
Timber::render(filenames: $modeles, data: $contexte);
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
<?php
|
||||
/**
|
||||
* Le modèle du reçu envoyé au client.
|
||||
* NOOP.
|
||||
*/
|
||||
|
||||
if (!defined("ABSPATH")) {
|
||||
exit(); // Exit if accessed directly
|
||||
exit();
|
||||
} ?>
|
||||
|
|
|
|||
|
|
@ -1,8 +1,8 @@
|
|||
<?php
|
||||
/**
|
||||
* Le modèle du reçu envoyé au client.
|
||||
* NOOP.
|
||||
*/
|
||||
|
||||
if (!defined("ABSPATH")) {
|
||||
exit(); // Exit if accessed directly
|
||||
exit();
|
||||
} ?>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,8 @@
|
|||
<?php
|
||||
/**
|
||||
* NOOP.
|
||||
*/
|
||||
|
||||
if (!defined("ABSPATH")) {
|
||||
exit(); // Exit if accessed directly
|
||||
exit();
|
||||
} ?>
|
||||
|
|
|
|||
|
|
@ -2,8 +2,14 @@
|
|||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type">
|
||||
<meta content="width=device-width, initial-scale=1.0" name="viewport">
|
||||
<meta
|
||||
content="text/html; charset=UTF-8"
|
||||
http-equiv="Content-Type"
|
||||
>
|
||||
<meta
|
||||
content="width=device-width, initial-scale=1.0"
|
||||
name="viewport"
|
||||
>
|
||||
<meta name="x-apple-disable-message-reformatting">
|
||||
<style>
|
||||
@font-face {
|
||||
|
|
@ -66,8 +72,8 @@
|
|||
|
||||
font-family: Lato, sans-serif;
|
||||
font-size: 16px;
|
||||
line-height: 1.4;
|
||||
font-optical-sizing: auto;
|
||||
line-height: 1.4;
|
||||
color: #202020;
|
||||
text-size-adjust: none;
|
||||
|
||||
|
|
@ -79,7 +85,8 @@
|
|||
}
|
||||
|
||||
a {
|
||||
text-decoration: underline;
|
||||
color: inherit;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
a img {
|
||||
|
|
@ -101,7 +108,7 @@
|
|||
padding: 0;
|
||||
|
||||
font-size: 24px;
|
||||
font-weight: 300;
|
||||
font-weight: 400;
|
||||
font-style: italic;
|
||||
text-transform: uppercase;
|
||||
text-wrap: balance;
|
||||
|
|
@ -109,12 +116,14 @@
|
|||
|
||||
h3 {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
margin-bottom: 16px;
|
||||
padding: 0;
|
||||
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
font-style: italic;
|
||||
text-wrap: balance;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
p, ul, ol, blockquote {
|
||||
|
|
@ -128,8 +137,6 @@
|
|||
width: 100%;
|
||||
}
|
||||
|
||||
/* Sections */
|
||||
|
||||
.email-wrapper, .email-header, .email-content, .email-body {
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
|
|
@ -147,18 +154,19 @@
|
|||
}
|
||||
|
||||
.email-body_inner {
|
||||
width: 570px;
|
||||
margin: auto;
|
||||
|
||||
border: 1px solid #202020;
|
||||
border-top: initial;
|
||||
border-bottom: initial;
|
||||
margin: auto;
|
||||
width: 570px;
|
||||
}
|
||||
|
||||
.email-body_inner_header {
|
||||
padding: 20px;
|
||||
text-align: center;
|
||||
background: #defdb5;
|
||||
border-bottom: 1px solid #202020;
|
||||
background: #ebffb8;
|
||||
}
|
||||
|
||||
.order {
|
||||
|
|
@ -167,13 +175,23 @@
|
|||
|
||||
.order .order_details {
|
||||
width: 100%;
|
||||
padding: 20px;
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
.order .order_details p:not(.order_details_id-date) {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.order .order_details p + p {
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.product > td {
|
||||
font-size: 14px;
|
||||
padding: 14px;
|
||||
|
||||
font-size: 14px;
|
||||
vertical-align: top;
|
||||
|
||||
border-top: 1px solid #202020;
|
||||
border-bottom: 1px solid #202020;
|
||||
}
|
||||
|
|
@ -227,9 +245,9 @@
|
|||
}
|
||||
|
||||
.total td {
|
||||
padding: 16px;
|
||||
font-size: 16px;
|
||||
font-weight: 600;
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
.total .total_title {
|
||||
|
|
@ -253,13 +271,17 @@
|
|||
font-size: 14px;
|
||||
}
|
||||
|
||||
.addresses .addresses_body p + p {
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.spacing {
|
||||
margin-bottom: 16px;
|
||||
border-top: 1px solid #202020;
|
||||
}
|
||||
|
||||
.footer {
|
||||
background: #ebffb8;
|
||||
background: #defdb5;
|
||||
border-top: 1px solid #202020;
|
||||
}
|
||||
|
||||
|
|
@ -281,6 +303,10 @@
|
|||
}
|
||||
|
||||
@media only screen and (width <= 600px) {
|
||||
.email-body, .email-body_inner {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
.email-footer {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
|
@ -289,30 +315,49 @@
|
|||
<title>Haiku Atelier</title>
|
||||
</head>
|
||||
<body>
|
||||
<table class="email-wrapper" role="presentation">
|
||||
<table
|
||||
class="email-wrapper"
|
||||
role="presentation"
|
||||
>
|
||||
<tr>
|
||||
<td>
|
||||
<table class="email-content" role="presentation">
|
||||
<table
|
||||
class="email-content"
|
||||
role="presentation"
|
||||
>
|
||||
<!-- En-tête -->
|
||||
<tr>
|
||||
<td class="email-header">Haiku Atelier</td>
|
||||
</tr>
|
||||
|
||||
<!-- Corps -->
|
||||
<tr>
|
||||
<td class="email-body">
|
||||
<table class="email-body_inner" role="presentation">
|
||||
<table
|
||||
class="email-body_inner"
|
||||
role="presentation"
|
||||
>
|
||||
<tr>
|
||||
<td class="email-body_inner_header" colspan="9">
|
||||
<td
|
||||
class="email-body_inner_header"
|
||||
colspan="9"
|
||||
>
|
||||
<h2>Thanks for your order!</h2>
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
<tr class="email-body_inner_line order">
|
||||
<td class="order_details" colspan="2">
|
||||
<td
|
||||
class="order_details"
|
||||
colspan="2"
|
||||
>
|
||||
<p class="order_details_id-date">
|
||||
Order number:
|
||||
<strong>{{ commande.commande.id }}</strong>
|
||||
({{ commande.commande.date }})
|
||||
</p>
|
||||
|
||||
{% block texte_supplementaire %}
|
||||
{% endblock %}
|
||||
</td>
|
||||
</tr>
|
||||
|
||||
|
|
@ -374,7 +419,7 @@
|
|||
<!-- Adresses -->
|
||||
<tr class="addresses">
|
||||
<td class="addresses_body addresses-shipping">
|
||||
<h3>Shipping Address</h3>
|
||||
<h3>Delivery</h3>
|
||||
|
||||
<p>
|
||||
{{ commande.adresses.livraison.first_name }}
|
||||
|
|
@ -391,7 +436,8 @@
|
|||
{{ commande.adresses.livraison.state }}<br>
|
||||
{% endif %}
|
||||
{{ commande.adresses.livraison.country }}
|
||||
<br>
|
||||
</p>
|
||||
<p>
|
||||
{{ commande.adresses.facturation.email }}
|
||||
<br>
|
||||
{{ commande.adresses.livraison.phone }}
|
||||
|
|
@ -400,7 +446,7 @@
|
|||
</td>
|
||||
|
||||
<td class="addresses_body addresses-billing">
|
||||
<h3>Billing Address</h3>
|
||||
<h3>Billing</h3>
|
||||
|
||||
<p>
|
||||
{{ commande.adresses.facturation.first_name }}
|
||||
|
|
@ -417,7 +463,8 @@
|
|||
{{ commande.adresses.facturation.state }}<br>
|
||||
{% endif %}
|
||||
{{ commande.adresses.facturation.country }}
|
||||
<br>
|
||||
</p>
|
||||
<p>
|
||||
{{ commande.adresses.facturation.email }}
|
||||
<br>
|
||||
{{ commande.adresses.facturation.phone }}
|
||||
|
|
@ -429,17 +476,21 @@
|
|||
</td>
|
||||
</tr>
|
||||
|
||||
{# Espacement #}
|
||||
<tr class="spacing">
|
||||
<td> </td>
|
||||
</tr>
|
||||
|
||||
<!-- Pied de page -->
|
||||
{# Pied de page #}
|
||||
<tr class="footer">
|
||||
<td>
|
||||
<table class="email-footer" role="presentation">
|
||||
<table
|
||||
class="email-footer"
|
||||
role="presentation"
|
||||
>
|
||||
<tr>
|
||||
<td>
|
||||
<p>haikuatelier.com</p>
|
||||
<p><a href="haikuatelier.com">haikuatelier.com</a></p>
|
||||
</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,8 @@
|
|||
{% extends "email-base.twig" %}
|
||||
|
||||
{% block texte_supplementaire %}
|
||||
<p>
|
||||
Your order has been received and will be dispatched as soon as possible. You will be receive a tracking number once
|
||||
it has been sent.
|
||||
</p>
|
||||
{% endblock %}
|
||||
Loading…
Add table
Add a link
Reference in a new issue