164 lines
9.6 KiB
HTML
164 lines
9.6 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Marzban Subscription</title>
|
||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/css/bootstrap.min.css">
|
||
<style>
|
||
body {
|
||
font-family: Arial, sans-serif;
|
||
margin: 20px;
|
||
}
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<div class="container">
|
||
<h1 class="text-center mb-4">Подписка Marzban</h1>
|
||
|
||
<div id="os-detection" class="alert alert-info text-center">
|
||
Определение вашей операционной системы...
|
||
</div>
|
||
|
||
<div class="accordion" id="appsAccordion">
|
||
<div class="accordion-item">
|
||
<h2 class="accordion-header" id="headingAndroid">
|
||
<button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseAndroid" aria-expanded="true" aria-controls="collapseAndroid">
|
||
Приложения для Android
|
||
</button>
|
||
</h2>
|
||
<div id="collapseAndroid" class="accordion-collapse collapse" aria-labelledby="headingAndroid" data-bs-parent="#appsAccordion">
|
||
<div class="accordion-body">
|
||
<div class="accordion" id="androidSubAccordion">
|
||
<div class="accordion-item">
|
||
<h2 class="accordion-header" id="headingAndroidApp1">
|
||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseAndroidApp1" aria-expanded="false" aria-controls="collapseAndroidApp1">
|
||
Приложение 1
|
||
</button>
|
||
</h2>
|
||
<div id="collapseAndroidApp1" class="accordion-collapse collapse" aria-labelledby="headingAndroidApp1" data-bs-parent="#androidSubAccordion">
|
||
<div class="accordion-body">
|
||
<p>Описание приложения 1 для Android.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="accordion-item">
|
||
<h2 class="accordion-header" id="headingAndroidApp2">
|
||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseAndroidApp2" aria-expanded="false" aria-controls="collapseAndroidApp2">
|
||
Приложение 2
|
||
</button>
|
||
</h2>
|
||
<div id="collapseAndroidApp2" class="accordion-collapse collapse" aria-labelledby="headingAndroidApp2" data-bs-parent="#androidSubAccordion">
|
||
<div class="accordion-body">
|
||
<p>Описание приложения 2 для Android.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="accordion-item">
|
||
<h2 class="accordion-header" id="headingiOS">
|
||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseiOS" aria-expanded="false" aria-controls="collapseiOS">
|
||
Приложения для iOS
|
||
</button>
|
||
</h2>
|
||
<div id="collapseiOS" class="accordion-collapse collapse" aria-labelledby="headingiOS" data-bs-parent="#appsAccordion">
|
||
<div class="accordion-body">
|
||
<div class="accordion" id="iosSubAccordion">
|
||
<div class="accordion-item">
|
||
<h2 class="accordion-header" id="headingiOSApp1">
|
||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseiOSApp1" aria-expanded="false" aria-controls="collapseiOSApp1">
|
||
Приложение 1
|
||
</button>
|
||
</h2>
|
||
<div id="collapseiOSApp1" class="accordion-collapse collapse" aria-labelledby="headingiOSApp1" data-bs-parent="#iosSubAccordion">
|
||
<div class="accordion-body">
|
||
<p>Описание приложения 1 для iOS.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="accordion-item">
|
||
<h2 class="accordion-header" id="headingiOSApp2">
|
||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseiOSApp2" aria-expanded="false" aria-controls="collapseiOSApp2">
|
||
Приложение 2
|
||
</button>
|
||
</h2>
|
||
<div id="collapseiOSApp2" class="accordion-collapse collapse" aria-labelledby="headingiOSApp2" data-bs-parent="#iosSubAccordion">
|
||
<div class="accordion-body">
|
||
<p>Описание приложения 2 для iOS.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="accordion-item">
|
||
<h2 class="accordion-header" id="headingWindows">
|
||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseWindows" aria-expanded="false" aria-controls="collapseWindows">
|
||
Приложения для Windows
|
||
</button>
|
||
</h2>
|
||
<div id="collapseWindows" class="accordion-collapse collapse" aria-labelledby="headingWindows" data-bs-parent="#appsAccordion">
|
||
<div class="accordion-body">
|
||
<div class="accordion" id="windowsSubAccordion">
|
||
<div class="accordion-item">
|
||
<h2 class="accordion-header" id="headingWindowsApp1">
|
||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseWindowsApp1" aria-expanded="false" aria-controls="collapseWindowsApp1">
|
||
Приложение 1
|
||
</button>
|
||
</h2>
|
||
<div id="collapseWindowsApp1" class="accordion-collapse collapse" aria-labelledby="headingWindowsApp1" data-bs-parent="#windowsSubAccordion">
|
||
<div class="accordion-body">
|
||
<p>Описание приложения 1 для Windows.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="accordion-item">
|
||
<h2 class="accordion-header" id="headingWindowsApp2">
|
||
<button class="accordion-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapseWindowsApp2" aria-expanded="false" aria-controls="collapseWindowsApp2">
|
||
Приложение 2
|
||
</button>
|
||
</h2>
|
||
<div id="collapseWindowsApp2" class="accordion-collapse collapse" aria-labelledby="headingWindowsApp2" data-bs-parent="#windowsSubAccordion">
|
||
<div class="accordion-body">
|
||
<p>Описание приложения 2 для Windows.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script>
|
||
document.addEventListener('DOMContentLoaded', function () {
|
||
const osDetection = document.getElementById('os-detection');
|
||
const userAgent = navigator.userAgent;
|
||
|
||
let os = 'Не удалось определить ОС';
|
||
if (/Android/i.test(userAgent)) {
|
||
os = 'Android';
|
||
document.getElementById('collapseAndroid').classList.add('show');
|
||
} else if (/iPhone|iPad|iPod/i.test(userAgent)) {
|
||
os = 'iOS';
|
||
document.getElementById('collapseiOS').classList.add('show');
|
||
} else if (/Windows NT/i.test(userAgent)) {
|
||
os = 'Windows';
|
||
document.getElementById('collapseWindows').classList.add('show');
|
||
}
|
||
|
||
osDetection.textContent = `Ваша операционная система: ${os}`;
|
||
});
|
||
</script>
|
||
|
||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.bundle.min.js"></script>
|
||
</body>
|
||
</html>
|