48 lines
2.3 KiB
HTML
48 lines
2.3 KiB
HTML
<!doctype html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
|
||
<meta name="mobile-web-app-capable" content="yes">
|
||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
|
||
<title>MangaCircus</title>
|
||
<link rel="stylesheet" href="app.css">
|
||
<link rel="icon" href="icon.svg">
|
||
<link rel="manifest" href="manifest.webmanifest">
|
||
<meta name="theme-color" content="#0b0b0c">
|
||
<script src="common.js" defer></script>
|
||
<script src="reader.js" defer></script>
|
||
</head>
|
||
<body class="reader">
|
||
<div id="stage" tabindex="-1"><div id="canvas"><p class="loading">Loading…</p></div></div>
|
||
|
||
<div id="top" class="bar">
|
||
<a id="back" class="btn icon" href="./" title="Back to the manga" aria-label="Back">‹</a>
|
||
<div id="title" class="grow"></div>
|
||
<select id="chsel" title="Jump to a chapter" aria-label="Chapter"></select>
|
||
<button id="fs" class="btn icon" title="Fullscreen" aria-label="Fullscreen"><svg viewBox="0 0 24 24" width="18" height="18" fill="none" stroke="currentColor" stroke-width="2"><path d="M4 9V4h5M20 9V4h-5M4 15v5h5M20 15v5h-5"/></svg></button>
|
||
</div>
|
||
|
||
<div id="bot" class="bar">
|
||
<div class="row">
|
||
<input id="slider" type="range" min="1" max="1" value="1" aria-label="Page">
|
||
<span id="pageno"></span>
|
||
</div>
|
||
<div id="tools">
|
||
<a id="prevch" class="btn" title="Previous chapter">‹<span class="wide-only"> Prev</span></a>
|
||
<div id="modes" class="seg" role="group" aria-label="View mode">
|
||
<button data-mode="flow" title="Continuous flow: all pages below each other">Flow</button>
|
||
<button data-mode="page" title="One page at a time">Page</button>
|
||
<button data-mode="book" title="Two pages side by side, like an open book">Book</button>
|
||
</div>
|
||
<button id="shift" class="btn" title="Page pairs look wrong? Shift them by one page">⇄<span class="wide-only"> Shift</span></button>
|
||
<button id="zoom" class="btn" title="Page zoom (Ctrl + scroll or pinch). Click to fit the screen again.">100%</button>
|
||
<select id="ver" title="Version of this chapter" aria-label="Version"></select>
|
||
<a id="nextch" class="btn" title="Next chapter"><span class="wide-only">Next </span>›</a>
|
||
</div>
|
||
</div>
|
||
<div id="toast"></div>
|
||
</body>
|
||
</html>
|