Markdown / templates /index.html
GauthierDemonchy
Premier commit propre
898ed62
Raw
History Blame Contribute Delete
3.2 kB
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>MarkitDown</title>
<link rel="stylesheet" href="/static/style.css">
</head>
<body>
<div class="app-container">
<header class="app-header">
<h1 class="app-title">MarkitDown</h1>
<button id="toggle-history" class="btn btn-ghost" type="button">Historique</button>
</header>
<main class="app-main">
<!-- Zone d'upload -->
<section class="upload-section">
<div id="upload-zone" class="upload-zone">
<div class="upload-zone-content">
<p class="upload-icon">&#128206;</p>
<p class="upload-text">Glissez des fichiers ou un dossier ici</p>
<p class="upload-subtext">ou cliquez pour parcourir</p>
</div>
<input type="file" id="file-input" class="file-input" multiple webkitdirectory directory>
</div>
<div id="upload-status" class="upload-status"></div>
</section>
<!-- Filtres -->
<section id="filter-section" class="filter-section">
<div class="filter-header">
<h3 class="filter-title">Traiter uniquement les types de fichiers sélectionnés</h3>
<div class="filter-actions">
<button id="filter-select-all" class="btn-link" type="button">Tout cocher</button>
<button id="filter-deselect-all" class="btn-link" type="button">Tout décocher</button>
</div>
</div>
<div id="filter-checkboxes" class="filter-checkboxes">
<!-- Les cases à cocher seront injectées ici par JavaScript -->
</div>
</section>
<!-- Résultats multi-fichiers -->
<section id="result-section" class="result-section hidden">
<div class="result-header">
<span id="result-count" class="result-filename"></span>
<div class="result-actions-header">
<button id="btn-download-zip" class="btn btn-primary" type="button">&#128229; Télécharger en ZIP</button>
<button id="btn-copy-all" class="btn btn-secondary" type="button">&#128203; Tout copier</button>
</div>
</div>
<div id="result-list" class="result-list"></div>
</section>
</main>
<!-- Panneau historique -->
<aside id="history-panel" class="history-panel hidden">
<div class="history-header">
<h2>Historique</h2>
<button id="btn-clear-history" class="btn btn-danger-small" type="button">Effacer</button>
</div>
<div id="history-list" class="history-list">
<p class="history-empty">Aucune conversion pour le moment.</p>
</div>
</aside>
</div>
<script src="/static/script.js"></script>
</body>
</html>