Skip to content

Commit 0c9dd11

Browse files
ishtartecclaude
andcommitted
feat(site): add GitHub Pages landing with SEO (meta, OG, sitemap, JSON-LD)
Static, dependency-free landing served from /docs: hero, screenshot gallery, feature grid, download CTA to the latest release, and a Riot legal disclaimer. Includes canonical URL, Open Graph + Twitter cards, robots.txt, sitemap.xml, JSON-LD SoftwareApplication, and a Search Console verification placeholder so the page is fully indexable and under our control. Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
1 parent 3a5d54d commit 0c9dd11

6 files changed

Lines changed: 380 additions & 0 deletions

File tree

docs/.nojekyll

Whitespace-only changes.

docs/favicon.png

10.5 KB
Loading

docs/index.html

Lines changed: 177 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,177 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset="UTF-8" />
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
6+
7+
<title>QueryLoL — League of Legends Companion for Windows &amp; macOS</title>
8+
<meta name="description" content="QueryLoL is a lightweight (~15MB) League of Legends companion app: auto-apply optimal builds, counter-based pick/ban suggestions, smurf detection, a real-time in-game overlay, and post-game analysis. Built with Tauri + React. Free and open source. No Overwolf, no Electron." />
9+
<meta name="keywords" content="League of Legends, LoL companion app, LoL overlay, op.gg desktop, build optimizer, rune optimizer, smurf detection, champion select, draft tool, Tauri, LCU" />
10+
<meta name="author" content="ishtartec" />
11+
<meta name="robots" content="index, follow" />
12+
<meta name="theme-color" content="#0a0e14" />
13+
<link rel="canonical" href="https://ishtartec.github.io/query-lol-desktop/" />
14+
<link rel="icon" type="image/png" href="favicon.png" />
15+
<link rel="apple-touch-icon" href="favicon.png" />
16+
17+
<!-- Open Graph -->
18+
<meta property="og:type" content="website" />
19+
<meta property="og:site_name" content="QueryLoL" />
20+
<meta property="og:title" content="QueryLoL — League of Legends Companion for Windows &amp; macOS" />
21+
<meta property="og:description" content="Auto-apply optimal builds, draft intelligence, smurf detection, a real-time in-game overlay, and post-game analysis. Lightweight, free, and open source." />
22+
<meta property="og:url" content="https://ishtartec.github.io/query-lol-desktop/" />
23+
<meta property="og:image" content="https://ishtartec.github.io/query-lol-desktop/screenshots/champ-select-build.png" />
24+
<meta property="og:image:width" content="2532" />
25+
<meta property="og:image:height" content="1542" />
26+
<meta property="og:image:alt" content="QueryLoL champion select view with auto-applied build and damage composition" />
27+
28+
<!-- Twitter -->
29+
<meta name="twitter:card" content="summary_large_image" />
30+
<meta name="twitter:title" content="QueryLoL — League of Legends Companion for Windows &amp; macOS" />
31+
<meta name="twitter:description" content="Auto-apply optimal builds, draft intelligence, smurf detection, a real-time in-game overlay, and post-game analysis. Lightweight, free, and open source." />
32+
<meta name="twitter:image" content="https://ishtartec.github.io/query-lol-desktop/screenshots/champ-select-build.png" />
33+
34+
<!-- TODO: paste your Google Search Console verification meta tag below, e.g.
35+
<meta name="google-site-verification" content="XXXXXXXXXXXXXXXXXXXXXXXXXXXXX" /> -->
36+
37+
<link rel="stylesheet" href="styles.css" />
38+
39+
<script type="application/ld+json">
40+
{
41+
"@context": "https://schema.org",
42+
"@type": "SoftwareApplication",
43+
"name": "QueryLoL",
44+
"applicationCategory": "GameApplication",
45+
"operatingSystem": "Windows, macOS",
46+
"description": "A lightweight League of Legends companion app: auto-apply optimal builds, counter-based pick/ban suggestions, smurf detection, a real-time in-game overlay, and post-game analysis.",
47+
"url": "https://ishtartec.github.io/query-lol-desktop/",
48+
"downloadUrl": "https://github.com/ishtartec/query-lol-desktop/releases/latest",
49+
"softwareVersion": "0.16.0",
50+
"license": "https://github.com/ishtartec/query-lol-desktop",
51+
"offers": {
52+
"@type": "Offer",
53+
"price": "0",
54+
"priceCurrency": "USD"
55+
},
56+
"author": {
57+
"@type": "Organization",
58+
"name": "ishtartec"
59+
}
60+
}
61+
</script>
62+
</head>
63+
<body>
64+
<header class="nav">
65+
<a class="brand" href="#top">
66+
<img src="favicon.png" alt="QueryLoL logo" width="28" height="28" />
67+
<span>QueryLoL</span>
68+
</a>
69+
<nav class="nav-links">
70+
<a href="#features">Features</a>
71+
<a href="#screenshots">Screenshots</a>
72+
<a href="https://github.com/ishtartec/query-lol-desktop" target="_blank" rel="noopener">GitHub</a>
73+
<a class="btn btn-sm" href="https://github.com/ishtartec/query-lol-desktop/releases/latest" target="_blank" rel="noopener">Download</a>
74+
</nav>
75+
</header>
76+
77+
<main id="top">
78+
<section class="hero">
79+
<div class="hero-inner">
80+
<span class="eyebrow">Windows &amp; macOS · Free &amp; open source</span>
81+
<h1>Your League of Legends edge,<br />from champ select to post-game.</h1>
82+
<p class="lede">
83+
QueryLoL auto-applies optimal builds the moment you pick, reads the draft for counters and synergies,
84+
flags smurfs, and runs a real-time in-game overlay — then breaks down every match afterwards.
85+
</p>
86+
<div class="cta-row">
87+
<a class="btn btn-lg" href="https://github.com/ishtartec/query-lol-desktop/releases/latest" target="_blank" rel="noopener">
88+
Download latest release
89+
</a>
90+
<a class="btn btn-lg btn-ghost" href="https://github.com/ishtartec/query-lol-desktop" target="_blank" rel="noopener">
91+
View source on GitHub
92+
</a>
93+
</div>
94+
<p class="micro">~15&nbsp;MB binary · No Overwolf · No Electron · Built with Tauri&nbsp;+&nbsp;React</p>
95+
</div>
96+
</section>
97+
98+
<section id="screenshots" class="section">
99+
<h2>See it in action</h2>
100+
101+
<figure class="shot">
102+
<img src="screenshots/champ-select-build.png" alt="Champion select build view with damage composition" loading="lazy" />
103+
<figcaption><strong>Champion Select — Builds &amp; Damage Composition.</strong> Auto-applied runes, spells, and item set the moment you pick, with per-team AD/AP damage bars and enemy matchup win rates.</figcaption>
104+
</figure>
105+
106+
<figure class="shot">
107+
<img src="screenshots/level-plan.png" alt="Level-by-level plan timeline" loading="lazy" />
108+
<figcaption><strong>Level-by-Level Plan.</strong> An 18-level timeline vs your lane opponent — per-level advantage from power curves, spike bonuses, and ult strength, plus situational items and matchup notes.</figcaption>
109+
</figure>
110+
111+
<figure class="shot">
112+
<img src="screenshots/live-game.png" alt="Live game scoreboard and recommended build" loading="lazy" />
113+
<figcaption><strong>Live Game.</strong> Real-time recommended build, win probability, gold diff, and a full scoreboard with player ranks plus OTP / first-time / smurf labels.</figcaption>
114+
</figure>
115+
116+
<figure class="shot">
117+
<img src="screenshots/post-game.png" alt="Post-game match summary with role-adjusted performance breakdown" loading="lazy" />
118+
<figcaption><strong>Post-Game Analysis.</strong> Full scoreboard for both teams plus a role-adjusted performance breakdown across KDA, CS/min, gold/min, damage share, vision/min, and kill participation.</figcaption>
119+
</figure>
120+
121+
<figure class="shot">
122+
<img src="screenshots/home-dashboard.png" alt="Home dashboard with role-aware improvement panel and LP progress" loading="lazy" />
123+
<figcaption><strong>Home Dashboard.</strong> Today's recap, your top champions vs your own baseline, role-aware areas to improve, LP progress, and recent match history.</figcaption>
124+
</figure>
125+
</section>
126+
127+
<section id="features" class="section">
128+
<h2>What's inside</h2>
129+
<div class="grid">
130+
<article class="card">
131+
<h3>Champion Select — Builds</h3>
132+
<p>Auto-apply full rune pages, summoner spells, and item sets from OP.GG the moment you pick. Alternative builds with win/pick rates, color-coded skill order, and item/rune tooltips.</p>
133+
</article>
134+
<article class="card">
135+
<h3>Drafting Intelligence</h3>
136+
<p>Pick &amp; ban recommendations scored 0–100, per-enemy matchup win rates, team-composition callouts, all-lanes prediction, and a coach-style level-by-level plan for all 172 champions.</p>
137+
</article>
138+
<article class="card">
139+
<h3>Live Game &amp; Overlay</h3>
140+
<p>Real-time scoreboard, smurf detection, gold tracker, objective timers, win probability, MIA / death-timer / recall advisors, voice cues (TTS), and a hold-TAB in-game overlay.</p>
141+
</article>
142+
<article class="card">
143+
<h3>Post-Game Analysis</h3>
144+
<p>Full scoreboard with MVP and multikill badges, gold-advantage timeline, elo comparison, and per-phase (early / mid / late) breakdowns of CS/min, gold/min, and KDA.</p>
145+
</article>
146+
<article class="card">
147+
<h3>Profile &amp; Improvement</h3>
148+
<p>Daily summary, tilt gate after loss streaks, role-aware improvement priorities vs elo benchmarks, LP progress chart, and per-champion deltas against your own baseline.</p>
149+
</article>
150+
<article class="card">
151+
<h3>Lightweight by design</h3>
152+
<p>A ~15&nbsp;MB native binary built with Tauri (Rust) + React. No Overwolf, no Electron. Windows and macOS, 11 regions, all HTTP done locally in Rust.</p>
153+
</article>
154+
</div>
155+
156+
<div class="cta-row center">
157+
<a class="btn btn-lg" href="https://github.com/ishtartec/query-lol-desktop/releases/latest" target="_blank" rel="noopener">
158+
Download for Windows &amp; macOS
159+
</a>
160+
</div>
161+
</section>
162+
</main>
163+
164+
<footer class="footer">
165+
<p>
166+
<a href="https://github.com/ishtartec/query-lol-desktop" target="_blank" rel="noopener">GitHub</a> ·
167+
<a href="https://github.com/ishtartec/query-lol-desktop/releases" target="_blank" rel="noopener">Releases</a> ·
168+
Built with Tauri + React
169+
</p>
170+
<p class="disclaimer">
171+
QueryLoL isn't endorsed by Riot Games and doesn't reflect the views or opinions of Riot Games or anyone
172+
officially involved in producing or managing Riot Games properties. Riot Games and all associated properties
173+
are trademarks or registered trademarks of Riot Games, Inc.
174+
</p>
175+
</footer>
176+
</body>
177+
</html>

docs/robots.txt

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
User-agent: *
2+
Allow: /
3+
4+
Sitemap: https://ishtartec.github.io/query-lol-desktop/sitemap.xml

docs/sitemap.xml

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
<?xml version="1.0" encoding="UTF-8"?>
2+
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
3+
xmlns:image="http://www.google.com/schemas/sitemap-image/1.1">
4+
<url>
5+
<loc>https://ishtartec.github.io/query-lol-desktop/</loc>
6+
<lastmod>2026-06-21</lastmod>
7+
<changefreq>weekly</changefreq>
8+
<priority>1.0</priority>
9+
<image:image>
10+
<image:loc>https://ishtartec.github.io/query-lol-desktop/screenshots/champ-select-build.png</image:loc>
11+
<image:title>QueryLoL champion select build view</image:title>
12+
</image:image>
13+
<image:image>
14+
<image:loc>https://ishtartec.github.io/query-lol-desktop/screenshots/live-game.png</image:loc>
15+
<image:title>QueryLoL live game scoreboard and overlay</image:title>
16+
</image:image>
17+
<image:image>
18+
<image:loc>https://ishtartec.github.io/query-lol-desktop/screenshots/post-game.png</image:loc>
19+
<image:title>QueryLoL post-game analysis</image:title>
20+
</image:image>
21+
</url>
22+
</urlset>

docs/styles.css

Lines changed: 177 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,177 @@
1+
:root {
2+
--bg: #0a0e14;
3+
--bg-2: #0f141c;
4+
--panel: #131a24;
5+
--border: #1f2933;
6+
--text: #e6e9ef;
7+
--muted: #9aa6b2;
8+
--gold: #c8aa6e;
9+
--gold-bright: #f0e6d2;
10+
--teal: #0ac8b9;
11+
--radius: 12px;
12+
--maxw: 1080px;
13+
}
14+
15+
* { box-sizing: border-box; margin: 0; padding: 0; }
16+
17+
html { scroll-behavior: smooth; }
18+
19+
body {
20+
background:
21+
radial-gradient(1200px 600px at 50% -200px, rgba(200,170,110,0.10), transparent 70%),
22+
radial-gradient(900px 500px at 90% 10%, rgba(10,200,185,0.06), transparent 70%),
23+
var(--bg);
24+
color: var(--text);
25+
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
26+
line-height: 1.6;
27+
-webkit-font-smoothing: antialiased;
28+
}
29+
30+
a { color: var(--gold); text-decoration: none; }
31+
a:hover { color: var(--gold-bright); }
32+
33+
/* Nav */
34+
.nav {
35+
position: sticky;
36+
top: 0;
37+
z-index: 10;
38+
display: flex;
39+
align-items: center;
40+
justify-content: space-between;
41+
gap: 16px;
42+
padding: 14px 24px;
43+
background: rgba(10, 14, 20, 0.82);
44+
backdrop-filter: blur(10px);
45+
border-bottom: 1px solid var(--border);
46+
}
47+
.brand {
48+
display: flex;
49+
align-items: center;
50+
gap: 10px;
51+
font-weight: 700;
52+
font-size: 18px;
53+
letter-spacing: 0.5px;
54+
color: var(--gold-bright);
55+
}
56+
.brand img { border-radius: 6px; }
57+
.nav-links { display: flex; align-items: center; gap: 22px; }
58+
.nav-links a { color: var(--muted); font-size: 15px; font-weight: 500; }
59+
.nav-links a:hover { color: var(--text); }
60+
@media (max-width: 640px) {
61+
.nav-links a:not(.btn) { display: none; }
62+
}
63+
64+
/* Buttons */
65+
.btn {
66+
display: inline-block;
67+
background: linear-gradient(180deg, #d6bb84, #b8985c);
68+
color: #1a1207;
69+
font-weight: 700;
70+
border: 1px solid #d6bb84;
71+
border-radius: 8px;
72+
padding: 10px 18px;
73+
transition: transform 0.12s ease, box-shadow 0.12s ease, filter 0.12s ease;
74+
box-shadow: 0 6px 20px rgba(200, 170, 110, 0.18);
75+
}
76+
.btn:hover { color: #1a1207; filter: brightness(1.06); transform: translateY(-1px); }
77+
.btn-sm { padding: 7px 14px; font-size: 14px; }
78+
.btn-lg { padding: 14px 26px; font-size: 16px; }
79+
.btn-ghost {
80+
background: transparent;
81+
color: var(--gold-bright);
82+
border-color: var(--border);
83+
box-shadow: none;
84+
}
85+
.btn-ghost:hover { border-color: var(--gold); color: var(--gold-bright); }
86+
87+
/* Hero */
88+
.hero {
89+
padding: 92px 24px 64px;
90+
text-align: center;
91+
}
92+
.hero-inner { max-width: 820px; margin: 0 auto; }
93+
.eyebrow {
94+
display: inline-block;
95+
font-size: 13px;
96+
letter-spacing: 1.4px;
97+
text-transform: uppercase;
98+
color: var(--gold);
99+
border: 1px solid var(--border);
100+
border-radius: 999px;
101+
padding: 5px 14px;
102+
margin-bottom: 22px;
103+
}
104+
.hero h1 {
105+
font-size: clamp(30px, 5.2vw, 52px);
106+
line-height: 1.12;
107+
letter-spacing: -0.5px;
108+
color: var(--gold-bright);
109+
margin-bottom: 20px;
110+
}
111+
.lede { font-size: clamp(16px, 2.2vw, 19px); color: var(--muted); max-width: 680px; margin: 0 auto 32px; }
112+
.cta-row { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }
113+
.cta-row.center { margin-top: 36px; }
114+
.micro { margin-top: 22px; font-size: 13px; color: var(--muted); }
115+
116+
/* Sections */
117+
.section { max-width: var(--maxw); margin: 0 auto; padding: 56px 24px; }
118+
.section h2 {
119+
font-size: clamp(24px, 3.4vw, 32px);
120+
color: var(--gold-bright);
121+
text-align: center;
122+
margin-bottom: 36px;
123+
letter-spacing: -0.3px;
124+
}
125+
126+
/* Screenshots */
127+
.shot {
128+
margin: 0 auto 44px;
129+
max-width: 940px;
130+
}
131+
.shot img {
132+
width: 100%;
133+
height: auto;
134+
display: block;
135+
border: 1px solid var(--border);
136+
border-radius: var(--radius);
137+
box-shadow: 0 20px 60px rgba(0, 0, 0, 0.45);
138+
background: var(--bg-2);
139+
}
140+
.shot figcaption {
141+
margin-top: 14px;
142+
text-align: center;
143+
color: var(--muted);
144+
font-size: 15px;
145+
}
146+
.shot figcaption strong { color: var(--text); }
147+
148+
/* Feature grid */
149+
.grid {
150+
display: grid;
151+
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
152+
gap: 18px;
153+
}
154+
.card {
155+
background: linear-gradient(180deg, var(--panel), var(--bg-2));
156+
border: 1px solid var(--border);
157+
border-radius: var(--radius);
158+
padding: 22px;
159+
transition: border-color 0.15s ease, transform 0.15s ease;
160+
}
161+
.card:hover { border-color: rgba(200, 170, 110, 0.4); transform: translateY(-2px); }
162+
.card h3 { color: var(--gold); font-size: 17px; margin-bottom: 10px; }
163+
.card p { color: var(--muted); font-size: 15px; }
164+
165+
/* Footer */
166+
.footer {
167+
border-top: 1px solid var(--border);
168+
padding: 36px 24px 56px;
169+
text-align: center;
170+
color: var(--muted);
171+
font-size: 14px;
172+
max-width: var(--maxw);
173+
margin: 0 auto;
174+
}
175+
.footer a { color: var(--muted); }
176+
.footer a:hover { color: var(--gold); }
177+
.disclaimer { margin-top: 16px; font-size: 12px; line-height: 1.5; max-width: 720px; margin-left: auto; margin-right: auto; opacity: 0.8; }

0 commit comments

Comments
 (0)