Ajouter fichier demo et info M3U

src/css/modals.css

@@ -25,6 +25,13 @@
   }
   .modal-field input:focus { border-color: var(--accent); }
   .modal-field input::placeholder { color: var(--text-dim); opacity: 0.4; }
+  .modal-field-note {
+    margin-top: 6px; font-size: 11px; line-height: 1.45; opacity: 0.82;
+    color: var(--text-dim);
+  }
+  .modal-field-note.is-disabled {
+    color: #ffb0a5; opacity: 1;
+  }
   .modal-actions { display: flex; gap: 10px; margin-top: 20px; justify-content: flex-end; }
   .modal-btn-cancel {
     background: none; border: 1px solid var(--border-bright); color: var(--text-dim);

src/js/sources.js

@@ -36,7 +36,11 @@ function openPersonalEpgModal() {
     m3uInput.disabled = !ALLOW_PERSONAL_M3U;
   }
   if (m3uHint) {
-    m3uHint.style.display = ALLOW_PERSONAL_M3U ? '' : 'none';
+    m3uHint.textContent = ALLOW_PERSONAL_M3U
+      ? (m3uHint.dataset.enabledText ?? '')
+      : (m3uHint.dataset.disabledText ?? '');
+    m3uHint.classList.toggle('is-disabled', !ALLOW_PERSONAL_M3U);
+    m3uHint.style.display = '';
   }
   modal.classList.add('visible');
 }

src/tpl/modals.php

@@ -29,7 +29,7 @@
     <div class="modal-field">
       <label><?= htmlspecialchars($L["personal_epg_m3u_label"]) ?> <span style="opacity:.5;font-size:10px">(<?= htmlspecialchars($L["personal_epg_optional"]) ?>)</span></label>
       <input type="url" id="personalM3uInput" placeholder="http://mon-serveur/channels.m3u">
-      <div id="personalM3uHint" style="margin-top:6px;font-size:11px;opacity:.7;">This instance allows a personal M3U playlist.</div>
+      <div id="personalM3uHint" class="modal-field-note" data-enabled-text="<?= htmlspecialchars($L["personal_epg_m3u_enabled"]) ?>" data-disabled-text="<?= htmlspecialchars($L["personal_epg_m3u_disabled"]) ?>"></div>
     </div>
     <div class="modal-actions">
       <button class="modal-btn-cancel" onclick="closePersonalEpgModal()"><?= htmlspecialchars($L["cancel"]) ?></button>