Something went wrong. Try again.
semantic bufo search find-bufo.com
bufo
Something went wrong. Try again.
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341// HTML template for stats page// format args: posts_checked (x2), matches_found (x2), posts_created (x2),// errors (x2), uptime_secs, uptime_str, jetstream_endpoint,// bufos_loaded (x2), followers_matched (x2),// non_followers_skipped (x2), top_section
pub const 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="color-scheme" content="dark light"> \\<title>find-bufo — stats</title> \\<meta name="description" content="Public bot activity and search traffic for find-bufo.com."> \\<link rel="icon" href="https://all-the.bufo.zone/bufo-offers-chart-with-upwards-trend.png"> \\<style> \\ :root {{ \\ --bg: #0b0d0c; \\ --panel: #111411; \\ --panel-2: #171b17; \\ --line: #262c27; \\ --line-2: #343c35; \\ --text: #d8ded9; \\ --bright: #f0f4f1; \\ --muted: #8b958d; \\ --dim: #626b64; \\ --faint: #414842; \\ --accent: #58b87a; \\ --danger: #dc7774; \\ --tip: rgba(17, 20, 17, 0.97); \\ color-scheme: dark; \\ }} \\ @media (prefers-color-scheme: light) {{ \\ :root {{ \\ --bg: #f2f3ef; \\ --panel: #fafbf8; \\ --panel-2: #eceee8; \\ --line: #d8dbd3; \\ --line-2: #c8ccc3; \\ --text: #2c322e; \\ --bright: #131614; \\ --muted: #5d665f; \\ --dim: #8a938c; \\ --faint: #b4bab2; \\ --accent: #24784d; \\ --danger: #b24743; \\ --tip: rgba(250, 251, 248, 0.97); \\ color-scheme: light; \\ }} \\ }} \\ * {{ box-sizing: border-box; }} \\ html {{ -webkit-text-size-adjust: 100%; }} \\ body {{ \\ margin: 0; \\ min-height: 100vh; \\ background: var(--bg); \\ color: var(--text); \\ font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; \\ font-size: 14px; \\ line-height: 1.6; \\ -webkit-tap-highlight-color: transparent; \\ }} \\ button, input {{ font: inherit; }} \\ button, a {{ touch-action: manipulation; }} \\ a {{ color: var(--accent); text-underline-offset: 0.18em; }} \\ a:focus-visible, button:focus-visible, input:focus-visible, [tabindex]:focus-visible {{ outline: 2px solid var(--accent); outline-offset: 2px; }} \\ ::selection {{ background: var(--accent); color: var(--bg); }} \\ .page {{ width: min(680px, calc(100% - 28px)); margin: 0 auto; padding: 28px 0 48px; }} \\ .page-head {{ margin-bottom: 22px; }} \\ .head-row {{ display: flex; align-items: baseline; justify-content: space-between; gap: 16px; }} \\ h1 {{ margin: 0; color: var(--muted); font-size: 1.08rem; font-weight: 400; }} \\ h1 a {{ color: var(--bright); font-weight: 700; text-decoration: none; }} \\ .head-links {{ display: flex; gap: 14px; font-size: 0.68rem; }} \\ .head-links a {{ color: var(--dim); text-decoration: none; }} \\ .head-links a:hover {{ color: var(--text); }} \\ .subtitle {{ margin: 3px 0 0; color: var(--dim); font-size: 0.78rem; }} \\ .panel {{ margin-bottom: 16px; padding: 16px; background: var(--panel); border: 1px solid var(--line); border-radius: 9px; }} \\ .section-head {{ display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 13px; }} \\ .section-head h2 {{ margin: 0; color: var(--muted); font-size: 0.75rem; font-weight: 400; }} \\ .section-head p {{ max-width: 360px; margin: 0; color: var(--dim); font-size: 0.66rem; text-align: right; }} \\ .stats-grid {{ display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }} \\ .stat-card {{ min-width: 0; padding: 10px 11px; background: var(--panel-2); border: 1px solid var(--line); border-radius: 7px; }} \\ .stat-label {{ color: var(--muted); font-size: 0.65rem; }} \\ .stat-value {{ margin-top: 2px; color: var(--bright); font-size: 1.15rem; line-height: 1.25; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }} \\ .stat-value.has-errors {{ color: var(--danger); }} \\ .health {{ display: flex; align-items: center; flex-wrap: wrap; gap: 6px 18px; margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--line); color: var(--dim); font-size: 0.65rem; }} \\ .health strong {{ color: var(--muted); font-weight: 400; }} \\ .health-dot {{ width: 6px; height: 6px; border-radius: 50%; background: var(--accent); display: inline-block; margin-right: 1px; }} \\ .behavior-numbers {{ display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }} \\ .behavior-stat {{ padding: 9px 10px; border: 1px solid var(--line); border-radius: 7px; }} \\ .behavior-stat .n {{ color: var(--bright); font-size: 1rem; font-variant-numeric: tabular-nums; }} \\ .behavior-stat .label {{ color: var(--dim); font-size: 0.64rem; }} \\ .behavior-copy {{ display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 12px; }} \\ .behavior-copy p {{ margin: 0; color: var(--muted); font-size: 0.68rem; }} \\ .behavior-copy strong {{ color: var(--text); font-weight: 600; }} \\ .strategy-rates {{ display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 10px; color: var(--dim); font-size: 0.64rem; }} \\ .strategy-rate span {{ color: var(--accent); }} \\ .excluded {{ margin: 11px 0 0; padding-top: 9px; border-top: 1px solid var(--line); color: var(--dim); font-size: 0.62rem; }} \\ .traffic-status {{ min-height: 1.4em; color: var(--dim); font-size: 0.68rem; }} \\ .traffic.loaded .traffic-status {{ display: none; }} \\ .traffic-hero {{ display: flex; align-items: baseline; flex-wrap: wrap; gap: 9px; margin: 0 0 13px; }} \\ .traffic-hero .n {{ color: var(--bright); font-size: 2rem; line-height: 1; font-variant-numeric: tabular-nums; }} \\ .traffic-hero .since {{ color: var(--dim); font-size: 0.65rem; }} \\ .traffic-toolbar {{ display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }} \\ .traffic-toolbar > span:first-child {{ color: var(--muted); font-size: 0.66rem; }} \\ .traffic-ranges {{ display: inline-flex; gap: 3px; }} \\ .traffic-ranges button {{ min-height: 32px; padding: 4px 9px; border: 1px solid var(--line); border-radius: 6px; background: transparent; color: var(--dim); cursor: pointer; font-size: 0.66rem; }} \\ .traffic-ranges button:hover {{ color: var(--text); border-color: var(--line-2); }} \\ .traffic-ranges button.active {{ color: var(--text); background: var(--panel-2); border-color: var(--line-2); }} \\ .traffic-card {{ padding: 14px 0 10px; border-bottom: 1px solid var(--line); }} \\ .traffic-card-head {{ display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: start; margin-bottom: 6px; }} \\ .traffic-card-head .titles {{ min-width: 0; min-height: 2.5em; }} \\ .traffic-card-head h3 {{ margin: 0; color: var(--muted); font-size: 0.67rem; font-weight: 400; }} \\ .traffic-card-head .sum {{ display: block; min-height: 1.4em; color: var(--dim); font-size: 0.62rem; font-variant-numeric: tabular-nums; }} \\ .traffic-chart {{ position: relative; }} \\ .traffic-chart svg {{ display: block; width: 100%; height: 170px; cursor: crosshair; touch-action: pan-y; }} \\ .traffic-grid line {{ stroke: var(--line); stroke-width: 1; vector-effect: non-scaling-stroke; }} \\ .traffic-grid text, .traffic-axis text {{ fill: var(--dim); font-size: 10px; font-family: inherit; font-variant-numeric: tabular-nums; }} \\ .traffic-line {{ fill: none; stroke: var(--accent); stroke-width: 1.75; stroke-linejoin: round; stroke-linecap: round; vector-effect: non-scaling-stroke; }} \\ .traffic-area {{ fill: var(--accent); fill-opacity: 0.08; }} \\ .traffic-end, .traffic-dot {{ fill: var(--accent); stroke: var(--panel); stroke-width: 2; vector-effect: non-scaling-stroke; }} \\ .traffic-end-label {{ fill: var(--bright); font-size: 11px; font-family: inherit; paint-order: stroke; stroke: var(--panel); stroke-width: 3px; }} \\ .traffic-guide {{ stroke: var(--line-2); stroke-width: 1; vector-effect: non-scaling-stroke; }} \\ .traffic-empty {{ fill: var(--dim); font-size: 12px; font-family: inherit; }} \\ .traffic-tip {{ display: none; position: fixed; z-index: 60; pointer-events: none; padding: 6px 9px; background: var(--tip); border: 1px solid var(--line-2); border-radius: 6px; color: var(--text); font-size: 0.66rem; line-height: 1.5; white-space: nowrap; }} \\ .traffic-tip-when {{ color: var(--dim); font-size: 0.6rem; }} \\ .traffic-tip-val {{ color: var(--muted); }} \\ .traffic-tip-val b {{ color: var(--bright); font-weight: 600; }} \\ .traffic-clients {{ list-style: none; max-height: 220px; overflow-y: auto; margin: 3px 0 0; padding: 0 6px 0 0; scrollbar-color: var(--line-2) transparent; }} \\ .traffic-clients li {{ display: grid; grid-template-columns: minmax(0, 11em) minmax(0, 1fr) auto; gap: 9px; align-items: center; padding: 4px 0; }} \\ .traffic-clients .name {{ color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.66rem; }} \\ .traffic-clients .name a {{ color: inherit; text-decoration: none; }} \\ .traffic-clients .bar {{ height: 7px; overflow: hidden; background: var(--panel-2); border-radius: 99px; }} \\ .traffic-clients .bar span {{ display: block; height: 100%; background: var(--accent); border-radius: inherit; }} \\ .traffic-clients .n {{ color: var(--dim); font-size: 0.62rem; font-variant-numeric: tabular-nums; white-space: nowrap; }} \\ .traffic-clients-note {{ margin: 8px 0 1px; color: var(--dim); font-size: 0.6rem; }} \\ .traffic-clients-note code {{ color: var(--muted); }} \\ .traffic-table {{ margin-top: 6px; color: var(--muted); font-size: 0.64rem; }} \\ .traffic-table summary {{ color: var(--dim); cursor: pointer; }} \\ .traffic-table-wrap {{ max-height: 220px; overflow-y: auto; margin-top: 6px; border: 1px solid var(--line); border-radius: 6px; }} \\ .traffic-table table {{ width: 100%; border-collapse: collapse; }} \\ .traffic-table th {{ position: sticky; top: 0; padding: 5px 8px; background: var(--panel-2); color: var(--dim); font-size: 0.6rem; font-weight: 400; text-align: left; }} \\ .traffic-table td {{ padding: 4px 8px; border-top: 1px solid var(--line); font-variant-numeric: tabular-nums; }} \\ .traffic-table td + td, .traffic-table th + th {{ text-align: right; }} \\ .traffic-growth {{ margin-top: 10px; }} \\ .traffic-growth > summary {{ padding: 6px 0; color: var(--dim); cursor: pointer; font-size: 0.66rem; }} \\ .lookup {{ margin-bottom: 14px; }} \\ .lookup-label {{ margin-bottom: 6px; color: var(--dim); font-size: 0.63rem; }} \\ .lookup-form {{ display: flex; gap: 7px; }} \\ .lookup-input-wrap {{ position: relative; flex: 1; min-width: 0; }} \\ .lookup-form input {{ width: 100%; min-height: 38px; padding: 7px 10px; background: var(--panel-2); border: 1px solid var(--line-2); border-radius: 6px; color: var(--bright); }} \\ .lookup-form input::placeholder {{ color: var(--dim); }} \\ #lookup-btn {{ min-height: 38px; padding: 7px 13px; border: 1px solid var(--accent); border-radius: 6px; background: var(--accent); color: var(--bg); cursor: pointer; font-weight: 700; }} \\ #lookup-btn:disabled {{ opacity: 0.5; cursor: default; }} \\ .lookup-status {{ display: none; margin-top: 8px; color: var(--muted); font-size: 0.65rem; }} \\ .bufo-grid {{ display: flex; flex-wrap: wrap; gap: 7px; max-height: 680px; overflow-y: auto; align-items: flex-start; padding-right: 5px; scrollbar-color: var(--line-2) transparent; }} \\ .bufo-card {{ position: relative; flex: 0 0 auto; overflow: hidden; background: var(--panel-2); border: 1px solid var(--line); border-radius: 7px; cursor: pointer; transition: border-color 0.15s, transform 0.15s; }} \\ .bufo-card:hover {{ border-color: var(--accent); transform: translateY(-2px); z-index: 2; }} \\ .bufo-card img {{ display: block; width: 100%; height: 100%; object-fit: cover; }} \\ .bufo-count {{ position: absolute; right: 4px; bottom: 4px; padding: 2px 5px; background: rgba(0, 0, 0, 0.72); border-radius: 4px; color: #8ee2a9; font-size: 0.62rem; font-variant-numeric: tabular-nums; }} \\ .no-bufos {{ color: var(--dim); text-align: center; }} \\ .contribute {{ display: flex; align-items: baseline; justify-content: space-between; gap: 14px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--line); color: var(--dim); font-size: 0.64rem; }} \\ .footer {{ display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 8px 12px; padding-top: 12px; color: var(--faint); font-size: 0.65rem; }} \\ .footer a {{ color: var(--dim); text-decoration: none; }} \\ .viewer {{ position: fixed; inset: 0; z-index: 100; display: flex; align-items: flex-end; justify-content: center; padding: 0; background: rgba(5, 7, 5, 0.78); }} \\ .viewer[hidden] {{ display: none; }} \\ body.viewer-open {{ overflow: hidden; }} \\ .pv-sheet {{ width: 100%; max-width: 640px; max-height: min(88vh, 900px); display: flex; flex-direction: column; background: var(--panel); border: 1px solid var(--line-2); border-bottom: 0; border-radius: 12px 12px 0 0; }} \\ .pv-head {{ display: flex; align-items: center; gap: 13px; padding: 15px 17px; border-bottom: 1px solid var(--line); }} \\ .pv-head img {{ width: 44px; height: 44px; object-fit: contain; background: var(--panel-2); border-radius: 7px; }} \\ .pv-head img[hidden] {{ display: none; }} \\ .pv-head > div {{ flex: 1; min-width: 0; }} \\ .pv-title {{ margin: 0; overflow: hidden; color: var(--bright); font-size: 0.8rem; text-overflow: ellipsis; white-space: nowrap; }} \\ .pv-sub {{ margin-top: 3px; color: var(--dim); font-size: 0.64rem; }} \\ .pv-close {{ flex-shrink: 0; width: 34px; height: 34px; background: none; border: 1px solid var(--line-2); border-radius: 7px; color: var(--muted); cursor: pointer; font-size: 18px; line-height: 1; }} \\ .pv-clients {{ display: flex; align-items: center; flex-wrap: wrap; gap: 6px; padding: 8px 17px; border-bottom: 1px solid var(--line); font-size: 0.64rem; }} \\ .pv-clients-label {{ margin-right: 3px; color: var(--dim); }} \\ .pv-client {{ display: inline-flex; align-items: center; gap: 5px; min-height: 29px; padding: 3px 8px; background: none; border: 1px solid var(--line-2); border-radius: 99px; color: var(--muted); cursor: pointer; font-size: 0.63rem; }} \\ .pv-client img {{ width: 14px; height: 14px; border-radius: 3px; }} \\ .pv-client[aria-pressed="true"] {{ background: var(--accent); border-color: var(--accent); color: var(--bg); }} \\ .pv-list {{ flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 6px 17px 17px; }} \\ .pv-post {{ padding: 13px 0; border-bottom: 1px solid var(--line); }} \\ .pv-post:last-of-type {{ border-bottom: 0; }} \\ .pv-post-head {{ display: flex; align-items: baseline; justify-content: space-between; gap: 12px; font-size: 0.64rem; }} \\ .pv-when {{ color: var(--dim); }} \\ .pv-bufo {{ margin-left: 8px; color: var(--accent); }} \\ .pv-open {{ color: var(--accent); text-decoration: none; white-space: nowrap; }} \\ .pv-quote {{ min-height: 40px; margin-top: 9px; padding: 10px 12px; background: var(--panel-2); border-left: 2px solid var(--line-2); border-radius: 0 7px 7px 0; font-size: 0.7rem; transition: opacity 0.25s; }} \\ .pv-quote-pending {{ opacity: 0.5; }} \\ .pv-who {{ display: flex; align-items: baseline; flex-wrap: wrap; gap: 7px; margin-bottom: 3px; font-size: 0.67rem; }} \\ .pv-name {{ color: var(--bright); font-weight: 700; }} \\ .pv-handle {{ color: var(--dim); text-decoration: none; }} \\ .pv-text {{ margin: 0; color: var(--text); line-height: 1.45; overflow-wrap: anywhere; white-space: pre-wrap; }} \\ .pv-muted, .pv-more, .pv-empty {{ color: var(--dim); font-size: 0.65rem; }} \\ .pv-more {{ min-height: 1em; padding: 11px 0 4px; text-align: center; }} \\ .pv-empty {{ padding: 28px 0; text-align: center; }} \\ @media (min-width: 720px) {{ \\ .viewer {{ align-items: center; padding: 24px; }} \\ .pv-sheet {{ max-height: min(84vh, 820px); border-bottom: 1px solid var(--line-2); border-radius: 12px; }} \\ }} \\ @media (max-width: 600px) {{ \\ .page {{ width: min(100% - 20px, 680px); padding-top: 20px; }} \\ .head-row {{ display: block; }} \\ .head-links {{ margin-top: 5px; }} \\ .section-head {{ display: block; }} \\ .section-head p {{ margin-top: 4px; text-align: left; }} \\ .stats-grid {{ grid-template-columns: 1fr 1fr; }} \\ .behavior-copy {{ grid-template-columns: 1fr; gap: 8px; }} \\ .traffic-toolbar {{ align-items: flex-start; flex-direction: column; }} \\ .traffic-clients li {{ grid-template-columns: minmax(0, 8em) minmax(35px, 1fr) auto; gap: 6px; }} \\ .bufo-grid {{ max-height: 560px; }} \\ .contribute {{ align-items: flex-start; flex-direction: column; gap: 5px; }} \\ }} \\ @media (prefers-reduced-motion: reduce) {{ * {{ transition: none !important; }} }} \\</style> \\</head> \\<body> \\<main class="page"> \\ <header class="page-head"> \\ <div class="head-row"> \\ <h1><a href="https://find-bufo.com">find-bufo</a> stats</h1> \\ <nav class="head-links" aria-label="related links"><a href="https://pdsls.dev/at/find-bufo.com">profile</a><a href="https://tangled.org/zzstoatzz.io/find-bufo">source</a></nav> \\ </div> \\ <p class="subtitle">bot health, matching activity, and search traffic</p> \\ </header> \\ <section class="panel" aria-labelledby="overview-title"> \\ <div class="section-head"><h2 id="overview-title">overview</h2><p>cumulative unless noted</p></div> \\ <div class="stats-grid"> \\ <div class="stat-card"><div class="stat-label">posts checked</div><div class="stat-value" data-num="{}">{}</div></div> \\ <div class="stat-card"><div class="stat-label">phrase matches</div><div class="stat-value" data-num="{}">{}</div></div> \\ <div class="stat-card"><div class="stat-label">responses sent</div><div class="stat-value" data-num="{}">{}</div></div> \\ <div class="stat-card"><div class="stat-label">errors</div><div class="stat-value" id="error-count" data-num="{}">{}</div></div> \\ </div> \\ <div class="health" aria-label="bot health"> \\ <span class="health-dot" aria-hidden="true"></span><span>online</span> \\ <span>uptime <strong id="uptime" data-seconds="{}">{s}</strong></span> \\ <span>relay <strong>{s}</strong></span> \\ <span>phrase triggers <strong data-num="{}">{}</strong></span> \\ </div> \\ </section> \\ <section class="panel" aria-labelledby="behavior-title"> \\ <div class="section-head"><h2 id="behavior-title">bot behavior</h2><p>why matches and responses are different totals</p></div> \\ <div class="behavior-numbers"> \\ <div class="behavior-stat"><div class="n" data-num="{}">{}</div><div class="label">phrase matches from followers</div></div> \\ <div class="behavior-stat"><div class="n" data-num="{}">{}</div><div class="label">non-follower phrase matches skipped</div></div> \\ </div> \\ <div class="strategy-rates" id="strategy-rates"></div> \\ <div class="behavior-copy"> \\ <p><strong>Phrase matching is opt-in.</strong> The bot quote-posts a phrase match only when the author follows <a href="https://pdsls.dev/at/find-bufo.com">@find-bufo.com</a>.</p> \\ <p><strong>Image tags are direct requests.</strong> A leading mention with an attached image—or a quoted post containing one—gets a visual-match reply without the follow requirement.</p> \\ </div> \\ <p class="excluded">Posts with NSFW labels or configured keywords are excluded before matching.</p> \\ </section> \\ <section class="traffic panel" id="traffic" aria-labelledby="traffic-title"> \\ <div class="section-head"><h2 id="traffic-title">find-bufo.com traffic</h2><p>search API requests, separate from bot activity</p></div> \\ <div class="traffic-status">loading traffic records…</div> \\ <div class="traffic-hero"><span class="n" id="traffic-total">—</span><span class="since" id="traffic-since"></span></div> \\ <div class="traffic-toolbar"> \\ <span>recent volume and clients</span> \\ <span class="traffic-ranges" role="group" aria-label="traffic window"> \\ <button type="button" data-range="24h">24h</button><button type="button" data-range="7d" class="active">7d</button><button type="button" data-range="30d">30d</button><button type="button" data-range="all">all</button> \\ </span> \\ </div> \\ <div class="traffic-card"> \\ <div class="traffic-card-head"><div class="titles"><h3 id="traffic-rate-title">requests per hour · last 7d</h3><span class="sum" id="traffic-rate-sum"></span></div></div> \\ <div class="traffic-chart" id="traffic-rate"><svg viewBox="0 0 600 170" role="img" aria-label="requests to find-bufo.com per time bucket"></svg><div class="traffic-tip"></div></div> \\ <details class="traffic-table" id="traffic-rate-table"><summary>table</summary><div class="traffic-table-wrap"><table></table></div></details> \\ </div> \\ <div class="traffic-card"> \\ <div class="traffic-card-head"><div class="titles"><h3 id="traffic-clients-title">requests by client · last 7d</h3><span class="sum" id="traffic-clients-sum"></span></div></div> \\ <ol class="traffic-clients" id="traffic-clients"></ol> \\ <p class="traffic-clients-note">Apps identify themselves with <code>X-Client</code>; browsers use origin or referrer; the rest is <em>unknown</em>.</p> \\ </div> \\ <details class="traffic-growth"> \\ <summary>all-time growth</summary> \\ <div class="traffic-card"> \\ <div class="traffic-card-head"><div class="titles"><h3>cumulative requests</h3><span class="sum"></span></div></div> \\ <div class="traffic-chart" id="traffic-cum"><svg viewBox="0 0 600 170" role="img" aria-label="cumulative requests to find-bufo.com over time"></svg><div class="traffic-tip"></div></div> \\ <details class="traffic-table" id="traffic-cum-table"><summary>table</summary><div class="traffic-table-wrap"><table></table></div></details> \\ </div> \\ </details> \\ </section> \\ <script src="/traffic.js" defer></script> \\ <section class="panel" aria-labelledby="matches-title"> \\ <div class="section-head"><h2 id="matches-title">matched Bufos</h2><p>sized by match count; open one for its phrase quote-post history</p></div> \\ <div class="lookup"> \\ <div class="lookup-label">Find phrase quote-posts by author</div> \\ <div class="lookup-form"><div class="lookup-input-wrap"><input type="text" id="lookup-input" aria-label="AT Protocol handle" placeholder="handle, e.g. zzstoatzz.io" autocomplete="off"></div><button id="lookup-btn" type="button">search</button></div> \\ <div id="lookup-status" class="lookup-status" aria-live="polite"></div> \\ </div> \\ <div class="bufo-grid">{s}</div> \\ <div class="contribute"><span>Have a Bufo that should be included?</span><a href="https://tangled.org/zzstoatzz.io/find-bufo/blob/main/CONTRIBUTING.md">contribute one →</a></div> \\ </section> \\ <footer class="footer"><a href="https://find-bufo.com">find-bufo.com</a><span>·</span><a href="https://pdsls.dev/at/find-bufo.com">@find-bufo.com</a><span>·</span><a href="https://tangled.org/zzstoatzz.io/find-bufo">source</a></footer> \\</main> \\<div id="viewer" class="viewer" hidden> \\ <div class="pv-sheet" role="dialog" aria-modal="true" aria-labelledby="viewer-title"> \\ <div class="pv-head"><img id="viewer-thumb" alt="" hidden><div><h3 class="pv-title" id="viewer-title">posts</h3><div class="pv-sub" id="viewer-sub"></div></div><button class="pv-close" type="button" aria-label="close">×</button></div> \\ <div class="pv-clients" id="viewer-clients"></div> \\ <div class="pv-list" id="viewer-list"><div class="pv-more" id="viewer-more"></div></div> \\ </div> \\</div> \\<script type="module" src="/posts.js"></script> \\<script> \\(function() {{ \\ var values = {{}}; \\ document.querySelectorAll('[data-num]').forEach(function(element) {{ \\ var value = Number.parseInt(element.dataset.num, 10); \\ var label = element.previousElementSibling && element.previousElementSibling.textContent; \\ if (label) values[label.trim()] = value; \\ element.textContent = value.toLocaleString(); \\ }}); \\ var errors = document.getElementById('error-count'); \\ if (Number.parseInt(errors.dataset.num, 10) > 0) errors.classList.add('has-errors'); \\ var checked = values['posts checked'] || 0; \\ var matches = values['phrase matches'] || 0; \\ var followers = values['phrase matches from followers'] || 0; \\ function percent(a, b) {{ return b > 0 ? (100 * a / b).toFixed(3) + '%' : '—'; }} \\ document.getElementById('strategy-rates').innerHTML = \\ '<span class="strategy-rate">match rate <span>' + percent(matches, checked) + '</span></span>' + \\ '<span class="strategy-rate">follower share <span>' + percent(followers, matches) + '</span></span>'; \\ var uptime = document.getElementById('uptime'); \\ var seconds = Number.parseInt(uptime.dataset.seconds, 10); \\ function formatDuration(value) {{ \\ var days = Math.floor(value / 86400); \\ var hours = Math.floor((value % 86400) / 3600); \\ var minutes = Math.floor((value % 3600) / 60); \\ var secs = value % 60; \\ if (days > 0) return days + 'd ' + hours + 'h ' + minutes + 'm'; \\ if (hours > 0) return hours + 'h ' + minutes + 'm ' + secs + 's'; \\ if (minutes > 0) return minutes + 'm ' + secs + 's'; \\ return secs + 's'; \\ }} \\ window.setInterval(function() {{ seconds += 1; uptime.textContent = formatDuration(seconds); }}, 1000); \\}})(); \\</script> \\</body> \\</html>;