gru/aio_html_generator
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

commit

Browse Source
This commit is contained in:
Mateusz Gruszczyński
2026-02-26 14:13:04 +01:00
commit b6f96085a1
15 changed files with 730 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

92
templates/main.html Normal file
View File

@@ -0,0 +1,92 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>AIO Generator</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" />
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css" rel="stylesheet" />
<link href="https://cdn.jsdelivr.net/npm/prismjs@1.29.0/themes/prism.min.css" rel="stylesheet" />
<link href="{{ url_for('static', filename='css/app.css') }}" rel="stylesheet" />
<style>
.mode-wrap { display:flex; justify-content:center; gap:16px; flex-wrap:wrap; }
.mode-btn {
width: 240px;
height: 140px;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
border-radius: 16px;
}
.mode-btn i { margin-bottom: 10px; }
.mode-btn small { opacity: .85; }
pre.code-preview { font-size: 12px; line-height: 1.35; }
.result-card { border-radius: 16px; overflow: hidden; }
.preview-iframe { width: 100%; border: 0; background: #fff; }
</style>
</head>
<body class="bg-light">
<div class="container-fluid py-5">
<div class="row justify-content-center">
<div class="col-12 col-xl-10 col-xxl-9">
<!-- Header -->
<div class="text-center mb-5">
<h1 class="display-4 fw-bold mb-3">AIO Generator</h1>
<p class="lead text-muted">One HTML file from many</p>
</div>
<!-- Mode Buttons -->
<div class="mode-wrap mb-5">
<button class="btn btn-outline-primary btn-lg mode-btn active" data-mode="basic" type="button">
<i class="fa-solid fa-bolt fa-2x"></i>
<div class="fw-semibold">Basic</div>
<small class="text-muted">Fast</small>
</button>
<button class="btn btn-outline-success btn-lg mode-btn" data-mode="advanced" type="button">
<i class="fa-solid fa-gears fa-2x"></i>
<div class="fw-semibold">Advanced</div>
<small class="text-muted">CSS chains</small>
</button>
</div>
<!-- Drop Zone -->
<div id="drop-zone" class="drop-zone card border border-2 border-light rounded-4 p-5 mb-4 text-center">
<i class="fa-solid fa-cloud-arrow-up fa-4x text-muted mb-4"></i>
<h3 class="h4 fw-bold mb-3">Drop files here</h3>
<p class="text-muted mb-4">or click to browse</p>
<input type="file" id="file-input" multiple class="d-none" accept="*" />
<label for="file-input" class="btn btn-primary btn-lg px-5">
<i class="fa-solid fa-folder-open me-2"></i>Choose Files
</label>
</div>
<!-- Progress -->
<div id="progress" class="mb-4 d-none">
<div class="progress" style="height: 8px;">
<div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar"></div>
</div>
<small id="progress-text" class="text-muted d-block mt-2 text-center">Processing...</small>
</div>
<!-- Result -->
<div id="result"></div>
</div>
</div>
</div>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/prismjs@1.29.0/prism.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/prismjs@1.29.0/components/prism-markup.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/prettier@3.2.5/standalone.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/prettier@3.2.5/plugins/html.min.js"></script>
<script src="{{ url_for('static', filename='js/app.js') }}"></script>
</body>
</html>