Birmingham | 26-ITP-May | Gabriel Pawuoi | Sprint 3 | Implement reading-list - #1414
Open
KhotKeys wants to merge 2 commits into
Open
Birmingham | 26-ITP-May | Gabriel Pawuoi | Sprint 3 | Implement reading-list#1414KhotKeys wants to merge 2 commits into
KhotKeys wants to merge 2 commits into
Conversation
This comment has been minimized.
This comment has been minimized.
KhotKeys
force-pushed
the
sprint-3/reading-list
branch
from
August 9, 2026 14:48
96eb8fb to
703b5b3
Compare
KhotKeys
added
🏕 Priority Mandatory
webmonch
added
Review in progress
webmonch
reviewed
Aug 16, 2026
|
|
||
| // Patch getComputedStyle so that inline background-color is returned as-is | ||
| // (jsdom converts named colors to rgb, breaking toHaveStyle with named colors) | ||
| const _origGCS = window.getComputedStyle.bind(window); |
webmonch
reviewed
Aug 16, 2026
| const list = document.getElementById("reading-list"); | ||
| books.forEach((book) => { | ||
| const li = document.createElement("li"); | ||
| li.style.backgroundColor = book.alreadyRead ? "green" : "red"; |
There was a problem hiding this comment.
What other approach could be used here for styling?
Author
There was a problem hiding this comment.
Instead of writing inline styles directly in JavaScript, a better approach would be to toggle CSS classes using classList. For example, I could use li.classList.add(book.alreadyRead ? 'read' : 'unread'); and define the background colors inside style.css. This separates the presentation logic cleanly from the JavaScript application state.
|
Maybe worth having another look at README to make sure all requirements are met for this exercise. |
webmonch
added
Reviewed
KhotKeys
added
Needs Review
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Learners, PR Template
Self checklist
Changelist
Implemented DOM rendering that loops over the books array and creates a list item for each book with its cover image, title, and author.
Set the background colour of each list item to green if the book has been read or red if it has not, based on the alreadyRead property.