diff --git a/p/assets/js/downloads.js b/p/assets/js/downloads.js new file mode 100644 index 0000000..22a792c --- /dev/null +++ b/p/assets/js/downloads.js @@ -0,0 +1,73 @@ +document.addEventListener("DOMContentLoaded", () => { + const cards = Array.from(document.querySelectorAll(".download-card")); + + function toast(message) { + const t = document.createElement("div"); + t.className = "dl-toast"; + t.textContent = message; + Object.assign(t.style, { + position: "fixed", + right: "1rem", + bottom: "1rem", + background: "rgba(2,6,23,0.9)", + color: "#fff", + padding: "0.6rem 0.9rem", + borderRadius: "6px", + boxShadow: "0 6px 20px rgba(2,6,23,0.5)", + zIndex: 9999, + }); + document.body.appendChild(t); + setTimeout(() => t.remove(), 2200); + } + + cards.forEach((card) => { + const key = `fws:download:${card.dataset.key}`; + const btn = card.querySelector(".download-btn"); + const copyBtn = card.querySelector(".copy-btn"); + const editBtn = card.querySelector(".edit-btn"); + + function setLink(url) { + if (!url) url = "#"; + btn.href = url; + btn.dataset.link = url; + copyBtn.dataset.link = url; + localStorage.setItem(key, url); + } + + const stored = localStorage.getItem(key); + if (stored) { + setLink(stored); + } + + editBtn.addEventListener("click", () => { + const current = localStorage.getItem(key) || ""; + const value = window.prompt("Collez l'URL de téléchargement pour ce fichier:", current); + if (value === null) return; + const trimmed = value.trim(); + setLink(trimmed); + toast("Lien enregistré"); + }); + + copyBtn.addEventListener("click", async () => { + const link = copyBtn.dataset.link || btn.href || ""; + if (!link || link === "#") { + toast("Aucun lien défini — utilisez 'Modifier le lien'"); + return; + } + try { + await navigator.clipboard.writeText(link); + toast("Lien copié dans le presse-papiers"); + } catch (e) { + window.prompt("Copiez manuellement ce lien:", link); + } + }); + + btn.addEventListener("click", (ev) => { + const href = btn.getAttribute("href") || ""; + if (!href || href === "#") { + ev.preventDefault(); + toast("Aucun lien configuré — cliquez sur 'Modifier le lien' pour en ajouter un"); + } + }); + }); +}); diff --git a/p/assets/styles/main.css b/p/assets/styles/main.css index c2764e3..781e535 100644 --- a/p/assets/styles/main.css +++ b/p/assets/styles/main.css @@ -259,6 +259,43 @@ main[data-page-content] { line-height: 1.65; } +/* Styles page Téléchargements */ +.downloads { + margin-top: 1.5rem; +} + +.downloads-header h1 { margin: 0 0 0.35rem; } + +.download-grid { + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 1rem; + margin-top: 1rem; +} + +.download-card { + display: flex; + gap: 1rem; + align-items: stretch; + padding: 0.8rem; + border-radius: 0.75rem; + background: rgba(255,255,255,0.02); + border: 1px solid rgba(148,163,184,0.06); +} + +.download-media { width: 220px; flex: 0 0 220px; overflow: hidden; border-radius: 0.5rem; } +.download-media img { width: 100%; height: 100%; object-fit: cover; display: block; } + +.download-body { flex: 1 1 auto; display: flex; flex-direction: column; gap: 0.6rem; } + +.download-actions { display: flex; gap: 0.6rem; margin-top: auto; } + +@media (max-width: 880px) { + .download-grid { grid-template-columns: 1fr; } + .download-media { width: 140px; flex-basis: 140px; } +} + + .features .card { flex: 1 1 0; min-width: 0; diff --git a/p/dl/index.html b/p/dl/index.html index a2ad17c..24e9bc5 100644 --- a/p/dl/index.html +++ b/p/dl/index.html @@ -1,4 +1,92 @@ + + + + + Téléchargements — FWS Linux + + + +
+
+
+

Téléchargements

+

Choisissez votre image et collez le lien de téléchargement (ou utilisez ceux fournis). Les liens sont sauvegardés localement pour faciliter la gestion.

+
+ +
+
+
CLI
+
+

CLI (Minimal)

+

Image minimale sans environnement graphique, pour les installations serveur ou avancées.

+
+ Télécharger + + +
+
+
+ +
+
KDE Plasma
+
+

KDE Plasma

+

Environnement complet, riche en fonctionnalités et personnalisable.

+
+ Télécharger + + +
+
+
+ +
+
GNOME
+
+

GNOME

+

Expérience épurée et orientée productivité, simple à prendre en main.

+
+ Télécharger + + +
+
+
+ +
+
XFCE
+
+

XFCE

+

Environnement léger et stable, adapté aux machines modestes.

+
+ Télécharger + + +
+
+
+ +
+
Hyprland
+
+

Hyprland

+

Tiling Wayland moderne, pensé pour les workflows clavier avancés.

+
+ Télécharger + + +
+
+
+
+
+
+ + + + +