Merge pull request #254 from hoangsonww/main-deployment-branch

Enhanced App UI
hoangsonww · Jan 19, 2025 · 2e939c3 · 2e939c3
2 parents 706ef82 + 4120fe0
commit 2e939c3
Show file tree

Hide file tree

Showing 5 changed files with 6 additions and 5 deletions.
diff --git a/MovieVerse-Frontend/html/about.html b/MovieVerse-Frontend/html/about.html
@@ -731,7 +731,7 @@ <h3 id="subheading4" style="animation: fadeIn 1.5s ease-in-out; cursor: pointer"
 
         const imageUrl = this.src;
         const modalHtml = `<div id="image-modal" style="z-index: 10002; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
-                                <img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 10px;">
+                                <img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 10px;" alt="The MovieVerse Logo" />
                                 <span style="position: absolute; top: 10px; right: 25px; font-size: 40px; cursor: pointer" id="removeBtn" onclick="document.getElementById('image-modal').remove();">&times;</span>
                             </div>`;
         document.body.insertAdjacentHTML('beforeend', modalHtml);

diff --git a/MovieVerse-Frontend/html/actor-details.html b/MovieVerse-Frontend/html/actor-details.html
@@ -609,7 +609,7 @@ <h2 id="actor-name" class="actor-header"></h2>
       document.getElementById('actor-image').addEventListener('click', function () {
         const imageUrl = this.src.replace('w1280', 'original');
         const modalHtml = `<div id="image-modal" style="z-index: 100020000; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
-                                <img src="${imageUrl}" style="max-width: 95%; max-height: 95%; border-radius: 10px;">
+                                <img src="${imageUrl}" style="max-width: 95%; max-height: 95%; border-radius: 10px;" alt="Actor Image"/>
                                 <span style="position: absolute; top: 10px; right: 25px; font-size: 40px; cursor: pointer" id="removeBtn" onclick="document.getElementById('image-modal').remove();">&times;</span>
                             </div>`;
         document.body.insertAdjacentHTML('beforeend', modalHtml);

diff --git a/MovieVerse-Frontend/html/company-details.html b/MovieVerse-Frontend/html/company-details.html
@@ -636,7 +636,7 @@ <h2 id="company-name" class="company-header"></h2>
       document.getElementById('company-logo').addEventListener('click', function () {
         const imageUrl = this.src.replace('w500', 'original');
         const modalHtml = `<div id="image-modal" style="z-index: 10002; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
-                                <img src="${imageUrl}" style="max-width: 80%; max-height: 95%; border-radius: 10px; background-color: white">
+                                <img src="${imageUrl}" style="max-width: 80%; max-height: 95%; border-radius: 10px; background-color: white" alt="Company Logo" />
                                 <span style="position: absolute; top: 10px; right: 25px; font-size: 40px; cursor: pointer" id="removeBtn" onclick="document.getElementById('image-modal').remove();">&times;</span>
                             </div>`;
         document.body.insertAdjacentHTML('beforeend', modalHtml);

diff --git a/MovieVerse-Frontend/html/director-details.html b/MovieVerse-Frontend/html/director-details.html
@@ -964,7 +964,7 @@ <h2 id="director-name" class="director-header"></h2>
     document.getElementById('director-image').addEventListener('click', function () {
       const imageUrl = this.src.replace('w1280', 'original');
       const modalHtml = `<div id="image-modal" style="z-index: 1000200000; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
-                                <img src="${imageUrl}" style="max-width: 95%; max-height: 95%; border-radius: 10px;">
+                                <img src="${imageUrl}" style="max-width: 95%; max-height: 95%; border-radius: 10px;" alt="Director Image" />
                                 <span style="position: absolute; top: 10px; right: 25px; font-size: 40px; cursor: pointer" id="removeBtn" onclick="document.getElementById('image-modal').remove();">&times;</span>
                             </div>`;
       document.body.insertAdjacentHTML('beforeend', modalHtml);
@@ -976,4 +976,5 @@ <h2 id="director-name" class="director-header"></h2>
       });
     });
   </script>
+
 </html>
diff --git a/MovieVerse-Frontend/html/how-to-play.html b/MovieVerse-Frontend/html/how-to-play.html
@@ -794,7 +794,7 @@ <h3>Stack the Blocks</h3>
       document.getElementById('logo').addEventListener('click', function () {
         const imageUrl = this.src;
         const modalHtml = `<div id="image-modal" style="z-index: 10002; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.8); display: flex; justify-content: center; align-items: center;">
-                                <img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 10px;">
+                                <img src="${imageUrl}" style="max-width: 80%; max-height: 80%; border-radius: 10px;" alt="The MovieVerse Logo" />
                                 <span style="position: absolute; top: 10px; right: 25px; font-size: 40px; cursor: pointer" id="removeBtn" onclick="document.getElementById('image-modal').remove();">&times;</span>
                             </div>`;
         document.body.insertAdjacentHTML('beforeend', modalHtml);