From 42bed0cc7e62f0c3949587d29f590d9771bf9aea Mon Sep 17 00:00:00 2001
From: Kate <inthemist04@gmail.com>
Date: Thu, 21 Nov 2024 19:59:36 +0700
Subject: [PATCH] =?UTF-8?q?=D0=B4=D0=B5=D0=BB=D0=B0=D0=B5=D1=82=20=D0=B7?=
 =?UTF-8?q?=D0=B0=D0=B4=D0=B0=D0=BD=D0=B8=D0=B5=20=D1=81=D0=B5=D0=B4=D1=8C?=
 =?UTF-8?q?=D0=BC=D0=BE=D0=B3=D0=BE=20=D0=BC=D0=BE=D0=B4=D1=83=D0=BB=D1=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 js/main.js       |  1 +
 js/thumbnails.js | 22 ++++++++++++++++++++++
 2 files changed, 23 insertions(+)
 create mode 100644 js/thumbnails.js

diff --git a/js/main.js b/js/main.js
index 4588c36..6285485 100644
--- a/js/main.js
+++ b/js/main.js
@@ -1,4 +1,5 @@
 import './util.js';
 import {CreatePhotoList} from './data.js';
+import './thumbnails.js';
 
 console.log(CreatePhotoList());
diff --git a/js/thumbnails.js b/js/thumbnails.js
new file mode 100644
index 0000000..ee29566
--- /dev/null
+++ b/js/thumbnails.js
@@ -0,0 +1,22 @@
+import {CreatePhotoList} from './data.js';
+
+const pictures = document.querySelector('.pictures');
+const thumbnailsTemplate = document.querySelector('#picture')
+  .content
+  .querySelector('.picture');
+
+const usersThumbnails = CreatePhotoList ();
+
+const usersThumbnailsFragment = document.createDocumentFragment();
+
+usersThumbnails.forEach((photo) => {
+  const usersElement = thumbnailsTemplate.cloneNode(true);
+  usersElement.querySelector('.picture__img').src = photo.url;
+  usersElement.querySelector('.picture__img').alt = photo.description;
+  usersElement.querySelector('.picture__likes').textContent = photo.likes;
+  usersElement.querySelector('.picture__comments').textContent = photo.comments.length;
+  usersThumbnailsFragment.appendChild(usersElement);
+});
+
+pictures.appendChild(usersThumbnailsFragment);
+