fix: apply owl background image to all pages, fix duplicate image on …#185
Conversation
…index.html Agent-Logs-Url: https://github.com/DavidKRK/DavidKRK.github.io/sessions/28085f91-8e33-4a62-8391-35151e5a9bf3 Co-authored-by: DavidKRK <136035295+DavidKRK@users.noreply.github.com>
|
|
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
This pull request updates the global styling by applying the background image to the body element instead of just the home page and removes a redundant image container from the HTML. A review comment suggests adding a fallback background color to the body to maintain text readability in case the background image fails to load.
| /* ---------- BACKGROUND ---------- */ | ||
| body { | ||
| background-image: url("../images/david_krk_owl.jpg"); | ||
| background-size: cover; | ||
| background-position: left center; |
There was a problem hiding this comment.
When using a background image, it is a best practice to provide a fallback background-color. This ensures that the content remains readable (especially since the global text color is white) if the image fails to load or while it is being downloaded. You can reuse the color #416e73 that was previously assigned to non-home pages.
/* ---------- BACKGROUND ---------- */
body {
background-image: url("../images/david_krk_owl.jpg");
background-size: cover;
background-position: left center;
background-color: #416e73;There was a problem hiding this comment.
Pull request overview
Updates site styling so the owl image is used as the page background everywhere (instead of only on the home page), and removes the extra inline owl image on the home page to avoid duplication.
Changes:
- Remove the standalone
<img>owl block fromindex.htmlto prevent showing the owl twice. - Change background CSS from
body.home-pageto globalbodyso all pages use the owl background image. - Remove the special-case non-home-page
body:not(.home-page)styling in favor of a single global body background rule.
Reviewed changes
Copilot reviewed 2 out of 2 changed files in this pull request and generated 1 comment.
| File | Description |
|---|---|
| index.html | Removes the duplicated inline owl image element from the home page. |
| assets/css/style.css | Applies the owl background styling to all pages by moving from .home-page to global body. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
@copilot apply changes based on the comments in this thread |
Agent-Logs-Url: https://github.com/DavidKRK/DavidKRK.github.io/sessions/400980e0-28f8-4279-bb21-d6468464f2dd Co-authored-by: DavidKRK <136035295+DavidKRK@users.noreply.github.com>
|
@copilot resolve the merge conflicts in this pull request |
Co-authored-by: DavidKRK <136035295+DavidKRK@users.noreply.github.com>
Merge conflict resolved in commit |
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 1 out of 1 changed files in this pull request and generated 1 comment.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| body { | ||
| background-color: #416e73; | ||
| background-image: url("../images/david_krk_owl.jpg"); |
There was a problem hiding this comment.
The PR title/description mention applying the owl background to all pages and fixing a duplicate image on index.html, but the diff shown here only adds a background-color fallback to the existing body background. If additional changes are intended, they appear to be missing from this PR; otherwise, please update the PR title/description to match the actual change set.
…index.html
Agent-Logs-Url: https://github.com/DavidKRK/DavidKRK.github.io/sessions/28085f91-8e33-4a62-8391-35151e5a9bf3
name: Pull Request
about: Proposer un changement au projet
title: ''
labels: ''
assignees: ''
1. Quels sont les changements ?
Résumé des changements :
(Décrivez brièvement les modifications apportées.)
Tickets / Issues liés :
2. Pourquoi ces changements ?
Contexte métier :
(Expliquez la raison fonctionnelle ou business de ces changements.)
Justification technique :
(Expliquez les choix d'architecture ou d'implémentation retenus.)
3. Tests
Tests unitaires :
npm test/bundle exec rspec/ …)Tests manuels :
Performances & Sécurité :
4. Changements majeurs (Breaking Changes)
Cette PR introduit-elle des ruptures d'API ou de comportement ?
(Décrivez les ruptures et les impacts pour les consommateurs de l'API / les autres équipes.)
Instructions de migration :
(Si applicable, décrivez les étapes nécessaires pour migrer.)
5. Exigences de déploiement
Variables d'environnement :
NOM_VARvaleurNotes de déploiement supplémentaires :
(Toute information utile pour l'équipe de déploiement.)