From e4adf09bd7c4e928677fe1c04908e37c7a61065d Mon Sep 17 00:00:00 2001
From: Hadidreem17 <Hadidreem17@gmail.com>
Date: Tue, 16 Sep 2025 22:28:09 +0200
Subject: [PATCH 1/2] Solve Week1: ex1-bookList

---
 .../Week1/assignment/ex1-bookList/index.js    | 19 +++++++++-
 .../Week1/assignment/ex1-bookList/style.css   | 36 +++++++++++++++++++
 2 files changed, 54 insertions(+), 1 deletion(-)

diff --git a/2-Browsers/Week1/assignment/ex1-bookList/index.js b/2-Browsers/Week1/assignment/ex1-bookList/index.js
index 24a92487d..37e5a79e8 100644
--- a/2-Browsers/Week1/assignment/ex1-bookList/index.js
+++ b/2-Browsers/Week1/assignment/ex1-bookList/index.js
@@ -18,9 +18,26 @@ https://hackyourfuture.github.io/example-pages/Browsers/Week1/1-booklist/
 //cspell: enable
 
 function createBookList(books) {
-  // TODO your code goes in here, return the ul element
+  const ul = document.createElement ('ul');
+  books.forEach( book => {
+    const li = document.createElement ('li');
+    const p = document.createElement ( 'p');
+    p.textContent = `${book.title} - ${book.author} `;
+    const img = document.createElement ('img');
+    img.src = `https://covers.openlibrary.org/b/isbn/${book.isbn}-M.jpg`;
+    li.appendChild (p);
+    li.appendChild (img);
+    if (book.alreadyRead) {
+      li.style.backgroundColor = 'green';
+    }
+    else 
+  { li.style.backgroundColor = 'red'} ;
+    ul.appendChild (li);
+  });
+  return ul;
 }
 
+
 function main() {
   const myBooks = [
     {
diff --git a/2-Browsers/Week1/assignment/ex1-bookList/style.css b/2-Browsers/Week1/assignment/ex1-bookList/style.css
index 55ad76b29..33a6e798d 100644
--- a/2-Browsers/Week1/assignment/ex1-bookList/style.css
+++ b/2-Browsers/Week1/assignment/ex1-bookList/style.css
@@ -1 +1,37 @@
 /* Write your style here */
+body {
+    font-family: Arial, sans-serif;
+    background-color: #f4f4f4;
+    margin: 0;
+    padding: 20px;
+}
+h1 {
+    text-align: center;
+    color: #333;
+}
+ul {
+    list-style-type: none;
+    padding: 0;
+    display : grid ;
+    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+    gap : 16px;
+
+}
+li {
+    background: #fff;
+    margin: 10px 0;
+    padding: 15px;
+    border-radius: 5px;
+    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
+}
+img {
+   width: 100% ;
+   height: auto ;
+   border -radius: 5px ;
+   display : block ;
+   
+}
+p {
+    margin: 0;
+    padding: 0;
+}

From 48281caecb600bf007a0da2f7d2cd429004d55fa Mon Sep 17 00:00:00 2001
From: Hadidreem17 <Hadidreem17@gmail.com>
Date: Tue, 16 Sep 2025 23:00:03 +0200
Subject: [PATCH 2/2] Week1 Browsers: complete ex1-bookList

---
 .test-summary/TEST_SUMMARY.md                  |  9 +++++++++
 .../Week1/assignment/ex1-bookList/index.js     |  1 +
 .../Week1/test-reports/ex1-bookList.report.txt | 18 ++++++++++++++++++
 3 files changed, 28 insertions(+)
 create mode 100644 .test-summary/TEST_SUMMARY.md
 create mode 100644 2-Browsers/Week1/test-reports/ex1-bookList.report.txt

diff --git a/.test-summary/TEST_SUMMARY.md b/.test-summary/TEST_SUMMARY.md
new file mode 100644
index 000000000..4bbb917b6
--- /dev/null
+++ b/.test-summary/TEST_SUMMARY.md
@@ -0,0 +1,9 @@
+## Test Summary
+
+**Mentors**: For more information on how to review homework assignments, please refer to the [Review Guide](https://github.com/HackYourFuture/mentors/blob/main/assignment-support/review-guide.md).
+
+### 2-Browsers - Week1
+
+|   Exercise   | Passed | Failed | ESLint |
+|--------------|--------|--------|--------|
+| ex1-bookList |   6    |   -    |   ✓    |
diff --git a/2-Browsers/Week1/assignment/ex1-bookList/index.js b/2-Browsers/Week1/assignment/ex1-bookList/index.js
index 37e5a79e8..90cde9dfe 100644
--- a/2-Browsers/Week1/assignment/ex1-bookList/index.js
+++ b/2-Browsers/Week1/assignment/ex1-bookList/index.js
@@ -25,6 +25,7 @@ function createBookList(books) {
     p.textContent = `${book.title} - ${book.author} `;
     const img = document.createElement ('img');
     img.src = `https://covers.openlibrary.org/b/isbn/${book.isbn}-M.jpg`;
+    img.alt = `${book.title} cover`;
     li.appendChild (p);
     li.appendChild (img);
     if (book.alreadyRead) {
diff --git a/2-Browsers/Week1/test-reports/ex1-bookList.report.txt b/2-Browsers/Week1/test-reports/ex1-bookList.report.txt
new file mode 100644
index 000000000..d7f690900
--- /dev/null
+++ b/2-Browsers/Week1/test-reports/ex1-bookList.report.txt
@@ -0,0 +1,18 @@
+*** Unit Test Error Report ***
+
+ PASS  .dist/2-Browsers/Week1/unit-tests/ex1-bookList.test.js
+  br-wk1-ex1-bookList
+    ✅ HTML should be syntactically valid (136 ms)
+    ✅ should have all TODO comments removed
+    ✅ should contain a <ul> that is a child of <div id="bookList"> (2 ms)
+    ✅ should contain a <ul> with 3 <li> elements (1 ms)
+    ✅ should contain an <li> with title and author for each book of the `myBooks` array (1 ms)
+    ✅ should contain an <img> element for each book
+
+Test Suites: 1 passed, 1 total
+Tests:       6 passed, 6 total
+Snapshots:   0 total
+Time:        3.628 s, estimated 13 s
+Ran all test suites matching /C:\\Users\\Rimha\\Assignments-Cohort54\\.dist\\2-Browsers\\Week1\\unit-tests\\ex1-bookList.test.js/i.
+No linting errors detected.
+No spelling errors detected.