diablo2-web/index.html

184 lines
5.9 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!doctype html>
<html lang="zh-CN">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Diablo II Web · 暗黑破坏神 II 网页版 (v1.13c)</title>
<style>
:root {
color-scheme: dark;
}
* {
box-sizing: border-box;
}
html,
body {
margin: 0;
min-height: 100vh;
background:
radial-gradient(circle at 50% 24%, rgba(168, 92, 24, 0.22) 0%, rgba(18, 12, 8, 0.92) 56%, #070503 100%);
color: #e8dcc8;
font-family: 'Exocet', 'Cinzel', 'Georgia', 'Songti SC', 'SimSun', serif;
display: flex;
align-items: center;
justify-content: center;
padding: 24px;
}
.sanctuary-frame {
width: min(840px, 100%);
background: linear-gradient(180deg, rgba(24, 19, 14, 0.96) 0%, rgba(11, 9, 6, 0.98) 100%);
border: 2px solid #5c4628;
box-shadow:
0 0 0 1px #1e160d,
0 0 48px rgba(0, 0, 0, 0.92),
inset 0 0 32px rgba(200, 161, 90, 0.08);
padding: 42px 36px 34px;
text-align: center;
position: relative;
}
.sanctuary-frame::before {
content: '';
position: absolute;
inset: 6px;
border: 1px solid rgba(200, 161, 90, 0.28);
pointer-events: none;
}
.emblem {
display: inline-block;
padding: 4px 14px;
border: 1px solid #6e5430;
background: rgba(34, 24, 14, 0.85);
color: #c8a15a;
font-size: 12px;
letter-spacing: 0.18em;
text-transform: uppercase;
margin-bottom: 16px;
}
h1 {
margin: 0 0 8px;
font-size: clamp(26px, 4vw, 38px);
color: #d8b46a;
letter-spacing: 0.08em;
text-shadow: 0 2px 12px rgba(216, 140, 40, 0.35), 0 1px 2px #000;
}
.subtitle {
margin: 0 0 28px;
color: #a7967d;
font-size: 15px;
letter-spacing: 0.05em;
}
.lang-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
gap: 20px;
margin-bottom: 28px;
}
.lang-card {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
padding: 26px 22px;
background: linear-gradient(180deg, #1d1711 0%, #110d09 100%);
border: 1px solid #6a5230;
color: #e8dcc8;
text-decoration: none;
transition: transform 0.14s ease, border-color 0.14s ease, box-shadow 0.14s ease;
box-shadow: inset 0 0 18px rgba(0, 0, 0, 0.8);
cursor: pointer;
}
.lang-card:hover,
.lang-card:focus-visible {
transform: translateY(-2px);
border-color: #e2be78;
box-shadow:
0 8px 24px rgba(0, 0, 0, 0.75),
0 0 16px rgba(200, 161, 90, 0.25),
inset 0 0 20px rgba(200, 161, 90, 0.14);
outline: none;
}
.lang-badge {
font-size: 11px;
letter-spacing: 0.16em;
color: #9c8458;
text-transform: uppercase;
margin-bottom: 8px;
}
.lang-title {
font-size: 22px;
font-weight: 700;
color: #f0d596;
margin-bottom: 8px;
letter-spacing: 0.04em;
}
.lang-desc {
font-size: 13px;
color: #9c8d78;
line-height: 1.5;
}
.lang-cta {
margin-top: 16px;
padding: 6px 18px;
background: rgba(200, 161, 90, 0.14);
border: 1px solid #8c6e3e;
color: #e8c478;
font-size: 12px;
letter-spacing: 0.08em;
}
.footer-meta {
font-size: 12px;
color: #6d5e4b;
letter-spacing: 0.04em;
}
</style>
</head>
<body>
<main class="sanctuary-frame">
<div class="emblem">Diablo II: Lord of Destruction · Patch 1.13c</div>
<h1>DIABLO II WEB · 暗黑破坏神 II</h1>
<p class="subtitle">Select Language Edition · 请选择游戏语言版本</p>
<div class="lang-grid">
<a id="enter-zh" class="lang-card" href="./acts-zh.html" data-target="./acts-zh.html">
<span class="lang-badge">Simplified Chinese · CHI.tbl</span>
<span class="lang-title">中文版 (简体中文)</span>
<span class="lang-desc">暗黑破坏神 II:毁灭之王 v1.13c<br />完整原版中文字典、任务日志、技能树与装备词缀</span>
<span class="lang-cta">进入中文版 · Enter Chinese</span>
</a>
<a id="enter-en" class="lang-card" href="./acts-en.html" data-target="./acts-en.html">
<span class="lang-badge">Canonical English · ENG.tbl</span>
<span class="lang-title">English Version</span>
<span class="lang-desc">Diablo II: Lord of Destruction v1.13c<br />Authentic 1.13c English String Tables, Quests, Skills &amp; Item Affixes</span>
<span class="lang-cta">Enter Sanctuary · English</span>
</a>
</div>
<div class="footer-meta">
136 Canonical Levels · 7 Hero Classes · Authentic 1.13c DRLG, Combat &amp; .tbl Localization
</div>
</main>
<script>
;(function () {
var suffix = (window.location.search || '') + (window.location.hash || '')
var links = document.querySelectorAll('a[data-target]')
for (var i = 0; i < links.length; i++) {
var a = links[i]
var base = a.getAttribute('data-target')
if (base) {
a.setAttribute('href', base + suffix)
a.addEventListener('click', function (e) {
var target = e.currentTarget.getAttribute('data-target')
if (target) {
e.preventDefault()
window.location.href = target + (window.location.search || '') + (window.location.hash || '')
}
})
}
}
})()
</script>
</body>
</html>