From 2625384fd801806205aafa5a49e31864dbcd8448 Mon Sep 17 00:00:00 2001 From: Thomas Fritsch <tf@kumquats.fr> Date: Mon, 10 Feb 2020 00:56:43 +0100 Subject: [PATCH] D.1. PizzaThumbnail --- js/components/PizzaThumbnail.js | 27 +++++++++++++++++++++++++++ js/main.js | 11 +++-------- 2 files changed, 30 insertions(+), 8 deletions(-) create mode 100644 js/components/PizzaThumbnail.js diff --git a/js/components/PizzaThumbnail.js b/js/components/PizzaThumbnail.js new file mode 100644 index 0000000..4e83144 --- /dev/null +++ b/js/components/PizzaThumbnail.js @@ -0,0 +1,27 @@ +import Component from './Component.js'; +import Img from './Img.js'; + +export default class PizzaThumbnail extends Component { + constructor({ nom, image, prix_petite, prix_grande }) { + super('article', { name: 'class', value: 'media' }, [ + new Component('a', { name: 'href', value: image }, [ + new Img(image), + new Component('section', { name: 'class', value: 'infos' }, [ + new Component('h4', null, nom), + new Component('ul', null, [ + new Component( + 'li', + null, + `Prix petit format : ${prix_petite.toFixed(2)} €` + ), + new Component( + 'li', + null, + `Prix grand format : ${prix_grande.toFixed(2)} €` + ), + ]), + ]), + ]), + ]); + } +} diff --git a/js/main.js b/js/main.js index 1b18a50..4fa116e 100644 --- a/js/main.js +++ b/js/main.js @@ -1,14 +1,9 @@ import data from './data.js'; import Component from './components/Component.js'; -import Img from './components/Img.js'; +import PizzaThumbnail from './components/PizzaThumbnail.js'; const title = new Component('h1', null, ['La', ' ', 'carte']); document.querySelector('.pageTitle').innerHTML = title.render(); -const c = new Component('article', { name: 'class', value: 'media' }, [ - new Img( - 'https://images.unsplash.com/photo-1532246420286-127bcd803104?fit=crop&w=500&h=300' - ), - 'Regina', -]); -document.querySelector('.pizzasContainer').innerHTML = c.render(); +const pt = new PizzaThumbnail(data[0]); +document.querySelector('.pizzasContainer').innerHTML = pt.render(); -- GitLab