init
This commit is contained in:
commit
b077c353a5
582
index.html
Normal file
582
index.html
Normal file
@ -0,0 +1,582 @@
|
||||
<html lang="ru" data-bs-theme="dark"><head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<meta name="description" content="Основная информация о подписке и способах подключения">
|
||||
<link rel="icon" type="image/x-icon" href="https://google.com/pic.png">
|
||||
<title></title>
|
||||
|
||||
<!-- Set the theme at the very beginning, so as not to scare a user with a white screen while loading the page on slow devices -->
|
||||
<script type="text/javascript">
|
||||
|
||||
function calculateSettingAsThemeString({ localStorageTheme, systemSettingDark }) {
|
||||
if (localStorageTheme !== null) {
|
||||
return localStorageTheme
|
||||
}
|
||||
if (systemSettingDark.matches) {
|
||||
return "dark"
|
||||
}
|
||||
return "light"
|
||||
}
|
||||
|
||||
function setTheme(newTheme) {
|
||||
document.documentElement.setAttribute('data-bs-theme', newTheme)
|
||||
localStorage.setItem("theme", newTheme);
|
||||
currentThemeSetting = newTheme;
|
||||
}
|
||||
|
||||
const localStorageTheme = localStorage.getItem("theme");
|
||||
const systemSettingDark = window.matchMedia("(prefers-color-scheme: dark)");
|
||||
let currentThemeSetting = calculateSettingAsThemeString({ localStorageTheme, systemSettingDark });
|
||||
|
||||
setTheme(currentThemeSetting)
|
||||
|
||||
</script>
|
||||
|
||||
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN" crossorigin="anonymous">
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.min.js" integrity="sha384-BBtl+eGJRgqQAUMxJ7pMwbEyER4l1g+O15P+16Ep7Q9Q+zqX6gSbd85u4mG4QzX+" crossorigin="anonymous"></script>
|
||||
|
||||
<script>
|
||||
const expireDateInit = "{% if not user.expire %}∞{% else %}{% set current_timestamp = now().timestamp() %}{{ user.expire | datetime }}{% endif %}";
|
||||
const dataLimit = "{% if not user.data_limit %}∞{% else %}{{ user.data_limit }}{% endif %}";
|
||||
const dataUsed = "{{ user.used_traffic }}";
|
||||
var tmpUsage = ((parseFloat(dataUsed) / parseFloat(dataLimit)) * 100).toFixed(2);
|
||||
var isActive = "{{ user.status.value == 'active' }}"
|
||||
if (tmpUsage > 100) tmpUsage = 100;
|
||||
const dataUsage = dataLimit == "∞" ? 100 : tmpUsage;
|
||||
const dataChartColor = dataUsage < 40 ? "bg-green-500" : dataUsage < 80 ? "bg-yellow-600" : "bg-red-500";
|
||||
const resetInterval = "{{ user.data_limit_reset_strategy.value }}";
|
||||
let expireDateVar = expireDateInit.includes("∞") ? "∞" : new Date(expireDateInit).toLocaleString("en-GB");
|
||||
|
||||
</script>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- <header>
|
||||
<h1><img id="logo" src="/www/logo.png">Logo</h1>
|
||||
</header> -->
|
||||
|
||||
<main>
|
||||
<div class="modules">
|
||||
<div class="module subscription">
|
||||
<h2 class="module-title">SecureWay VPN</h2>
|
||||
<ul class="list-group list-group-flush">
|
||||
<li class="list-group-item d-flex justify-content-between align-items-center">
|
||||
Имя пользователя<span>{{ user.username }}</span>
|
||||
</li>
|
||||
<li class="list-group-item d-flex justify-content-between align-items-center">
|
||||
Статус подписки<span id="activestatus"></span>
|
||||
</li>
|
||||
<script>
|
||||
var a = document.getElementById("activestatus")
|
||||
if (isActive) {
|
||||
a.innerHTML = '<div class="dot dot-green"></div>Активна'
|
||||
} else {
|
||||
a.innerHTML = '<div class="dot dot-red"></div>Неактивна'
|
||||
}
|
||||
</script>
|
||||
<li class="list-group-item d-flex justify-content-between align-items-center">
|
||||
Трафик<span id="used">0 GB / 100 GB</span>
|
||||
<script>
|
||||
if (dataLimit == "∞") {
|
||||
document.getElementById("used").innerHTML = `∞ GB`
|
||||
} else {
|
||||
document.getElementById("used").innerHTML = `${dataUsed} GB / ${dataLimit} GB`
|
||||
} </script>
|
||||
</li>
|
||||
<li class="list-group-item d-flex justify-content-between align-items-center" x-init="Alpine.data( 'expireDate', expireDate = expireDateVar )">
|
||||
Истекает<span id="expire">09.08.2024 20:59:59</span><script>document.getElementById('expire').innerHTML = expireDateVar</script>
|
||||
</li>
|
||||
<li class="list-group-item d-flex justify-content-between align-items-center">
|
||||
<a href="https://t.me/SecureWayVPN_Bot" target="_blank" class="link-dark" rel="noopener noreferrer">Продление подписки, поддержка</a>
|
||||
<a href="https://t.me/SecureWayVPN_Bot" target="_blank" class="link-dark" rel="noopener noreferrer">
|
||||
<span>
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewport="" width="24px" height="24px" viewBox="0 0 50 50">
|
||||
<path d="M25,2c12.703,0,23,10.297,23,23S37.703,48,25,48S2,37.703,2,25S12.297,2,25,2z M32.934,34.375 c0.423-1.298,2.405-14.234,2.65-16.783c0.074-0.772-0.17-1.285-0.648-1.514c-0.578-0.278-1.434-0.139-2.427,0.219 c-1.362,0.491-18.774,7.884-19.78,8.312c-0.954,0.405-1.856,0.847-1.856,1.487c0,0.45,0.267,0.703,1.003,0.966 c0.766,0.273,2.695,0.858,3.834,1.172c1.097,0.303,2.346,0.04,3.046-0.395c0.742-0.461,9.305-6.191,9.92-6.693 c0.614-0.502,1.104,0.141,0.602,0.644c-0.502,0.502-6.38,6.207-7.155,6.997c-0.941,0.959-0.273,1.953,0.358,2.351 c0.721,0.454,5.906,3.932,6.687,4.49c0.781,0.558,1.573,0.811,2.298,0.811C32.191,36.439,32.573,35.484,32.934,34.375z">
|
||||
</path>
|
||||
</svg></span></a>
|
||||
</li>
|
||||
<!-- li style="height: 45px;" class="list-group-item d-flex align-items-center">
|
||||
<button style="padding: 0;" type="button" class="btn btn-link link-dark" onclick="copyToClipboard(['vless://d82e8c9f-c71b-4c59-bec7-4ff4d172f993@176.123.1.241:443?security=reality&type=tcp&headerType=&flow=xtls-rprx-vision&path=&host=&sni=hipstrumentals.com&fp=chrome&pbk=SbVKOEMjK0sIlbwg4akyBg5mL5KZwwB-ed4eEE7YnRc&sid=&spx=#%F0%9F%90%A7%F0%9F%87%B2%F0%9F%87%A9%20MD%7CZP%20Username%3A%20PenguinVPN_Rescue_key']); showNotification('toast');">Скопировать подписку</button>
|
||||
<div id="toast">Подписка скопирована</div>
|
||||
</li -->
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="module">
|
||||
<h3 class="module-title">Подключение</h3>
|
||||
<div class="accordion accordion-flush" id="accordionApps">
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="flush-heading-apps-android">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapse-apps-android" aria-expanded="false" aria-controls="flush-collapse-apps-android">Android</button>
|
||||
</h2>
|
||||
<div id="flush-collapse-apps-android" class="accordion-collapse collapse" aria-labelledby="flush-heading-apps-android" data-bs-parent="#accordionApps" style="">
|
||||
<div class="accordion-body">
|
||||
<h3>v2rayNG</h3>
|
||||
v2rayNG - рекомендуемое приложение для Android
|
||||
|
||||
<div class="list-group list-group-flush">
|
||||
<a href="https://play.google.com/store/apps/details?id=com.v2ray.ang" class="link list-group-item list-group-item-action" target="_blank">
|
||||
<span>Скачать в Google Play</span>
|
||||
<div class="link-icon">
|
||||
<svg class="icon" width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd"><path d="M21.883 12l-7.527 6.235.644.765 9-7.521-9-7.479-.645.764 7.529 6.236h-21.884v1h21.883z"></path></svg>
|
||||
</div>
|
||||
</a>
|
||||
<a id="v2rayl" href="v2rayng://install-config?url=" target="_blank" class="self-link link list-group-item list-group-item-action">
|
||||
<span>Добавить подписку</span>
|
||||
<div class="link-icon">
|
||||
<svg class="icon" width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd"><path d="M21.883 12l-7.527 6.235.644.765 9-7.521-9-7.479-.645.764 7.529 6.236h-21.884v1h21.883z"></path></svg>
|
||||
</div>
|
||||
</a>
|
||||
<script>
|
||||
var a = document.getElementById('v2rayl');
|
||||
a.href = "v2rayng://install-config?url=" + window.location.href + "#Title";
|
||||
</script>
|
||||
</div>
|
||||
|
||||
<div class="instructions">
|
||||
<h6 class="instructions-title">Инструкция по подключению</h6>
|
||||
<p>1. Нажмите "Скачать в Google Play", чтобы установить приложение.</p>
|
||||
<p>2. Вернитесь на эту страницу и нажмите "Добавить подписку".</p>
|
||||
<p>3. В приложении нажмите на три вертикальных точки и выберите "Обновить подписку".
|
||||
<img class="img-fluid rounded img-help" src="https://i.postimg.cc/V6Jqv0qF/photo-5294201900410983789-y.jpg"></p>
|
||||
<!-- p><img class="img-fluid rounded img-help" src="https://i.postimg.cc/W1Vw83V2/update.jpg"></p -->
|
||||
<p>4. Готово, подключайтесь! Кнопка подключения в приложении в правом нижнем углу.</p>
|
||||
<p></p><p><img class="img-fluid rounded img-help" src="https://i.postimg.cc/pybp2pCy/connect.jpg"></p>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="flush-heading-apps-ios">
|
||||
<button class="accordion-button collapsed lh0" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapse-apps-ios" aria-expanded="false" aria-controls="flush-collapse-apps-ios">IOS</button>
|
||||
</h2>
|
||||
<div id="flush-collapse-apps-ios" class="accordion-collapse collapse" aria-labelledby="flush-heading-apps-ios" data-bs-parent="#accordionApps">
|
||||
<div class="accordion-body">
|
||||
<h3>HAPP</h3>
|
||||
HAPP - рекомендуемое приложение для IOS 14+
|
||||
<div class="list-group list-group-flush">
|
||||
<a href="https://apps.apple.com/ru/app/happ-proxy-utility-plus/id6746188973" target="_blank" class="link list-group-item list-group-item-action">
|
||||
<span>Скачать в AppStore</span>
|
||||
<div class="link-icon">
|
||||
<svg class="icon" width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd"><path d="M21.883 12l-7.527 6.235.644.765 9-7.521-9-7.479-.645.764 7.529 6.236h-21.884v1h21.883z"></path></svg>
|
||||
</div>
|
||||
</a>
|
||||
<a id="linkFix" href="happ://add/" target="_blank" class="link list-group-item list-group-item-action">
|
||||
<span>Добавить подписку</span>
|
||||
<div class="link-icon">
|
||||
<svg class="icon" width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd"><path d="M21.883 12l-7.527 6.235.644.765 9-7.521-9-7.479-.645.764 7.529 6.236h-21.884v1h21.883z"></path></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<!-- For some reason js code doesn't work on Safari. The only quick fix I know -->
|
||||
<script>
|
||||
var a = document.getElementById('linkFix');
|
||||
a.href = "happ://add/" + window.location.href + "#SecureWay`";
|
||||
</script>
|
||||
</div>
|
||||
|
||||
<div class="instructions">
|
||||
<h6 class="instructions-title">Инструкция по подключению</h6>
|
||||
<p>1. Нажмите "Скачать в AppStore", чтобы установить приложение.</p>
|
||||
<p>2. Вернитесь на эту страницу и нажмите "Добавить подписку".</p>
|
||||
<p>3. Нажмите на большую кнопку включения и разрешите добавление конфигурации VPN
|
||||
<img class="img-fluid rounded img-help" src="https://i.postimg.cc/XJV879G0/image.png"></p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="flush-heading-apps-windows">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapse-apps-windows" aria-expanded="false" aria-controls="flush-collapse-apps-windows">Windows</button>
|
||||
</h2>
|
||||
<div id="flush-collapse-apps-windows" class="accordion-collapse collapse" aria-labelledby="flush-heading-apps-windows" data-bs-parent="#accordionApps">
|
||||
<div class="accordion-body">
|
||||
<h3>Hiddify</h3>
|
||||
Hiddify - рекомендуемое приложение для Windows. Кроме Windows его также можно установить на Android и Linux.
|
||||
|
||||
<div class="list-group list-group-flush">
|
||||
<a href="ms-windows-store://pdp?hl=ru-ru&gl=pl%2F&productid=9pdfnl3qv2s5" target="_blank" class="link list-group-item list-group-item-action">
|
||||
<span>Установить Hiddify</span>
|
||||
<div class="link-icon">
|
||||
<svg class="icon" width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd"><path d="M21.883 12l-7.527 6.235.644.765 9-7.521-9-7.479-.645.764 7.529 6.236h-21.884v1h21.883z"></path></svg>
|
||||
</div>
|
||||
</a>
|
||||
<a href="" id="hdflink" target="_blank" class="self-link link list-group-item list-group-item-action">
|
||||
<span>Добавить подписку</span>
|
||||
<div class="link-icon">
|
||||
<svg class="icon" width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd"><path d="M21.883 12l-7.527 6.235.644.765 9-7.521-9-7.479-.645.764 7.529 6.236h-21.884v1h21.883z"></path></svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
var a = document.getElementById('hdflink');
|
||||
a.href = "hiddify://install-sub/?url=" + window.location.href + "#Title";
|
||||
</script>
|
||||
|
||||
<div class="instructions">
|
||||
<h6 class="instructions-title">Инструкция по подключению</h6>
|
||||
<p>1. <b>Установите Hiddify</b> из Microsoft Store, нажав ссылку выше.</p>
|
||||
<p>2. <b>Добавьте подписку</b> в Hiddify, нажав ссылку выше. (Если при добавлении произойдет ошибка, используйте альтернативный способ: ключ. Он есть внизу этой страницы.)</p>
|
||||
<p>3. <b>Добавьте роутинг.</b> В настройках Hiddify смените язык на Русский, и укажите регион Россия. Тогда через VPN будут открываться только зарубежные сайты. Российские сайты будут открываться напрямую. Так удобнее и безопаснее.</p>
|
||||
<p>4. <b>Готово,</b> подключайтесь!</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="flush-heading-apps-macos">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapse-apps-macos" aria-expanded="false" aria-controls="flush-collapse-apps-macos">macOS</button>
|
||||
</h2>
|
||||
<div id="flush-collapse-apps-macos" class="accordion-collapse collapse" aria-labelledby="flush-heading-apps-macos" data-bs-parent="#accordionApps">
|
||||
<div class="accordion-body">
|
||||
<h3>V2Box</h3>
|
||||
V2Box - рекомендуемое приложение для macOS. Кроме macOS его также можно установить на iOS.
|
||||
|
||||
<div class="list-group list-group-flush">
|
||||
<a href="https://apps.apple.com/us/app/v2box-v2ray-client/id6446814690" target="_blank" class="link list-group-item list-group-item-action">
|
||||
<span>Скачать из Mac App Store</span>
|
||||
<div class="link-icon">
|
||||
<svg class="icon" width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd"><path d="M21.883 12l-7.527 6.235.644.765 9-7.521-9-7.479-.645.764 7.529 6.236h-21.884v1h21.883z"></path></svg>
|
||||
</div>
|
||||
</a>
|
||||
<a id="v2bi" href="v2box://install-sub?url=${fullUrl}&name=sub" target="_blank" class="self-link link list-group-item list-group-item-action">
|
||||
<span>Добавить подписку</span>
|
||||
<div class="link-icon">
|
||||
<svg class="icon" width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd"><path d="M21.883 12l-7.527 6.235.644.765 9-7.521-9-7.479-.645.764 7.529 6.236h-21.884v1h21.883z"></path></svg>
|
||||
</div>
|
||||
</a>
|
||||
<script>
|
||||
var a = document.getElementById("v2bi")
|
||||
a.href = "v2box://install-sub?url=" + window.location.href + "#Title"
|
||||
</script>
|
||||
<a href="v2box://routes?multi=W3sidHlwZSI6IkRvbWFpbiIsIm1hdGNoTW9kZSI6ImtleXdvcmQiLCJ0YWciOiJkaXJlY3QiLCJuYW1lIjoicm91dGUuRDM4OEU3MjMtOTJENS00QkJDLUFFNEItMzkyQkM0NTI3ODMyIiwibGlzdCI6WyJyZWdleHA6LipcXC5ydSQiXSwicmVtYXJrIjoiUlUtRGlyZWN0IiwiaXNFbmFibGUiOnRydWUsImxpc3RJUCI6WyJnZW9pcDpydSJdfSx7InJlbWFyayI6Ik1lc3NhZ2Vycy1kaXJlY3QiLCJ0YWciOiJkaXJlY3QiLCJpc0VuYWJsZSI6dHJ1ZSwibmFtZSI6InJvdXRlLkE2MDkwODQyLTVDMzYtNDJFMi1BMkI5LTdERjlEODA2ODM4NiIsImxpc3RJUCI6W10sIm1hdGNoTW9kZSI6ImtleXdvcmQiLCJ0eXBlIjoiRG9tYWluIiwibGlzdCI6WyJnZW9zaXRlOnRlbGVncmFtIiwiZ2Vvc2l0ZTp3aGF0c2FwcCIsImdlb3NpdGU6YXBwbGUiLCJnZW9zaXRlOml0dW5lcyIsImdlb3NpdGU6Z29vZ2xlIiwiZ2Vvc2l0ZTp5YW5kZXgiXX1d" target="_blank" class="self-link link list-group-item list-group-item-action">
|
||||
<span>Добавить роутинг</span>
|
||||
<div class="link-icon">
|
||||
<svg class="icon" width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd"><path d="M21.883 12l-7.527 6.235.644.765 9-7.521-9-7.479-.645.764 7.529 6.236h-21.884v1h21.883z"></path></svg>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
<div class="instructions">
|
||||
<h6 class="instructions-title">Инструкция по подключению</h6>
|
||||
<p>1. Нажмите "Скачать из Mac App Store", чтобы установить приложение.</p>
|
||||
<p>2. Вернитесь на эту страницу и нажмите "Добавить подписку".</p>
|
||||
<p>3. В приложении на вкладке Configs выберите добавленную подписку, нажав на неё.</p>
|
||||
<p>4. Готово, подключайтесь! Для этого на вкладке Home кликните Tap To Connect.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="flush-heading-apps-linux">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapse-apps-linux" aria-expanded="false" aria-controls="flush-collapse-apps-linux">Linux</button>
|
||||
</h2>
|
||||
<div id="flush-collapse-apps-linux" class="accordion-collapse collapse" aria-labelledby="flush-heading-apps-linux" data-bs-parent="#accordionApps">
|
||||
<div class="accordion-body">
|
||||
<h3>Hiddify</h3>
|
||||
Hiddify - рекомендуемое приложение для Linux
|
||||
|
||||
<div class="list-group list-group-flush">
|
||||
<a href="https://github.com/hiddify/hiddify-next/releases/latest/download/hiddify-linux-x64.zip" target="_blank" class="link list-group-item list-group-item-action">
|
||||
<span>Скачать с GitHub</span>
|
||||
<div class="link-icon">
|
||||
<svg class="icon" width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd"><path d="M21.883 12l-7.527 6.235.644.765 9-7.521-9-7.479-.645.764 7.529 6.236h-21.884v1h21.883z" /></svg>
|
||||
</div>
|
||||
</a>
|
||||
<a id="hdflink_lin" href="hiddify://install-sub/?url={link}#Title" target="_blank" class="self-link link list-group-item list-group-item-action">
|
||||
<span>Добавить подписку</span>
|
||||
<div class="link-icon">
|
||||
<svg class="icon" width="24" height="24" xmlns="http://www.w3.org/2000/svg" fill-rule="evenodd" clip-rule="evenodd"><path d="M21.883 12l-7.527 6.235.644.765 9-7.521-9-7.479-.645.764 7.529 6.236h-21.884v1h21.883z" /></svg>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<script>
|
||||
var a = document.getElementById("hdflink_lin")
|
||||
a.href = "hiddify://install-sub/?url=" + window.location.href + "#Title"
|
||||
</script>
|
||||
</div>
|
||||
|
||||
<div class="instructions">
|
||||
<h6 class="instructions-title">Инструкция по подключению</h6>
|
||||
<p>1. Нажмите Скачать с GitHub, чтобы установить приложение</p>
|
||||
<p>2. Смените язык на Русский, в качестве региона укажите Россия (это необходимо, чтобы настройки роутинга применились автоматически) и нажмите Начать</p>
|
||||
<p>3. Нажмите Добавить подписку</p>
|
||||
<p>4. Нажмите подключиться. Готово!</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="module">
|
||||
<h3 class="module-title">Справка</h3>
|
||||
<div class="accordion accordion-flush" id="accordionHelp">
|
||||
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="flush-heading-help-1">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapse-help-1" aria-expanded="false" aria-controls="flush-collapse-help-1">Что такое роутинг и для чего нужен?</button>
|
||||
</h2>
|
||||
<div id="flush-collapse-help-1" class="accordion-collapse collapse" aria-labelledby="flush-heading-help-1" data-bs-parent="#accordionHelp">
|
||||
<div class="accordion-body">
|
||||
Роутинг - это гибкие правила перенаправления трафика. Роутинг позволяет подключаться к зарубежным сайтам и приложениям через VPN, а к российским - напрямую. Так удобнее, безопаснее и расходуется меньше VPN-трафика. Роутинг доступен не во всех приложениях.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="flush-heading-help-2">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapse-help-2" aria-expanded="false" aria-controls="flush-collapse-help-2">Что такое подписка?</button>
|
||||
</h2>
|
||||
<div id="flush-collapse-help-2" class="accordion-collapse collapse" aria-labelledby="flush-heading-help-2" data-bs-parent="#accordionHelp" style="">
|
||||
<div class="accordion-body">
|
||||
Подписка - это ссылка в специальном формате, по которой приложение загружает с сервера данные, необходимые для подключения.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="flush-heading-help-3">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapse-help-3" aria-expanded="false" aria-controls="flush-collapse-help-3">Как продлить подписку?</button>
|
||||
</h2>
|
||||
<div id="flush-collapse-help-3" class="accordion-collapse collapse" aria-labelledby="flush-heading-help-3" data-bs-parent="#accordionHelp" style="">
|
||||
<div class="accordion-body">
|
||||
Вам необходимо иметь баланс в нашем <a href="https://t.me/SecureWayVPN_Bot" target="_blank" class="link-dark" rel="noopener noreferrer">сервисе</a>, равный сумме подписки.
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="accordion-item">
|
||||
<h2 class="accordion-header" id="flush-heading-help-4">
|
||||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#flush-collapse-help-4" aria-expanded="false" aria-controls="flush-collapse-help-4">Остались еще вопросы?</button>
|
||||
</h2>
|
||||
<div id="flush-collapse-help-4" class="accordion-collapse collapse" aria-labelledby="flush-heading-help-4" data-bs-parent="#accordionHelp">
|
||||
<div class="accordion-body">
|
||||
Мы рады ответить на них, если Вы напишете его в <a href="https://t.me/SecureWayVPN" target="_blank" class="link-dark" rel="noopener noreferrer">поддержку</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
<style>
|
||||
|
||||
html {
|
||||
margin: auto;
|
||||
max-width: 520px;
|
||||
min-width: 300px;
|
||||
padding: 0 25px 50px 25px;
|
||||
}
|
||||
|
||||
.dot {
|
||||
height: 10px;
|
||||
width: 10px;
|
||||
border-radius: 50%;
|
||||
display: inline-block;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.dot-red {
|
||||
background-color: #bf1d11;
|
||||
}
|
||||
|
||||
.dot-green {
|
||||
background-color: green;
|
||||
}
|
||||
|
||||
.dot-yellow {
|
||||
background-color: #ffbe0a;
|
||||
}
|
||||
|
||||
.app-icon {
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.img-help {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.subscription li {
|
||||
padding-top: 10px;
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
|
||||
.accordion-body .list-group {
|
||||
padding-bottom: 5px;
|
||||
}
|
||||
|
||||
.accordion,
|
||||
.subscription .list-group {
|
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
|
||||
border-radius: 15px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.accordion .list-group {
|
||||
padding-top: 25px;
|
||||
--bs-list-group-item-padding-x: 5px;
|
||||
}
|
||||
|
||||
.lh0 {
|
||||
line-height: 0;
|
||||
}
|
||||
|
||||
.instructions {
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.instructions p {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.instructions-title {
|
||||
margin: 10px 0;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.link {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.link-icon {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
margin-left: auto;
|
||||
}
|
||||
|
||||
.module-title {
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.accordion-button:not(.collapsed) {
|
||||
background-color: #DCDCDC;
|
||||
color: var(--bs-accordion-btn-color)
|
||||
}
|
||||
|
||||
.accordion-button:focus {
|
||||
box-shadow: none;
|
||||
border-color: white;
|
||||
}
|
||||
|
||||
.form-check-input:focus {
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#toast {
|
||||
visibility: hidden;
|
||||
width: fit-content;
|
||||
margin: auto;
|
||||
color: #000;
|
||||
text-align: center;
|
||||
position: fixed;
|
||||
z-index: 1;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top: 45px;
|
||||
font-size: 16px;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
#toast.show {
|
||||
visibility: visible;
|
||||
animation: fadein 1s, fadeout 1s 2s;
|
||||
}
|
||||
|
||||
@keyframes fadein {
|
||||
from {
|
||||
top: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
to {
|
||||
top: 45px;
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes fadeout {
|
||||
from {
|
||||
top: 45px;
|
||||
opacity: 1;
|
||||
}
|
||||
to {
|
||||
top: 0;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
[data-bs-theme=light] .form-check-input:focus {
|
||||
border-color: #dee2e6;
|
||||
--bs-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e");
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* Full dark theme */
|
||||
[data-bs-theme=dark] .link-dark {
|
||||
color: #dee2e6 !important;
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
[data-bs-theme=dark] #toast {
|
||||
color: var(--bs-list-group-color)
|
||||
}
|
||||
|
||||
[data-bs-theme=dark] svg {
|
||||
filter: invert(100%) sepia(10%) saturate(7500%) hue-rotate(198deg) brightness(120%) contrast(108%);
|
||||
}
|
||||
|
||||
[data-bs-theme=dark] *,
|
||||
[data-bs-theme=dark] .subscription .list-group-item span,
|
||||
{
|
||||
background-color: #181818;
|
||||
}
|
||||
|
||||
[data-bs-theme=dark] .accordion-button,
|
||||
[data-bs-theme=dark] .subscription .list-group-item,
|
||||
[data-bs-theme=dark] .subscription .list-group-item > *
|
||||
{
|
||||
background-color: #282828;
|
||||
}
|
||||
|
||||
[data-bs-theme=dark] .accordion-button:not(.collapsed) {
|
||||
background-color: #383838;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
function showNotification(notificationElementId) {
|
||||
let notification = document.getElementById(notificationElementId)
|
||||
notification.className = "show";
|
||||
setTimeout(() => {
|
||||
notification.className = notification.className.replace("show", "");
|
||||
}, 2900);
|
||||
}
|
||||
|
||||
function copyToClipboard(text) {
|
||||
navigator.clipboard.writeText(text);
|
||||
}
|
||||
|
||||
const buttonSwitchTheme = document.getElementById('btnSwitchTheme');
|
||||
buttonSwitchTheme.checked = currentThemeSetting === 'dark';
|
||||
buttonSwitchTheme.addEventListener("click", () => {
|
||||
const newTheme = currentThemeSetting === "dark" ? "light" : "dark";
|
||||
setTheme(newTheme);
|
||||
});
|
||||
|
||||
const links = document.getElementsByClassName('self-link');
|
||||
Array.from(links).forEach(link => {
|
||||
link.href = link.href.replace('{link}', window.location.href);
|
||||
});
|
||||
|
||||
</script>
|
||||
</main></body></html>
|
||||
Loading…
x
Reference in New Issue
Block a user