Skip to content

Commit 38969a6

Browse files
omarakhmedov-webomarakhmedov-web
authored
Update index.html
1 parent b959ccb commit 38969a6

1 file changed

Lines changed: 0 additions & 370 deletions

File tree

‎index.html‎

Lines changed: 0 additions & 370 deletions
Original file line numberDiff line numberDiff line change
@@ -1,371 +1 @@
1-
<!DOCTYPE html>
21

3-
<html data-lang="en" lang="en">
4-
<head>
5-
<meta charset="utf-8"/>
6-
<meta content="width=device-width, initial-scale=1" name="viewport"/>
7-
<title>Metridex — On‑chain risk metrics for DeFi &amp; Telegram</title>
8-
<meta content="Metridex QuickScan — on‑chain risk metrics for DeFi &amp; Telegram. Scan tokens in seconds, get deep checks on demand." name="description"/>
9-
<link href="https://fonts.googleapis.com" rel="preconnect"/>
10-
<link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/>
11-
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;800;900&amp;display=swap" rel="stylesheet"/>
12-
<link href="./styles.css" rel="stylesheet"/>
13-
<link href="./favicon.svg" rel="icon" type="image/svg+xml"/>
14-
<link href="./favicon-512.png" rel="icon" sizes="512x512"/>
15-
<link href="./apple-touch-icon.png" rel="apple-touch-icon"/>
16-
<meta content="#070709" media="(prefers-color-scheme: dark)" name="theme-color"/>
17-
<meta content="#faf8f2" media="(prefers-color-scheme: light)" name="theme-color"/>
18-
<meta content="Metridex — QuickScan for on‑chain risk" property="og:title"/>
19-
<meta content="Scan tokens in seconds. Deep checks on demand." property="og:description"/>
20-
<meta content="https://metridex.com/og-image.png" property="og:image"/>
21-
<meta content="https://metridex.com/" property="og:url"/>
22-
<meta content="website" property="og:type"/>
23-
<meta content="summary_large_image" name="twitter:card"/>
24-
<meta content="Metridex — QuickScan for on‑chain risk" name="twitter:title"/>
25-
<meta content="Scan tokens in seconds. Deep checks on demand." name="twitter:description"/>
26-
<meta content="https://metridex.com/og-image.png" name="twitter:image"/>
27-
<script data-domain="metridex.com" defer="" src="https://plausible.io/js/script.js"></script>
28-
<link href="./onepager_en_print.html" hreflang="en" rel="alternate"/><link href="./onepager_ru_print.html" hreflang="ru" rel="alternate"/><style>
29-
.cta-row .cta { display:inline-flex; align-items:center; gap:6px; }
30-
.cta-row .badge { font-size:11px; padding:2px 6px; border:1px solid #e5c97a; border-radius:8px; }
31-
.cta-row .size { font-size:11px; opacity:0.85; }
32-
.cta-note { margin-top:8px; font-size:12px; opacity:0.9; }
33-
34-
35-
/* Button icon */
36-
.cta-row .cta .icon { display:inline-flex; }
37-
.cta-row .cta .icon svg { margin-right:6px; }
38-
39-
/* Tooltip */
40-
.info-tip { margin-left:8px; font-size:12px; opacity:0.85; cursor:help; position:relative; }
41-
.info-tip::after {
42-
content: attr(data-tip);
43-
position:absolute; left:0; top:120%;
44-
max-width: 440px; min-width: 280px;
45-
padding:10px 12px;
46-
background:#111; color:#eee; border:1px solid #333; border-radius:10px;
47-
box-shadow: 0 8px 20px rgba(0,0,0,.35);
48-
white-space: normal; line-height: 1.45; font-size: 12.5px;
49-
overflow-wrap: anywhere; hyphens: auto;
50-
opacity:0; transform:translateY(4px); pointer-events:none;
51-
transition: all .12s ease;
52-
z-index:10;
53-
}
54-
.info-tip:hover::after { opacity:1; transform:translateY(0); }
55-
56-
/* Hide tooltip helper on small screens */
57-
@media (max-width: 640px) {
58-
.info-tip { display:none; }
59-
}
60-
61-
62-
/* CTA sizing */
63-
.cta-row { display:flex; flex-wrap:wrap; gap:10px 12px; }
64-
.cta-row .cta {
65-
display:inline-flex; align-items:center; justify-content:center;
66-
padding:10px 14px; min-width: 180px; height: 42px;
67-
font-size:14px; font-weight:600; border-radius:10px;
68-
}
69-
.cta-row .cta.primary { min-width: 210px; height: 46px; font-size:15px; padding:12px 18px; }
70-
.cta-row .badge { border:1px solid #e5c97a; border-radius:8px; padding:2px 6px; }
71-
@media (max-width: 480px){
72-
.cta-row .cta { min-width: 46%; height: 40px; font-size:13px; }
73-
.cta-row .cta.primary { min-width: 100%; height: 44px; }
74-
}
75-
76-
77-
/* Compact CTA sizing */
78-
.cta-row .cta {
79-
height: 40px;
80-
padding: 9px 14px;
81-
font-size: 13.5px;
82-
transition: transform .06s ease, box-shadow .12s ease, border-color .12s ease;
83-
}
84-
.cta-row .cta.primary {
85-
height: 44px;
86-
padding: 11px 18px;
87-
font-size: 14.5px;
88-
}
89-
90-
/* Subtle hover */
91-
.cta-row .cta:hover {
92-
transform: translateY(-1px);
93-
box-shadow: 0 6px 14px rgba(0,0,0,.25);
94-
border-color: #f1d58a;
95-
}
96-
97-
/* Mobile: primary full width */
98-
@media (max-width: 480px){
99-
.cta-row .cta.primary { width: 100%; min-width: 100%; }
100-
}
101-
102-
103-
.hero-tip { margin-top: 8px; font-size: 12.5px; opacity: 0.92; }
104-
</style><script>
105-
(function(){
106-
function formatSize(bytes){
107-
if(!bytes) return '';
108-
var units=['B','KB','MB','GB']; var i=0;
109-
while(bytes>=1024 && i<units.length-1){bytes/=1024;i++}
110-
return bytes.toFixed(i?1:0)+' '+units[i];
111-
}
112-
document.querySelectorAll('.cta-row .size[data-href]').forEach(function(el){
113-
var url = el.getAttribute('data-href');
114-
fetch(url, {method:'HEAD'}).then(function(r){
115-
var len = r.headers.get('content-length');
116-
if(len){ el.textContent = '· ' + formatSize(parseInt(len,10)); }
117-
else { el.textContent = ''; }
118-
}).catch(function(){ el.textContent = ''; });
119-
});
120-
})();
121-
</script></head>
122-
<body>
123-
<header class="nav" id="siteNav">
124-
<div class="container nav-inner nav-container-wide">
125-
<div class="brand">
126-
<span class="logo-mark">M</span><span class="logo-text">Metridex</span>
127-
</div>
128-
<nav aria-label="Primary" class="nav-links">
129-
<a data-i18n="nav.about" href="#about">About</a>
130-
<a data-i18n="nav.features" href="#features">Features</a>
131-
<a data-i18n="nav.screens" href="#screens">Screens</a>
132-
<a data-i18n="nav.partners" href="#partners">Partners</a>
133-
<a data-i18n="nav.how" href="#how-it-works">How it works</a>
134-
<a data-i18n="nav.security" href="#security">Security</a>
135-
<a data-i18n="nav.pricing" href="#pricing">Pricing</a>
136-
<a data-i18n="nav.articles" href="./articles.html">Articles</a>
137-
<a data-i18n="nav.videos" href="./videos.html">Videos</a>
138-
<a data-i18n="nav.faq" href="#faq">FAQ</a>
139-
<a data-i18n="nav.contact" href="#contact">Contact</a>
140-
</nav>
141-
<div class="nav-actions">
142-
<button aria-label="Toggle language" class="icon-btn" id="langToggle" title="EN / RU">EN</button>
143-
<button aria-label="Toggle theme" class="icon-btn" id="themeToggle" title="Toggle theme">🌙</button>
144-
</div>
145-
<button aria-expanded="false" aria-label="Open menu" class="burger" id="burger">☰</button>
146-
</div>
147-
</header>
148-
<section class="hero reveal">
149-
<div class="container hero-inner">
150-
<div class="hero-copy">
151-
<h1><span class="grad" data-i18n="hero.title_a">On‑chain Risk Metrics</span> <span data-i18n="hero.title_b">for DeFi &amp; Telegram</span></h1>
152-
<p class="sub" data-i18n="hero.sub">QuickScan in seconds. Deep checks on demand.</p>
153-
<div class="cta-row">
154-
<a class="cta-bot large cta primary" href="https://t.me/MetridexBot" rel="noopener" target="_blank">Open @MetridexBot</a>
155-
<a class="cta" data-i18n="cta.features" href="#features">See features</a>
156-
<button aria-haspopup="dialog" class="cta" data-i18n="cta.watch" data-video="promo" id="watchDemo">▶ Watch demo</button>
157-
<a class="cta" download="" href="./onepager_en_print_SAFE.pdf" title="Save PDF (EN)">Save PDF (EN)</a><a class="cta" download="" href="./onepager_ru_print_SAFE.pdf" title="Сохранить PDF (RU)">Save PDF (RU)</a></div>
158-
<span class="info-tip" data-tip="Print‑ready one‑pager: concise product overview, pricing, and links. PDF for sharing and printing.">ℹ</span><p class="text-center hero-tip" data-i18n="hero.tip">Tip: Use Watchlist to keep an eye on tokens you care about. Alerts (lite) notify you on notable changes without spamming.</p></div>
159-
<div class="hero-card glass">
160-
<h3 data-i18n="hero.card_title">QuickScan snapshot</h3>
161-
<ul>
162-
<li data-i18n="hero.card_li1">Δ 5m / 1h / 6h / 24h</li>
163-
<li data-i18n="hero.card_li2">Liquidity &amp; holders</li>
164-
<li data-i18n="hero.card_li3">Honeypot flags</li>
165-
<li data-i18n="hero.card_li4">Shareable report</li>
166-
</ul>
167-
</div>
168-
</div>
169-
</section>
170-
<section class="section band center reveal" id="about">
171-
<div class="container band-inner">
172-
<div class="band-copy">
173-
<h2 data-i18n="about.title">About</h2>
174-
<p data-i18n="about.copy">Metridex helps communities, launchpads and traders spot risk signals fast: liquidity, holder patterns, contract flags, domain reputation (WHOIS/RDAP), SSL, Wayback and more.</p>
175-
</div>
176-
</div>
177-
</section>
178-
<section class="section alt reveal" id="features">
179-
<div class="container">
180-
<h2 data-i18n="features.title">Features</h2>
181-
<div class="features-grid">
182-
<article class="feature glass"><h3 data-i18n="feat.quick_t">⚡ Quick</h3><p data-i18n="feat.quick_d">Instant QuickScan with Δ‑buttons. No waiting, no noise.</p></article>
183-
<article class="feature glass"><h3 data-i18n="feat.deep_t">🧠 Deep</h3><p data-i18n="feat.deep_d">WHOIS/RDAP, SSL, Wayback; on‑chain roles — only when needed.</p></article>
184-
<article class="feature glass"><h3 data-i18n="feat.tech_t">🧱 Tech</h3><p data-i18n="feat.tech_d">Render (Flask/Gunicorn) + Cloudflare Worker ds‑proxy.</p></article>
185-
<article class="feature glass"><h3 data-i18n="feat.reliable_t">✅ Reliable</h3><p data-i18n="feat.reliable_d">Stateless callbacks, idempotent delivery, cache‑first detail scan.</p></article>
186-
<article class="feature glass"><h3 data-i18n="feat.watch_t">🔔 Watchlist (lite)</h3><p data-i18n="feat.watch_d">Opt-in alerts on price Δ, liquidity, holder &amp; LP-lock changes, and major flags.</p></article></div>
187-
</div>
188-
</section>
189-
<section class="section reveal" id="screens">
190-
<div class="container">
191-
<h2 data-i18n="screens.title">Screens</h2>
192-
<div class="screens-grid">
193-
<figure class="screen glass">
194-
<div class="viewport"><img alt="QuickScan screen" onerror="this.parentElement.classList.add('placeholder'); this.remove();" src="./screens/quickscan.png"/></div>
195-
<figcaption data-i18n="screens.cap1">QuickScan</figcaption>
196-
</figure>
197-
<figure class="screen glass">
198-
<div class="viewport"><img alt="More details screen" onerror="this.parentElement.classList.add('placeholder'); this.remove();" src="./screens/details.png"/></div>
199-
<figcaption data-i18n="screens.cap2">More details</figcaption>
200-
</figure>
201-
</div>
202-
</div>
203-
</section>
204-
<section class="section alt reveal" id="partners">
205-
<div class="container">
206-
<h2 data-i18n="partners.title">Trusted by</h2>
207-
<div aria-label="Trusted logos" class="logos marquee planet">
208-
<div class="marquee-track">
209-
<!-- set A -->
210-
<div class="logo glass"><img alt="Partner 1" onerror="this.replaceWith(document.createTextNode('Logo'));" src="./logos/partner1.svg"/></div>
211-
<div class="logo glass"><img alt="Partner 2" onerror="this.replaceWith(document.createTextNode('Logo'));" src="./logos/partner2.svg"/></div>
212-
<div class="logo glass"><img alt="Partner 3" onerror="this.replaceWith(document.createTextNode('Logo'));" src="./logos/partner3.svg"/></div>
213-
<div class="logo glass"><img alt="Partner 4" onerror="this.replaceWith(document.createTextNode('Logo'));" src="./logos/partner4.svg"/></div>
214-
<div class="logo glass"><img alt="Partner 5" onerror="this.replaceWith(document.createTextNode('Logo'));" src="./logos/partner5.svg"/></div>
215-
<div class="logo glass"><img alt="Partner 6" onerror="this.replaceWith(document.createTextNode('Logo'));" src="./logos/partner6.svg"/></div>
216-
<!-- set B -->
217-
<div class="logo glass"><img alt="Partner 1" src="./logos/partner1.svg"/></div>
218-
<div class="logo glass"><img alt="Partner 2" src="./logos/partner2.svg"/></div>
219-
<div class="logo glass"><img alt="Partner 3" src="./logos/partner3.svg"/></div>
220-
<div class="logo glass"><img alt="Partner 4" src="./logos/partner4.svg"/></div>
221-
<div class="logo glass"><img alt="Partner 5" src="./logos/partner5.svg"/></div>
222-
<div class="logo glass"><img alt="Partner 6" src="./logos/partner6.svg"/></div>
223-
<!-- set C -->
224-
<div class="logo glass"><img alt="Partner 1" src="./logos/partner1.svg"/></div>
225-
<div class="logo glass"><img alt="Partner 2" src="./logos/partner2.svg"/></div>
226-
<div class="logo glass"><img alt="Partner 3" src="./logos/partner3.svg"/></div>
227-
<div class="logo glass"><img alt="Partner 4" src="./logos/partner4.svg"/></div>
228-
<div class="logo glass"><img alt="Partner 5" src="./logos/partner5.svg"/></div>
229-
<div class="logo glass"><img alt="Partner 6" src="./logos/partner6.svg"/></div>
230-
</div>
231-
</div>
232-
</div>
233-
</section>
234-
<section class="section reveal" id="how-it-works">
235-
<div class="container">
236-
<h2 data-i18n="how.title">How it works</h2>
237-
<div class="how-grid">
238-
<article class="how glass"><div class="step">1</div><h3 data-i18n="how.s1_t">Paste token/contract</h3><p data-i18n="how.s1_d">Run QuickScan in seconds.</p></article>
239-
<article class="how glass"><div class="step">2</div><h3 data-i18n="how.s2_t">Review signals</h3><p data-i18n="how.s2_d">Δ‑metrics, holders, liquidity, flags.</p></article>
240-
<article class="how glass"><div class="step">3</div><h3 data-i18n="how.s3_t">Deep on demand</h3><p data-i18n="how.s3_d">WHOIS/RDAP, SSL, Wayback, on‑chain roles.</p></article>
241-
</div>
242-
</div>
243-
</section>
244-
<section class="section alt reveal" id="security">
245-
<div class="container">
246-
<h2 data-i18n="sec.title">Security</h2>
247-
<div class="security-grid">
248-
<article class="sec glass"><h3 data-i18n="sec.data_t">Data handling</h3><ul><li data-i18n="sec.data_li1">No private keys, seed phrases, or wallets collected.</li><li data-i18n="sec.data_li2">Requests processed transit‑only; minimized logs.</li></ul></article>
249-
<article class="sec glass"><h3 data-i18n="sec.infra_t">Infrastructure</h3><ul><li data-i18n="sec.infra_li1">HTTPS, security headers, environment isolation.</li><li data-i18n="sec.infra_li2">Cloudflare edge + Render app isolation.</li></ul></article>
250-
<article class="sec glass"><h3 data-i18n="sec.compliance_t">Compliance</h3><ul><li data-i18n="sec.compliance_li1">GDPR‑friendly, deletion on request.</li><li data-i18n="sec.compliance_li2">Responsible disclosure contact.</li></ul></article>
251-
</div>
252-
</div>
253-
</section>
254-
<section class="section reveal" id="pricing">
255-
<div class="container">
256-
<h2 data-i18n="pricing.title">Pricing</h2>
257-
<div class="cards">
258-
<article class="card glass">
259-
<h3 data-i18n="pricing.free_t">Free</h3>
260-
<p data-i18n="pricing.free_d">2 QuickScan total, slow lane</p>
261-
<ul class="features small">
262-
<li data-i18n="pricing.free_li1">2 lifetime scans</li>
263-
<li data-i18n="pricing.free_li2">No Deep checks</li>
264-
<li data-i18n="pricing.free_li3">Watermarked report</li>
265-
</ul>
266-
<div class="price" data-i18n="pricing.free_p">$0</div>
267-
<div class="actions">
268-
<a class="btn primary cta-bot" data-i18n="pricing.free_cta">Start in Telegram</a>
269-
</div>
270-
</article>
271-
<article class="card glass">
272-
<h3 data-i18n="pricing.pro_t">Pro</h3>
273-
<p data-i18n="pricing.pro_d">QuickScan + Deep checks</p>
274-
<ul class="features small">
275-
<li data-i18n="pricing.pro_li1">300 scans / month</li>
276-
<li data-in18n="pricing.pro_li2">WHOIS/RDAP/SSL/Wayback</li>
277-
<li data-i18n="pricing.pro_li3">Export PDF/CSV, private links</li>
278-
</ul>
279-
<div class="price" data-i18n="pricing.pro_p">$29/mo</div>
280-
<div class="actions">
281-
<a class="btn accent cta-bot" data-i18n="pricing.pro_cta">Upgrade via Bot</a>
282-
</div>
283-
</article>
284-
<article class="card glass">
285-
<h3 data-i18n="pricing.teams_t">Teams</h3>
286-
<p data-i18n="pricing.teams_d">For groups with higher limits</p>
287-
<ul class="features small">
288-
<li data-i18n="pricing.teams_li1">1,500 scans / month</li>
289-
<li data-i18n="pricing.teams_li2">5 seats, shared dashboard</li>
290-
<li data-i18n="pricing.teams_li3">Webhooks, SSO‑ready</li>
291-
</ul>
292-
<div class="price" data-i18n="pricing.teams_p">$99/mo</div>
293-
<div class="actions">
294-
<a class="btn cta-bot" data-i18n="pricing.teams_cta">Start via Bot</a>
295-
</div>
296-
</article>
297-
<article class="card glass">
298-
<h3 data-i18n="pricing.ent_t">Enterprise</h3>
299-
<p data-i18n="pricing.ent_d">White‑label + SLA</p>
300-
<ul class="features small">
301-
<li data-i18n="pricing.ent_li1">Custom limits</li>
302-
<li data-i18n="pricing.ent_li2">SSO, SLA</li>
303-
<li data-i18n="pricing.ent_li3">Dedicated support</li>
304-
</ul>
305-
<div class="price" data-i18n="pricing.ent_p">Contact</div>
306-
<div class="actions">
307-
<a class="btn ghost" data-i18n="pricing.ent_cta" href="#contact">Contact sales</a>
308-
</div>
309-
</article>
310-
</div>
311-
</div>
312-
</section>
313-
<section class="section alt reveal" id="faq">
314-
<div class="container">
315-
<h2 data-i18n="faq.title">FAQ</h2>
316-
<div class="faq">
317-
<details class="qa glass">
318-
<summary data-i18n="faq.q1">What does QuickScan check?</summary>
319-
<p data-i18n="faq.a1">Δ‑metrics, liquidity &amp; holders, basic contract flags, and a shareable report.</p>
320-
</details>
321-
<details class="qa glass">
322-
<summary data-i18n="faq.q2">What’s in Deep checks?</summary>
323-
<p data-i18n="faq.a2">WHOIS/RDAP, SSL chains, Wayback snapshots, and on‑chain roles — on demand.</p>
324-
</details>
325-
<details class="qa glass">
326-
<summary data-i18n="faq.q3">Where can I use it?</summary>
327-
<p data-i18n="faq.a3">Works great for launchpads, pro traders, and Telegram communities.</p>
328-
</details>
329-
</div>
330-
</div>
331-
</section>
332-
<section class="section reveal" id="contact">
333-
<div class="container">
334-
<h2 data-i18n="contact.title">Contact</h2>
335-
<p><span data-i18n="contact.email">Email:</span> <a class="link" href="mailto:contact@metridex.com">contact@metridex.com</a></p>
336-
</div>
337-
</section>
338-
<div aria-modal="true" class="modal" hidden="" id="videoModal" role="dialog">
339-
<div class="modal-backdrop" data-close=""></div>
340-
<div class="modal-dialog glass" role="document">
341-
<button aria-label="Close" class="modal-close" data-close="">✕</button>
342-
<div class="modal-body">
343-
<video controls="" id="lightboxVideo" playsinline="" poster="/posters/promo.jpg">
344-
Sorry, your browser doesn't support embedded videos.
345-
</video>
346-
</div>
347-
</div>
348-
</div>
349-
<!-- Paywall banner -->
350-
<div class="banner" hidden="" id="paywallBanner">
351-
<div class="container banner-inner">
352-
<div class="banner-text">
353-
<strong data-i18n="banner.title">You have 1 free QuickScan left</strong>
354-
<span class="muted" data-i18n="banner.sub">Unlock Deep checks, exports and fast lane</span>
355-
</div>
356-
<div class="banner-actions">
357-
<a class="btn primary cta-bot" data-i18n="banner.cta_open">Open Bot</a>
358-
<a class="btn accent cta-bot" data-i18n="banner.cta_day">Day‑Pass $9</a>
359-
<a class="btn ghost cta-bot" data-i18n="banner.cta_pro">Go Pro $29/mo</a>
360-
<button aria-label="Close" class="icon-btn banner-close">✕</button>
361-
</div>
362-
</div>
363-
</div>
364-
<footer class="footer">
365-
<div class="container">
366-
<p>© <span id="year"></span> <span>Metridex.</span> <span data-i18n="footer.rights">All rights reserved.</span></p>
367-
<p><a href="./onepager_en.html">One‑Pager (EN)</a> · <a href="./onepager_ru.html">One‑Pager (RU)</a> · <a href="./onepager_en_print_SAFE.pdf">PDF (EN)</a> · <a href="./onepager_ru_print_SAFE.pdf">PDF (RU)</a></p></div>
368-
</footer>
369-
<script src="./script.js"></script>
370-
</body>
371-
</html>

0 commit comments

Comments
 (0)