visionmercer/isosilo
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fixed buttons

Browse source
This commit is contained in:
visionmercer 2026-04-15 12:22:43 +02:00
commit db499d84a9
4 changed files with 72 additions and 67 deletions
Download patch file Download diff file Expand all files Collapse all files

BIN
isosilo Executable file
View file

Binary file not shown.

12
static/css/style.css
View file

@ -123,15 +123,23 @@ main {
padding: 1rem; padding: 1rem;
border-bottom: 1px solid var(--border); border-bottom: 1px solid var(--border);
} }
.dl-btn {
/* Button style */
.btn {
border: 1px solid var(--accent); border: 1px solid var(--accent);
color: var(--accent); color: var(--accent);
padding: 0.2rem 0.5rem; padding: 0.2rem 0.5rem;
border-radius: 4px; border-radius: 4px;
font-size: 0.7rem; font-size: 0.7rem;
text-decoration: none; text-decoration: none;
background: transparent;
cursor: pointer;
display: inline-flex;
align-items: center;
transition: background 0.2s, color 0.2s;
} }
.dl-btn:hover {
.btn:hover {
background: var(--accent); background: var(--accent);
color: #fff; color: #fff;
} }

11
static/js/modal.js
View file

@ -10,8 +10,8 @@ document.addEventListener("DOMContentLoaded", function () {
// Function to open modal with ISO info // Function to open modal with ISO info
function openModal(title, description, imageSrc) { function openModal(title, description, imageSrc) {
document.getElementById("modalTitle").textContent = title; document.getElementById("modalTitle").textContent = title;
document.getElementById("modalDescription").textContent = document.getElementById("modalDescription").textContent = description ||
description || "No description available"; "No description available";
const modalImage = document.getElementById("modalImage"); const modalImage = document.getElementById("modalImage");
if (imageSrc) { if (imageSrc) {
@ -46,13 +46,15 @@ document.addEventListener("DOMContentLoaded", function () {
// Close modal when Escape key is pressed // Close modal when Escape key is pressed
document.addEventListener("keydown", function (e) { document.addEventListener("keydown", function (e) {
if (e.key === "Escape" && modal.style.display === "block") { // Change: Check for the "visible" class instead of style.display
if (e.key === "Escape" && modal.classList.contains("visible")) {
closeModal(); closeModal();
} }
}); });
// Add click handlers to all ISO info buttons // Add click handlers to all ISO info buttons
const infoButtons = document.querySelectorAll(".info-btn"); // Change: Use the new ".info-trigger" class you added to the HTML
const infoButtons = document.querySelectorAll(".info-trigger");
infoButtons.forEach((button) => { infoButtons.forEach((button) => {
button.addEventListener("click", function (e) { button.addEventListener("click", function (e) {
e.preventDefault(); e.preventDefault();
@ -64,7 +66,6 @@ document.addEventListener("DOMContentLoaded", function () {
openModal(isoName, description, imageSrc); openModal(isoName, description, imageSrc);
}); });
}); });
// Expose functions to global scope for potential future use // Expose functions to global scope for potential future use
window.openISOModal = openModal; window.openISOModal = openModal;
window.closeISOModal = closeModal; window.closeISOModal = closeModal;

16
templates/index.html
View file

@ -63,29 +63,25 @@
{{if .Description}}{{.Description}}{{else}}ISO Disk {{if .Description}}{{.Description}}{{else}}ISO Disk
Image{{end}} Image{{end}}
</p> </p>
<div <div style="margin-top: 1rem; display: flex; gap: 0.5rem">
style="margin-top: 1rem; display: flex; gap: 0.5rem"
>
<button <button
class="info-btn dl-btn" class="btn info-trigger"
data-iso-name="{{.Name}}" data-iso-name="{{.Name}}"
data-description="{{if .Description}}{{.Description}}{{else}}No description available{{end}}" data-description="{{if .Description}}{{.Description}}{{else}}No description available{{end}}"
{{if {{if .HasImage}}data-image-src="/raw/{{urlenc (trimExt .RelativePath)}}{{.ImageExt}}"{{end}}
.HasImage}}data-image-src="/raw/{{urlenc (trimExt .RelativePath)}}{{.ImageExt}}"
{{end}}
> >
Info Info
</button> </button>
<a <a
href="/browse/{{urlenc .RelativePath}}" href="/browse/{{urlenc .RelativePath}}"
class="dl-btn" class="btn"
>Browse</a >Browse</a
> >
<a <a
href="/raw/{{urlenc .RelativePath}}" href="/raw/{{urlenc .RelativePath}}"
class="dl-btn" class="btn"
download download
>ISO</a >Download ISO</a
> >
</div> </div>
</div> </div>