Add hash routing and Dota 2 logo to relations preview.

- New web/relations/router.js (parseHash/serializeHash/installRouter):
  top tabs, hero + detail sub-tab, item, patch version, tag filters and
  search query all sync to URL (#/heroes/axe/core, ?tags=...&q=...);
  pushState for discrete picks, replaceState for debounced search.
- export_relations_site.py copies router.js so static export deep-links.
- Header shows dota2_logo.png + title, served via /ui-icon/ whitelist.
- fetch_dota2_logo.py fetches the transparent emblem asset.
- Docs: CHANGELOG / README / DESIGN / AGENTS updated.
This commit is contained in:
voson
2026-07-27 13:09:14 +08:00
parent a91789b72f
commit 1d0428b4a3
13 changed files with 10306 additions and 17 deletions
+48 -6
View File
@@ -42,6 +42,39 @@ body {
background: rgba(8, 12, 20, 0.45);
flex: 0 0 auto;
}
/* Brand mark: official Dota 2 logo + 上分帝 title, pinned to the top-left
corner of the topbar. Absolutely positioned so the centered tab row and
toolbar layout are left untouched. */
.brand {
position: absolute;
left: 20px;
top: 12px;
height: 40px;
display: flex;
align-items: center;
gap: 12px;
pointer-events: none;
z-index: 2;
}
.brand-logo {
height: 34px;
width: auto;
display: block;
}
.brand-title {
font-size: 18px;
font-weight: 700;
letter-spacing: 0.16em;
color: var(--text);
white-space: nowrap;
text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
}
@media (max-width: 880px) {
.brand-title { display: none; }
}
@media (max-width: 620px) {
.brand { display: none; }
}
.main-tabs {
display: flex;
justify-content: center;
@@ -1532,14 +1565,23 @@ body:has(#items-view:not(.hidden)) {
}
.patches-title {
margin: 0;
font-size: 26px;
font-weight: 700;
letter-spacing: 0.02em;
color: var(--text);
display: flex;
flex-direction: column;
align-items: flex-start;
gap: 4px;
}
.patches-kicker {
font-size: 15px;
font-weight: 600;
color: var(--muted);
letter-spacing: 0.14em;
}
.patches-ver {
color: var(--sel);
margin-left: 4px;
font-size: 40px;
font-weight: 800;
color: var(--text);
letter-spacing: 0.02em;
line-height: 1;
}
#patch-select {
flex: 0 1 auto;