maneshtrader/mac/src/AppMobile/Help/help.html

197 lines
5.6 KiB
HTML

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Help & Quick Start</title>
<style>
:root {
color-scheme: light dark;
--bg: #0e1117;
--panel: #131925;
--text: #f3f6fb;
--muted: #a6b3c7;
--accent: #4db2ff;
--ok: #4bd37b;
--warn: #ff9f43;
--line: #2a3346;
}
@media (prefers-color-scheme: light) {
:root {
--bg: #f6f8fc;
--panel: #ffffff;
--text: #172033;
--muted: #5b6980;
--accent: #006fde;
--ok: #12834a;
--warn: #b85b00;
--line: #d7deea;
}
}
* {
box-sizing: border-box;
}
body {
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
color: var(--text);
background: radial-gradient(circle at top right, rgba(77, 178, 255, 0.18), transparent 40%), var(--bg);
}
main {
max-width: 980px;
margin: 0 auto;
padding: 28px 24px 56px;
}
h1 {
margin: 0 0 8px;
font-size: 2rem;
}
.subtitle {
margin: 0 0 20px;
color: var(--muted);
}
section {
border: 1px solid var(--line);
background: color-mix(in oklab, var(--panel) 92%, transparent);
border-radius: 14px;
padding: 16px 18px;
margin: 0 0 14px;
}
h2 {
margin: 0 0 10px;
font-size: 1.05rem;
}
h3 {
margin: 12px 0 8px;
font-size: 0.95rem;
}
p,
li {
line-height: 1.45;
}
p {
margin: 0 0 8px;
}
ul,
ol {
margin: 0;
padding-left: 20px;
}
li {
margin-bottom: 6px;
}
code {
background: color-mix(in oklab, var(--panel) 80%, var(--line));
border: 1px solid var(--line);
border-radius: 6px;
padding: 1px 6px;
font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
font-size: 0.9em;
}
.tag {
display: inline-block;
border: 1px solid var(--line);
border-radius: 999px;
padding: 2px 10px;
margin-right: 6px;
font-size: 0.85rem;
color: var(--muted);
}
.ok {
color: var(--ok);
font-weight: 600;
}
.warn {
color: var(--warn);
font-weight: 600;
}
</style>
</head>
<body>
<main>
<h1>Help & Quick Start</h1>
<p class="subtitle">A quick guide to reading signals, choosing settings, and troubleshooting.</p>
<section>
<h2>Start in 60 Seconds</h2>
<ol>
<li>Set a symbol like <code>AAPL</code> or <code>BTC-USD</code>.</li>
<li>Choose <code>Timeframe</code> (<code>1d</code> is a good default) and <code>Period</code> (<code>6mo</code>).</li>
<li>Keep <code>Ignore potentially live last bar</code> enabled.</li>
<li>Review trend status and chart markers.</li>
<li>Use Export to download CSV/PDF outputs.</li>
</ol>
</section>
<section>
<h2>Signal Rules</h2>
<p>
<span class="tag"><span class="ok">real_bull</span> close above previous high</span>
<span class="tag"><span class="warn">real_bear</span> close below previous low</span>
<span class="tag">fake close inside previous range</span>
</p>
<ul>
<li>Trend starts after <strong>2 consecutive real bars</strong> in the same direction.</li>
<li>Trend reverses only after <strong>2 consecutive opposite real bars</strong>.</li>
<li>Fake bars are noise and do not reverse trend.</li>
</ul>
</section>
<section>
<h2>Data Settings</h2>
<h3>Core fields</h3>
<ul>
<li><code>Symbol</code>: ticker or pair, e.g. <code>AAPL</code>, <code>MSFT</code>, <code>BTC-USD</code>.</li>
<li><code>Timeframe</code>: candle size. Start with <code>1d</code> for cleaner swings.</li>
<li><code>Period</code>: amount of history to load. Start with <code>6mo</code>.</li>
<li><code>Max bars</code>: limits loaded candles for speed and chart readability.</li>
</ul>
<h3>Optional filters</h3>
<ul>
<li><code>Use previous body range</code>: ignores wick-only breakouts.</li>
<li><code>Enable volume filter</code>: treats low-volume bars as fake.</li>
<li><code>Hide market-closed gaps</code>: recommended ON for stocks.</li>
<li><code>Enable auto-refresh</code>: useful for live monitoring only.</li>
</ul>
</section>
<section>
<h2>Chart Reading</h2>
<ul>
<li>Green triangle-up markers show <code>real_bull</code> bars.</li>
<li>Red triangle-down markers show <code>real_bear</code> bars.</li>
<li>Gray candles (if enabled) de-emphasize fake/noise bars.</li>
<li>Volume bars are color-coded by trend state.</li>
</ul>
</section>
<section>
<h2>Troubleshooting</h2>
<ul>
<li>If no data appears, verify ticker format (for example <code>BTC-USD</code>, not <code>BTCUSD</code>).</li>
<li>If results look noisy, switch to <code>1d</code> and reduce optional filters.</li>
<li>If trend seems delayed, remember trend transitions require two real bars.</li>
<li>This tool is analysis-only and does not place trades.</li>
</ul>
</section>
</main>
</body>
</html>