178 lines
7.6 KiB
HTML
178 lines
7.6 KiB
HTML
<!doctype html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width,initial-scale=1,viewport-fit=cover">
|
||
<title>Монтана</title>
|
||
<meta name="theme-color" content="#0c0a08">
|
||
<meta name="apple-mobile-web-app-title" content="Монтана">
|
||
<meta name="apple-mobile-web-app-capable" content="yes">
|
||
<link rel="icon" type="image/svg+xml" href="/messenger/favicon.svg">
|
||
<link rel="icon" type="image/png" sizes="32x32" href="/messenger/favicon-32.png">
|
||
<link rel="apple-touch-icon" sizes="180x180" href="/messenger/apple-touch-icon.png">
|
||
<style>
|
||
:root {
|
||
--bg: #0c0a08;
|
||
--bg-soft: #14110d;
|
||
--bg-card: #1a1612;
|
||
--bg-hover: #221c16;
|
||
--line: #2a2520;
|
||
--ink: #e8e0d0;
|
||
--ink-mute: #8a8175;
|
||
--ink-faint: #4a443c;
|
||
--gold: #ca9335;
|
||
--gold-soft: #d9a755;
|
||
--gold-deep: #8e6824;
|
||
color-scheme: dark;
|
||
}
|
||
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; margin: 0; padding: 0; }
|
||
html, body { background: var(--bg); color: var(--ink); min-height: 100%; }
|
||
body {
|
||
font-family: -apple-system, "SF Pro Text", Inter, system-ui, sans-serif;
|
||
line-height: 1.5; -webkit-font-smoothing: antialiased;
|
||
text-rendering: optimizeLegibility; min-height: 100dvh;
|
||
}
|
||
.wrap {
|
||
max-width: 720px; margin: 0 auto;
|
||
padding: 2.5rem 1.25rem 4rem;
|
||
display: flex; flex-direction: column; align-items: stretch;
|
||
}
|
||
header { display: flex; flex-direction: column; align-items: center; gap: 0.5rem; margin-bottom: 1.5rem; }
|
||
.symbol {
|
||
font-family: ui-serif, Georgia, serif; font-size: 4.5rem; line-height: 1;
|
||
color: var(--gold); text-shadow: 0 0 60px rgba(202,147,53,0.25);
|
||
}
|
||
h1 {
|
||
font-family: ui-serif, Georgia, "Source Serif Pro", Charter, serif;
|
||
font-size: 2.25rem; font-weight: 500; color: var(--gold);
|
||
letter-spacing: 0.04em; line-height: 1;
|
||
}
|
||
.tagline {
|
||
text-align: center; color: var(--ink);
|
||
font-family: ui-serif, Georgia, serif; font-size: 1.0625rem;
|
||
margin: 0.25rem auto 0; max-width: 28rem; letter-spacing: 0.005em;
|
||
}
|
||
.tagline small { display: block; color: var(--ink-mute); font-size: 0.8125rem; margin-top: 0.5rem; letter-spacing: 0.04em; }
|
||
|
||
.grid { display: grid; grid-template-columns: 1fr; gap: 0.875rem; margin-top: 1.5rem; }
|
||
@media (min-width: 560px) { .grid { grid-template-columns: 1fr 1fr; } }
|
||
|
||
.service {
|
||
background: var(--bg-card); border: 1px solid var(--line);
|
||
border-radius: 0.875rem; padding: 1.125rem 1.25rem;
|
||
text-decoration: none; color: var(--ink);
|
||
display: flex; align-items: flex-start; gap: 0.875rem;
|
||
transition: border-color 0.15s, background 0.15s, transform 0.12s;
|
||
position: relative; overflow: hidden;
|
||
}
|
||
.service:hover { border-color: var(--gold-deep); background: var(--bg-hover); }
|
||
.service:active { transform: scale(0.99); }
|
||
.service .icon {
|
||
width: 2.75rem; height: 2.75rem; flex-shrink: 0;
|
||
border-radius: 0.625rem;
|
||
background: var(--bg-soft); border: 1px solid var(--gold-deep);
|
||
color: var(--gold);
|
||
display: flex; align-items: center; justify-content: center;
|
||
font-family: ui-serif, Georgia, serif; font-size: 1.5rem; font-weight: 600;
|
||
}
|
||
.service .body { flex: 1; min-width: 0; }
|
||
.service .name {
|
||
font-family: ui-serif, Georgia, serif; font-size: 1.125rem;
|
||
color: var(--gold); font-weight: 500; letter-spacing: 0.01em;
|
||
margin-bottom: 0.125rem;
|
||
}
|
||
.service .desc { color: var(--ink-mute); font-size: 0.8125rem; line-height: 1.45; }
|
||
.service .arrow {
|
||
align-self: center; color: var(--gold-deep); font-size: 1.25rem;
|
||
transition: transform 0.15s, color 0.15s;
|
||
}
|
||
.service:hover .arrow { transform: translateX(3px); color: var(--gold); }
|
||
|
||
footer {
|
||
margin-top: 2rem; padding-top: 1.5rem;
|
||
border-top: 1px solid var(--line);
|
||
display: flex; flex-direction: column; gap: 0.625rem;
|
||
text-align: center; color: var(--ink-mute); font-size: 0.8125rem;
|
||
}
|
||
footer a { color: var(--gold-deep); text-decoration: none; }
|
||
footer a:hover { color: var(--gold); }
|
||
footer .row { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.875rem; }
|
||
|
||
.join { margin-top: 1.5rem; padding: 1.25rem; background: var(--bg-card); border: 1px solid var(--line); border-radius: 0.875rem; display: flex; flex-direction: column; gap: 0.5rem; align-items: stretch; }
|
||
.join-title { font-family: ui-serif, Georgia, serif; font-size: 1.25rem; color: var(--gold); font-weight: 500; letter-spacing: 0.01em; }
|
||
.join-sub { color: var(--ink-mute); font-size: 0.875rem; margin: 0; }
|
||
.join-cmd { padding: 0.75rem 0.875rem; background: var(--bg-soft); border: 1px solid var(--line); border-radius: 0.5rem; color: var(--gold-soft); font-family: ui-monospace, Menlo, monospace; font-size: 0.8125rem; word-break: break-all; user-select: all; }
|
||
.join-copy { align-self: flex-start; padding: 0.5rem 0.875rem; border: 1px solid var(--gold-deep); border-radius: 0.5rem; background: transparent; color: var(--gold); font-family: inherit; font-size: 0.8125rem; cursor: pointer; transition: background 0.15s; }
|
||
.join-copy:hover { background: var(--bg-hover); }
|
||
.join-hint { color: var(--ink-faint); font-size: 0.75rem; margin: 0; font-style: italic; }
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="wrap">
|
||
<header>
|
||
<div class="symbol">Ɉ</div>
|
||
<h1>Монтана</h1>
|
||
<div class="tagline">
|
||
Сеть городов, доверяющих друг другу.
|
||
<small>Сервисы протокола Montana</small>
|
||
</div>
|
||
</header>
|
||
|
||
<div class="grid">
|
||
<a class="service" href="/vpn/">
|
||
<div class="icon">⛨</div>
|
||
<div class="body">
|
||
<div class="name">ВПН</div>
|
||
<div class="desc">Защищённый интернет через узлы Montana</div>
|
||
</div>
|
||
<div class="arrow">→</div>
|
||
</a>
|
||
|
||
<a class="service" href="/messenger/">
|
||
<div class="icon">✉</div>
|
||
<div class="body">
|
||
<div class="name">Чаты</div>
|
||
<div class="desc">Шифрованный мессенджер с входом по 24 словам</div>
|
||
</div>
|
||
<div class="arrow">→</div>
|
||
</a>
|
||
<a class="service" href="https://hub.montana.quest/">
|
||
<div class="icon">⌬</div>
|
||
<div class="body">
|
||
<div class="name">Хаб</div>
|
||
<div class="desc">Открытый репозиторий протокола</div>
|
||
</div>
|
||
<div class="arrow">→</div>
|
||
</a>
|
||
|
||
<a class="service" href="/net/">
|
||
<div class="icon">⌘</div>
|
||
<div class="body">
|
||
<div class="name">Сеть</div>
|
||
<div class="desc">Карта узлов и состояние протокола</div>
|
||
</div>
|
||
<div class="arrow">→</div>
|
||
</a>
|
||
</div>
|
||
|
||
|
||
<section class="join">
|
||
<h2 class="join-title">Свой узел</h2>
|
||
<p class="join-sub">Поднимите зеркало Montana на своём сервере одной командой.</p>
|
||
<div class="join-cmd" id="joinCmd">curl -sL https://montana.quest/install.sh | sudo bash</div>
|
||
<button class="join-copy" onclick="(async()=>{try{await navigator.clipboard.writeText(document.getElementById('joinCmd').textContent);this.textContent='Скопировано';setTimeout(()=>this.textContent='Скопировать',1800)}catch(e){}})()">Скопировать</button>
|
||
<p class="join-hint">После установки — сообщите свой IP, и узел появится в DNS round-robin.</p>
|
||
</section>
|
||
|
||
<footer>
|
||
<div class="row">
|
||
<a href="/explorer/">Эксплорер</a>
|
||
<a href="/privacy">Приватность</a>
|
||
<a href="/humans.txt">humans.txt</a>
|
||
</div>
|
||
<div>Алик Монтана · Genesis 9.01.2026</div>
|
||
</footer>
|
||
</div>
|
||
</body>
|
||
</html>
|