docs: the old v5 docs now point to docs.nadeko.bot and nadekloud

This commit is contained in:
Breaker
2026-11-01 10:36:03 +00:00
parent 6c7ac44ed0
commit f3310196a2
28 changed files with 412 additions and 1931 deletions
+407
View File
@@ -0,0 +1,407 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="color-scheme" content="light dark">
<title>The NadekoBot docs have moved</title>
<meta name="description" content="The NadekoBot docs are now at docs.nadeko.bot. NadeKloud hosts your own NadekoBot for you.">
<link rel="canonical" href="https://docs.nadeko.bot/">
<meta property="og:type" content="website">
<meta property="og:title" content="The NadekoBot docs have moved">
<meta property="og:description" content="The current NadekoBot docs are at docs.nadeko.bot.">
<meta property="og:url" content="https://docs.nadeko.bot/">
<meta name="theme-color" content="#edebf0" media="(prefers-color-scheme: light)">
<meta name="theme-color" content="#0a0810" media="(prefers-color-scheme: dark)">
<link rel="icon" type="image/svg+xml" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cdefs%3E%3ClinearGradient id='s' x1='5' y1='-3' x2='27' y2='35' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23e0457e'/%3E%3Cstop offset='1' stop-color='%23a8124c'/%3E%3C/linearGradient%3E%3C/defs%3E%3Cpath d='M0 0H32V24.96L24.96 32H0Z' fill='url(%23s)'/%3E%3Cg transform='translate(16 16) scale(1.3) translate(-12 -12)' fill='%23fff' fill-opacity='.55' stroke='%23fff' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 11.6L10 6.4L10.7 5.2L11.4 6L12 4.8L12.6 6L13.3 5.2L14 6.4Z'/%3E%3Cpath transform='rotate(72 12 12)' d='M12 11.6L10 6.4L10.7 5.2L11.4 6L12 4.8L12.6 6L13.3 5.2L14 6.4Z'/%3E%3Cpath transform='rotate(144 12 12)' d='M12 11.6L10 6.4L10.7 5.2L11.4 6L12 4.8L12.6 6L13.3 5.2L14 6.4Z'/%3E%3Cpath transform='rotate(216 12 12)' d='M12 11.6L10 6.4L10.7 5.2L11.4 6L12 4.8L12.6 6L13.3 5.2L14 6.4Z'/%3E%3Cpath transform='rotate(288 12 12)' d='M12 11.6L10 6.4L10.7 5.2L11.4 6L12 4.8L12.6 6L13.3 5.2L14 6.4Z'/%3E%3Ccircle cx='12' cy='12' r='1.4' fill-opacity='1' stroke='none'/%3E%3C/g%3E%3C/svg%3E">
<style>
/* NadeKloud's two palettes: light "washi" and dark "ink", picked from the OS setting. */
:root {
color-scheme: light dark;
--bg: light-dark(#edebf0, #0a0810);
--bg-2: light-dark(#e2dfe4, #100c18);
--text: light-dark(#1a1420, #f5efe7);
--text-2: light-dark(#2f2735, #e6dfea);
--text-subtle: light-dark(#5a5064, #d2cadb);
--text-quiet: light-dark(#665c71, #c2b9cf);
--accent: light-dark(#e0568a, #ff7eab);
--accent-strong: light-dark(#a8265f, #ffb0cc);
--kicker: light-dark(#c4245f, #e8508a);
--ornament: light-dark(#9a7420, #e6c07a);
--sakura: #ffb7c5;
--seal: #e0457e;
--seal-stop: #a8124c;
--edge: light-dark(rgba(35, 25, 45, 0.16), rgba(255, 255, 255, 0.13));
--edge-strong: light-dark(rgba(35, 25, 45, 0.34), rgba(255, 255, 255, 0.26));
--edge-strong-hover: light-dark(rgba(35, 25, 45, 0.5), rgba(255, 255, 255, 0.42));
--hairline: light-dark(rgba(35, 25, 45, 0.1), rgba(255, 255, 255, 0.09));
--panel-bg: linear-gradient(158deg,
light-dark(rgba(255, 255, 255, 0.96), rgba(28, 22, 38, 0.94)),
light-dark(rgba(246, 244, 249, 0.96), rgba(15, 12, 21, 0.96)));
--surface: light-dark(#ffffff, #16111f);
--surface-quiet: light-dark(#f8f6fa, #1d1727);
--sweep-a: #a3175a;
--sweep-b: #c42a66;
--on-fill: #ffffff;
--focus-ring: light-dark(#c2306f, #ffb7c5);
--glow-1: light-dark(rgba(255, 120, 155, 0.22), rgba(255, 60, 110, 0.2));
--glow-2: light-dark(rgba(150, 130, 255, 0.14), rgba(120, 90, 255, 0.14));
--shadow-raised:
0 1px 2px light-dark(rgba(60, 40, 50, 0.06), rgba(0, 0, 0, 0.4)),
0 8px 24px light-dark(rgba(60, 40, 50, 0.08), rgba(0, 0, 0, 0.45));
--text-shadow-brand:
0 -1px 0 light-dark(rgba(0, 0, 0, 0.16), rgba(0, 0, 0, 0.5)),
0 1px 0 light-dark(rgba(255, 255, 255, 0.85), rgba(255, 255, 255, 0.06));
--notch: 1.125rem;
--notch-sm: 0.6875rem;
--clip-notch: polygon(0 0, calc(100% - var(--notch)) 0, 100% var(--notch), 100% 100%, var(--notch) 100%, 0 calc(100% - var(--notch)));
--clip-notch-inner: polygon(0 0, calc(100% - var(--notch) + 1px) 0, 100% calc(var(--notch) - 1px), 100% 100%, calc(var(--notch) - 1px) 100%, 0 calc(100% - var(--notch) + 1px));
--clip-notch-sm: polygon(0 0, calc(100% - var(--notch-sm)) 0, 100% var(--notch-sm), 100% 100%, var(--notch-sm) 100%, 0 calc(100% - var(--notch-sm)));
--clip-notch-sm-inner: polygon(0 0, calc(100% - var(--notch-sm) + 1px) 0, 100% calc(var(--notch-sm) - 1px), 100% 100%, calc(var(--notch-sm) - 1px) 100%, 0 calc(100% - var(--notch-sm) + 1px));
--ease: cubic-bezier(0.2, 0, 0.38, 0.9);
--font-body: 'Zen Kaku Gothic New', 'Hiragino Sans', 'Yu Gothic', 'Noto Sans JP', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
--font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Consolas, 'Liberation Mono', monospace;
}
*, *::before, *::after { box-sizing: border-box; }
html { background: var(--bg); }
body {
margin: 0;
min-height: 100vh;
min-height: 100dvh;
display: grid;
place-items: center;
padding: 3rem 1.25rem;
color: var(--text);
font-family: var(--font-body);
font-weight: 500;
font-size: 1rem;
line-height: 1.5rem;
-webkit-font-smoothing: antialiased;
}
h1, h2, p, ul { margin: 0; }
::selection { background: #c4245f; color: #fff; }
:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
/* Decoration behind the page: the uroko scale pattern, film grain and a few sakura petals. */
.backdrop {
position: fixed;
inset: 0;
z-index: -1;
pointer-events: none;
overflow: hidden;
background:
radial-gradient(1000px 700px at 78% -8%, var(--glow-1), transparent 62%),
radial-gradient(900px 800px at 4% 108%, var(--glow-2), transparent 60%),
linear-gradient(180deg, var(--bg) 0%, var(--bg-2) 55%, var(--bg) 100%);
}
.backdrop::before {
content: '';
position: absolute;
inset: 0;
opacity: 0.5;
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='40' viewBox='0 0 46 40'%3E%3Cpath d='M23 40 L0 8 L46 8 Z' fill='none' stroke='%23808080' stroke-opacity='.10' stroke-width='1'/%3E%3C/svg%3E") 0 0 / 46px 40px;
-webkit-mask-image: radial-gradient(120% 90% at 50% 0%, #000 20%, transparent 78%);
mask-image: radial-gradient(120% 90% at 50% 0%, #000 20%, transparent 78%);
}
.backdrop::after {
content: '';
position: absolute;
inset: 0;
opacity: 0.05;
mix-blend-mode: overlay;
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
}
.petal {
position: absolute;
top: -2rem;
left: var(--x);
width: var(--s, 12px);
height: var(--s, 12px);
border-radius: 150% 0 150% 0;
background: var(--sakura);
opacity: 0.55;
animation: fall var(--d, 22s) linear var(--delay, 0s) infinite, sway 5.5s cubic-bezier(0.42, 0, 0.58, 1) infinite alternate;
}
.petal:nth-child(1) { --x: 8%; --s: 11px; --d: 24s; --delay: -3s; }
.petal:nth-child(2) { --x: 22%; --s: 8px; --d: 19s; --delay: -11s; }
.petal:nth-child(3) { --x: 37%; --s: 13px; --d: 27s; --delay: -18s; }
.petal:nth-child(4) { --x: 55%; --s: 9px; --d: 21s; --delay: -6s; }
.petal:nth-child(5) { --x: 68%; --s: 12px; --d: 25s; --delay: -14s; }
.petal:nth-child(6) { --x: 81%; --s: 7px; --d: 18s; --delay: -9s; }
.petal:nth-child(7) { --x: 93%; --s: 10px; --d: 23s; --delay: -20s; }
@keyframes fall { to { top: 105%; rotate: 540deg; } }
@keyframes sway { from { translate: -18px 0; } to { translate: 18px 0; } }
@media (prefers-reduced-motion: reduce) { .petal { display: none; } }
main {
width: 100%;
max-width: 38rem;
display: flex;
flex-direction: column;
gap: 1rem;
}
/* The brand line: the seal and the two-tone wordmark. */
.brand { display: flex; align-items: center; gap: 0.75rem; padding-inline: 0.25rem; }
.seal { width: 2.25rem; height: 2.25rem; flex: none; filter: drop-shadow(0 4px 10px light-dark(rgba(168, 18, 76, 0.25), rgba(0, 0, 0, 0.5))); }
.wordmark { font-size: 1.25rem; line-height: 1.75rem; font-weight: 900; letter-spacing: 0.02em; }
.ink { color: var(--text); text-shadow: var(--text-shadow-brand); }
.pink { color: var(--accent); text-shadow: var(--text-shadow-brand); }
.brand-sep { width: 1px; align-self: stretch; margin-block: 0.25rem; background: var(--edge); }
.brand-note {
font-family: var(--font-mono);
font-size: 0.75rem;
line-height: 1rem;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--text-quiet);
}
/* Notched glass panels: a 1px frame cut at two corners, filled with the panel gradient. */
.card {
position: relative;
isolation: isolate;
display: flex;
flex-direction: column;
gap: 1.25rem;
padding: 2.25rem 2rem 2rem;
filter: drop-shadow(0 8px 24px light-dark(rgba(60, 40, 50, 0.08), rgba(0, 0, 0, 0.45)));
}
.card::before, .card::after { content: ''; position: absolute; z-index: -1; pointer-events: none; }
.card::before { inset: 0; background: var(--edge); clip-path: var(--clip-notch); transition: background-color 240ms var(--ease); }
.card::after { inset: 1px; background: var(--panel-bg); clip-path: var(--clip-notch-inner); }
.card:hover::before { background: var(--edge-strong); }
.eyebrow {
display: flex;
align-items: center;
gap: 0.75rem;
font-family: var(--font-mono);
font-size: 0.75rem;
line-height: 1rem;
font-weight: 700;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--text-quiet);
}
.eyebrow::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, var(--edge), transparent); }
.eyebrow-mark { width: 0.5rem; height: 0.5rem; flex: none; background: var(--ornament); rotate: 45deg; }
h1 {
font-size: clamp(1.75rem, 1.2rem + 2.2vw, 2.625rem);
line-height: 1.08;
font-weight: 900;
letter-spacing: 0.02em;
text-transform: uppercase;
color: var(--text);
text-wrap: balance;
}
h1 .pink { text-shadow: none; }
.lede { font-size: 1.0625rem; line-height: 1.625rem; color: var(--text-subtle); max-width: 34rem; text-wrap: pretty; }
.actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.75rem 1.25rem; }
.address {
font-family: var(--font-mono);
font-size: 0.8125rem;
line-height: 1rem;
letter-spacing: 0.04em;
color: var(--accent-strong);
}
/* Buttons: a notched frame and a fill; the accent sweep fills from the left on hover. */
.btn {
--btn-edge: var(--edge-strong);
--btn-fill: var(--surface);
--btn-text: var(--text-2);
--sweep: 0%;
--sweep-a-now: rgba(35, 25, 45, 0);
position: relative;
isolation: isolate;
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.625rem;
min-height: 3rem;
padding: 0 1.5rem;
color: var(--btn-text);
font-weight: 900;
font-size: 0.875rem;
line-height: 1rem;
letter-spacing: 0.08em;
text-transform: uppercase;
text-decoration: none;
white-space: nowrap;
transition: color 240ms var(--ease), transform 150ms var(--ease), filter 240ms var(--ease);
}
.btn::before, .btn::after { content: ''; position: absolute; z-index: -1; pointer-events: none; }
.btn::before { inset: 0; background: var(--btn-edge); clip-path: var(--clip-notch-sm); transition: background-color 240ms var(--ease); }
.btn::after {
inset: 1px;
clip-path: var(--clip-notch-sm-inner);
background: linear-gradient(100deg, var(--sweep-a), var(--sweep-b)) no-repeat 0 0 / var(--sweep) 100%, var(--btn-fill);
transition: background-size 420ms cubic-bezier(0.2, 0.9, 0.25, 1);
}
.btn:is(:hover, :focus-visible) { --sweep: 100%; --btn-edge: var(--sweep-b); color: var(--on-fill); }
.btn:hover { transform: translateY(-2px); filter: drop-shadow(0 10px 14px rgba(196, 42, 102, 0.35)); }
.btn:active { transform: translateY(0) scale(0.985); filter: none; }
.btn-primary { --sweep: 100%; --btn-edge: var(--sweep-b); --btn-text: var(--on-fill); }
.btn-primary:hover { --btn-edge: light-dark(#7a0f42, #ff9fc0); }
.btn svg { width: 1.125rem; height: 1.125rem; flex: none; transition: translate 240ms var(--ease); }
.btn:hover svg { translate: 3px 0; }
/* The NadeKloud panel. */
.card-head {
display: flex;
align-items: center;
gap: 0.75rem;
margin: -1.75rem -2rem 0;
padding: 1rem 2rem;
border-bottom: 1px solid var(--hairline);
}
.card-kicker { width: 1.5rem; height: 1.5rem; flex: none; color: var(--kicker); }
.card-title {
font-size: 0.9375rem;
line-height: 1.375rem;
font-weight: 900;
letter-spacing: 0.08em;
text-transform: uppercase;
}
.card-aside {
margin-inline-start: auto;
font-family: var(--font-mono);
font-size: 0.75rem;
line-height: 1rem;
letter-spacing: 0.06em;
text-transform: uppercase;
color: var(--text-quiet);
}
.hosted { padding-top: 1.75rem; }
.hosted p { color: var(--text-subtle); text-wrap: pretty; }
.hosted strong { color: var(--text); font-weight: 700; }
/* Small links: notched mono tags. */
nav { display: flex; flex-direction: column; gap: 0.75rem; padding: 0.5rem 0.25rem 0; }
nav h2 {
font-family: var(--font-mono);
font-size: 0.75rem;
line-height: 1rem;
font-weight: 700;
letter-spacing: 0.1em;
text-transform: uppercase;
color: var(--text-quiet);
}
nav ul { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5rem; }
.tag {
position: relative;
isolation: isolate;
display: inline-flex;
align-items: center;
gap: 0.5rem;
min-height: 2.25rem;
padding: 0 0.875rem;
color: var(--text-2);
font-family: var(--font-mono);
font-size: 0.8125rem;
line-height: 1rem;
letter-spacing: 0.02em;
text-decoration: none;
transition: color 150ms var(--ease);
}
.tag::before, .tag::after { content: ''; position: absolute; z-index: -1; pointer-events: none; }
.tag::before { inset: 0; background: var(--edge); clip-path: polygon(0 0, calc(100% - 0.4375rem) 0, 100% 0.4375rem, 100% 100%, 0.4375rem 100%, 0 calc(100% - 0.4375rem)); transition: background-color 150ms var(--ease); }
.tag::after { inset: 1px; background: var(--surface-quiet); clip-path: polygon(0 0, calc(100% - 0.4375rem + 1px) 0, 100% calc(0.4375rem - 1px), 100% 100%, calc(0.4375rem - 1px) 100%, 0 calc(100% - 0.4375rem + 1px)); }
.tag:is(:hover, :focus-visible) { color: var(--accent-strong); }
.tag:is(:hover, :focus-visible)::before { background: var(--accent); }
.tag svg { width: 0.875rem; height: 0.875rem; flex: none; color: var(--kicker); }
@media (max-width: 30rem) {
body { padding: 1.5rem 0.875rem; place-items: start center; }
.card { padding: 1.75rem 1.25rem 1.5rem; }
.card-head { margin: -1.25rem -1.25rem 0; padding: 0.875rem 1.25rem; }
.hosted { padding-top: 1.25rem; }
.card-aside { display: none; }
.actions .btn { width: 100%; }
.tag { min-height: 2.75rem; }
}
@media (prefers-reduced-motion: reduce) {
.btn, .btn::after, .btn svg, .card::before { transition: none; }
.btn:hover { transform: none; }
.btn:hover svg { translate: none; }
}
@media (forced-colors: active) {
.card, .btn, .tag { border: 1px solid CanvasText; }
.card::before, .card::after, .btn::before, .btn::after, .tag::before, .tag::after { display: none; }
}
</style>
</head>
<body>
<div class="backdrop" aria-hidden="true">
<span class="petal"></span><span class="petal"></span><span class="petal"></span><span class="petal"></span><span class="petal"></span><span class="petal"></span><span class="petal"></span>
</div>
<main>
<div class="brand">
<svg class="seal" viewBox="0 0 32 32" aria-hidden="true">
<defs>
<linearGradient id="seal-fill" x1="5" y1="-3" x2="27" y2="35" gradientUnits="userSpaceOnUse">
<stop offset="0" stop-color="#e0457e"/>
<stop offset="1" stop-color="#a8124c"/>
</linearGradient>
</defs>
<path d="M0 0H32V24.96L24.96 32H0Z" fill="url(#seal-fill)"/>
<g transform="translate(16 16) scale(1.3) translate(-12 -12)" fill="#fff" fill-opacity=".55" stroke="#fff" stroke-width="1.6" stroke-linecap="round" stroke-linejoin="round">
<path d="M12 11.6L10 6.4L10.7 5.2L11.4 6L12 4.8L12.6 6L13.3 5.2L14 6.4Z"/>
<path transform="rotate(72 12 12)" d="M12 11.6L10 6.4L10.7 5.2L11.4 6L12 4.8L12.6 6L13.3 5.2L14 6.4Z"/>
<path transform="rotate(144 12 12)" d="M12 11.6L10 6.4L10.7 5.2L11.4 6L12 4.8L12.6 6L13.3 5.2L14 6.4Z"/>
<path transform="rotate(216 12 12)" d="M12 11.6L10 6.4L10.7 5.2L11.4 6L12 4.8L12.6 6L13.3 5.2L14 6.4Z"/>
<path transform="rotate(288 12 12)" d="M12 11.6L10 6.4L10.7 5.2L11.4 6L12 4.8L12.6 6L13.3 5.2L14 6.4Z"/>
<circle cx="12" cy="12" r="1.4" fill-opacity="1" stroke="none"/>
</g>
</svg>
<span class="wordmark"><span class="ink">Nadeko</span><span class="pink">Bot</span></span>
<span class="brand-sep" aria-hidden="true"></span>
<span class="brand-note">Docs</span>
</div>
<section class="card" aria-labelledby="title">
<p class="eyebrow"><span class="eyebrow-mark" aria-hidden="true"></span>NadekoBot v5 docs</p>
<h1 id="title">The docs have <span class="pink">moved</span></h1>
<p class="lede">The old NadekoBot v5 docs are no longer online. The current docs have all the guides.</p>
<div class="actions">
<a class="btn btn-primary" href="https://docs.nadeko.bot/">
Open the current docs
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
</a>
<span class="address">docs.nadeko.bot</span>
</div>
</section>
<section class="card hosted" aria-labelledby="hosted-title">
<div class="card-head">
<svg class="card-kicker" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
<path d="M7 18.5h10.5a4 4 0 0 0 .6-7.96A6 6 0 0 0 6.6 9.1 4.75 4.75 0 0 0 7 18.5Z" fill="currentColor" fill-opacity=".2"/>
</svg>
<h2 class="card-title" id="hosted-title"><span class="ink">nade</span><span class="pink">kloud</span></h2>
<span class="card-aside">Hosted NadekoBot</span>
</div>
<p>Want your own bot without the setup? <strong>NadeKloud</strong> runs your NadekoBot for you. You do not install anything or edit config files.</p>
<div class="actions">
<a class="btn" href="https://cloud.nadeko.bot/">
Try NadeKloud
<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 12h14M13 6l6 6-6 6"/></svg>
</a>
</div>
</section>
<nav aria-labelledby="links-title">
<h2 id="links-title">Other links</h2>
<ul>
<li><a class="tag" href="https://nadeko.bot/commands"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M4 17l6-5-6-5M12 19h8"/></svg>Commands list</a></li>
<li><a class="tag" href="https://invite.nadeko.bot/"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M12 5v14M5 12h14"/></svg>Invite the public bot</a></li>
<li><a class="tag" href="https://github.com/nadeko-bot/nadekobot"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M8 7l-5 5 5 5M16 7l5 5-5 5"/></svg>Source code</a></li>
<li><a class="tag" href="https://discord.nadeko.bot/"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M5 5h14v10H10l-5 4V5Z"/></svg>Support server</a></li>
</ul>
</nav>
</main>
</body>
</html>