nico/kobopatch-webui
1
0
Fork 0
Code Activity

Don't load custom fonts, fix scripts
All checks were successful
Build and test project / build-and-test (push) Successful in 1m47s

Browse Source
This commit is contained in:
Nico Verbruggen
2026-03-17 13:59:57 +01:00
parent 0223346075
commit 6d4bce8e05
7 changed files with 51 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
web/public/css/style.css
View File

@@ -30,7 +30,7 @@
}
body {
font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
background: var(--bg);
color: var(--text);
line-height: 1.6;

34
web/public/index.html
View File

@@ -4,10 +4,22 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>KoboPatch Web UI</title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap">
<link rel="stylesheet" href="css/style.css?ts=1773690621">
<!-- Inline critical styles so the hero + loader render before style.css arrives on slow connections -->
<style>
body { background: #f5f5f7; color: #111827; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif; margin: 0; }
main { max-width: 640px; margin: 0 auto; padding: 2rem 1.5rem 4rem; }
.hero { margin-bottom: 1.5rem; padding-bottom: 1rem; border-bottom: 1px solid #e5e7eb; }
h1 { font-size: 1.75rem; font-weight: 700; letter-spacing: -0.02em; margin: 0; }
.hero-accent { color: #2563eb; font-weight: 600; }
.beta-pill { font-size: 0.55rem; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; background: #991b1b; color: #fff; padding: 0.15rem 0.5rem; border-radius: 10px; vertical-align: middle; position: relative; top: -0.15rem; }
.subtitle { color: #6b7280; font-size: 0.95rem; margin-top: 0.25rem; }
.initial-loader { display: flex; align-items: center; justify-content: center; gap: 0.75rem; padding: 2rem 0; }
.initial-loader p { margin: 0; font-size: 0.93rem; color: #6b7280; }
.spinner { width: 22px; height: 22px; border: 2.5px solid #e5e7eb; border-top-color: #2563eb; border-radius: 50%; animation: spin 0.7s linear infinite; flex-shrink: 0; }
@keyframes spin { to { transform: rotate(360deg); } }
[hidden] { display: none !important; }
</style>
<link rel="stylesheet" href="css/style.css?ts=1773751630">
<script src="js/jszip.min.js"></script>
</head>
<body>
@@ -17,6 +29,12 @@
<p class="subtitle">Apply patches to your Kobo Libra Colour, Kobo Clara Colour and Kobo Clara BW.</p>
</header>
<!-- Shown until JS initialises -->
<div id="initial-loader" class="initial-loader">
<div class="spinner"></div>
<p>Loading&hellip;</p>
</div>
<!-- Step indicator -->
<nav id="step-nav" class="step-nav" hidden>
<ol>
@@ -246,9 +264,9 @@
</dialog>
<!-- wasm_exec.js loaded by patch-worker.js inside the Web Worker -->
<script src="js/kobo-device.js?ts=1773690621"></script>
<script src="js/kobopatch.js?ts=1773690621"></script>
<script src="js/patch-ui.js?ts=1773690621"></script>
<script src="js/app.js?ts=1773690621"></script>
<script src="js/kobo-device.js?ts=1773751630"></script>
<script src="js/kobopatch.js?ts=1773751630"></script>
<script src="js/patch-ui.js?ts=1773751630"></script>
<script src="js/app.js?ts=1773751630"></script>
</body>
</html>

3
web/public/js/app.js
View File

@@ -133,6 +133,9 @@
}
// --- Initial state ---
const loader = document.getElementById('initial-loader');
if (loader) loader.remove();
const hasFileSystemAccess = KoboDevice.isSupported();
if (hasFileSystemAccess) {
setNavStep(1);

2
web/public/js/patch-worker.js
View File

@@ -10,7 +10,7 @@ async function loadWasm() {
const go = new Go();
const result = await WebAssembly.instantiateStreaming(
fetch('../wasm/kobopatch.wasm?ts=1773690621'),
fetch('../wasm/kobopatch.wasm?ts=1773751630'),
go.importObject
);
go.run(result.instance);