support.html

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
<title>Support &amp; FAQ &mdash; Qrapp</title>
<link rel="icon" href="icons/favicon.svg" type="image/svg+xml">
<link rel="stylesheet" href="css/style.css">
<style>
html,body{height:auto;min-height:100%;overflow-y:auto}
.doc-layout{max-width:640px;margin:0 auto;padding:calc(var(--safe-top) + 20px) 20px calc(var(--safe-bottom) + 32px);color:var(--text)}
.doc-nav{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;padding-bottom:12px;border-bottom:1px solid var(--border)}
.nav-back{color:var(--accent);text-decoration:none;font-size:14px;font-weight:500}
.nav-brand{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--text-dim)}
h1{font-size:26px;margin:0 0 16px}
h2{font-size:17px;margin:20px 0 6px;color:var(--text)}
p,li{font-size:14.5px;line-height:1.55;color:var(--text-dim);margin:0 0 10px}
ol,ul{padding-left:18px;margin:0 0 12px}
code{font-size:13px;padding:2px 5px;background:var(--surface-2);border-radius:4px;color:var(--text)}
.doc-footer{margin-top:36px;padding-top:16px;border-top:1px solid var(--border);display:flex;justify-content:space-between;font-size:13px;color:var(--text-dim)}
.doc-footer a{color:var(--accent);text-decoration:none}
</style>
</head>
<body>
<div class="doc-layout">
  <nav class="doc-nav">
    <a href="index.html" class="nav-back">&larr; Back to Scanner</a>
    <span class="nav-brand"><img src="icons/favicon.svg" alt="" width="20" height="20"> Qrapp</span>
  </nav>
  <main>
    <h1>Support &amp; FAQ</h1>
    <h2>Adding to Home Screen</h2>
    <p><strong>iOS (Safari):</strong></p>
    <ol>
      <li>Tap the <strong>Share</strong> button (square with arrow pointing up).</li>
      <li>Scroll down and tap <strong>Add to Home Screen</strong>.</li>
      <li>Tap <strong>Add</strong> in the top-right corner.</li>
    </ol>
    <p><strong>Android (Chrome):</strong></p>
    <ol>
      <li>Tap the browser menu (three vertical dots) or the install banner.</li>
      <li>Tap <strong>Add to Home screen</strong> or <strong>Install app</strong>.</li>
    </ol>
    <h2>Camera Access Reset</h2>
    <p>If camera permission was denied:</p>
    <ul>
      <li><strong>iOS Safari:</strong> Tap <code>aA</code> in the address bar &rarr; <strong>Website Settings</strong> &rarr; set <strong>Camera</strong> to <strong>Allow</strong>, then reload.</li>
      <li><strong>Android Chrome:</strong> Tap the lock or tune icon beside the URL &rarr; <strong>Permissions</strong> &rarr; enable <strong>Camera</strong>, then reload.</li>
    </ul>
    <h2>Contact</h2>
    <p>For help, bug reports, or feedback, email <a href="mailto:support@qrapp.app">support@qrapp.app</a> or open an issue on <a href="https://github.com/refnull/qrapp" target="_blank" rel="noopener">GitHub</a>.</p>
  </main>
  <footer class="doc-footer">
    <span>&copy; 2026 Qrapp. MIT License.</span>
    <span><a href="privacy.html">Privacy</a> &bull; <a href="terms.html">Terms</a></span>
  </footer>
</div>
</body>
</html>