GTA
/
training-academy
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases 3 Wiki Activity

Clean up image display interface 

Visual improvements:
- Removed filename display from under images for cleaner look
- Removed 'Custom' badge to reduce visual clutter
- Added hover tooltip showing filename when mouse over image
- Simplified image-info section to only show enable/disable controls
- Cleaned up unused isCustom variable logic

Benefits:
- Much cleaner, more minimalist image gallery appearance
- Filename information still accessible via hover tooltip
- Less visual noise - focus on the images themselves
- Enable/disable functionality remains prominent and clear
- More professional gallery layout similar to modern image managers
This commit is contained in:
fritzsenpai 2025-09-25 20:39:56 -05:00
parent f4d695aa76
commit d060f46292
1 changed files with 1 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
game.js
View File

@ -1122,12 +1122,10 @@ class TaskChallengeGame {
imageItem.dataset.imagePath = imagePath;
const isDisabled = disabledImages.includes(imagePath);
const isCustom = customImages.includes(imageData);
imageItem.innerHTML = `
<img src="${imageSrc}" alt="Image" class="image-preview" onerror="this.src='data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAwIiBoZWlnaHQ9IjE1MCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSIjZGVlMmU2Ii8+PHRleHQgeD0iNTAlIiB5PSI1MCUiIGZvbnQtZmFtaWx5PSJBcmlhbCIgZm9udC1zaXplPSIxNCIgZmlsbD0iIzZjNzU3ZCIgdGV4dC1hbmNob3I9Im1pZGRsZSIgZHk9Ii4zZW0iPkZhaWxlZCB0byBsb2FkPC90ZXh0Pjwvc3ZnPg=='">
<img src="${imageSrc}" alt="Image" class="image-preview" title="${displayName}" onerror="this.src='data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMjAwIiBoZWlnaHQ9IjE1MCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48cmVjdCB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSIjZGVlMmU2Ii8+PHRleHQgeD0iNTAlIiB5PSI1MCUiIGZvbnQtZmFtaWx5PSJBcmlhbCIgZm9udC1zaXplPSIxNCIgZmlsbD0iIzZjNzU3ZCIgdGV4dC1hbmNob3I9Im1pZGRsZSIgZHk9Ii4zZW0iPkZhaWxlZCB0byBsb2FkPC90ZXh0Pjwvc3ZnPg=='">
<div class="image-info">
<div class="image-name">${displayName}</div>
<div class="image-controls">
<label>
<input type="checkbox" class="image-checkbox" ${isDisabled ? '' : 'checked'}>
@ -1136,7 +1134,6 @@ class TaskChallengeGame {
<span class="image-status ${isDisabled ? 'image-disabled' : 'image-enabled'}">
${isDisabled ? 'Disabled' : 'Enabled'}
</span>
${isCustom ? '<span class="custom-badge">Custom</span>' : ''}
</div>
</div>
`;