Enki/vpn-btcpay-provisioner
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Chagned some wording on the main and success pages.

Browse Source
This commit is contained in:
Enki 2025-01-10 07:32:36 +00:00
parent 9941aa93f6
commit ac879e2993
2 changed files with 65 additions and 60 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
app/templates/index.html
View File

@ -8,7 +8,7 @@
<label class="block text-sm font-medium mb-2">User ID</label> <label class="block text-sm font-medium mb-2">User ID</label>
<input type="text" id="user-id" readonly <input type="text" id="user-id" readonly
class="w-full px-3 py-2 bg-dark border border-gray-600 rounded-md text-white focus:outline-none focus:border-blue-500 font-mono text-sm"> class="w-full px-3 py-2 bg-dark border border-gray-600 rounded-md text-white focus:outline-none focus:border-blue-500 font-mono text-sm">
<p class="mt-1 text-sm text-gray-400">Only used for subscription management</p> <p class="mt-1 text-sm text-gray-400">Only used for subscription management. Save this to be able to login.</p>
</div> </div>
<div> <div>
@ -60,8 +60,8 @@
<div id="keys-display" class="hidden space-y-3"> <div id="keys-display" class="hidden space-y-3">
<div class="bg-yellow-900 bg-opacity-20 p-4 rounded-md text-yellow-500 text-sm"> <div class="bg-yellow-900 bg-opacity-20 p-4 rounded-md text-yellow-500 text-sm">
Your private keys are only generated within the browser! Your private keys are only generated within the browser! We do NOT save your keys.
Save these keys securely - you'll need them to connect to the VPN. Save these keys now. They will not be shown on the next page.
</div> </div>
<div class="space-y-2"> <div class="space-y-2">

113
app/templates/payment_success.html
View File

@ -1,67 +1,72 @@
{% extends "base.html" %} {% extends "base.html" %}
{% block content %} {% block content %}
<div class="min-h-screen bg-dark py-8 px-4"> <div class="min-h-screen bg-dark flex flex-col">
<div class="max-w-2xl mx-auto bg-dark-lighter rounded-lg shadow-lg p-6"> <div class="flex-grow px-4">
<h1 class="text-2xl font-bold mb-4 text-center">Payment Successful!</h1> <div class="mb-8 flex justify-center pt-8">
<img src="/static/images/logo.svg" alt="VPN Service Logo" class="h-16">
<div class="mb-8">
<p class="text-gray-300 text-center mb-4">
Your VPN subscription is now active. Please follow the instructions below to set up your VPN connection.
</p>
</div> </div>
<div class="space-y-6"> <div class="max-w-2xl mx-auto bg-dark-lighter rounded-lg shadow-lg p-6">
<!-- WireGuard Configuration Section --> <h1 class="text-2xl font-bold mb-4 text-center">Payment Successful!</h1>
<div id="config-section" class="hidden">
<h2 class="text-xl font-semibold mb-2">Your WireGuard Configuration</h2> <div class="mb-8">
<pre id="wireguard-config" class="bg-dark p-4 rounded-md font-mono text-sm overflow-x-auto"></pre> <p class="text-gray-300 text-center mb-4">
<button Your VPN subscription will be active shortly. Please follow the instructions below to set up your VPN connection. If something Goes wrong please reach out.
id="copy-config" </p>
class="mt-2 w-full bg-blue-600 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded transition-colors"
>
Copy Configuration
</button>
<button
id="download-config"
class="mt-2 w-full bg-green-600 hover:bg-green-700 text-white font-bold py-2 px-4 rounded transition-colors"
>
Download Configuration
</button>
</div> </div>
<!-- Installation Instructions --> <div class="space-y-6">
<div class="space-y-4"> <!-- WireGuard Configuration Section -->
<h2 class="text-xl font-semibold">Installation Instructions</h2> <div id="config-section" class="hidden">
<ol class="list-decimal list-inside space-y-2 text-gray-300"> <h2 class="text-xl font-semibold mb-2">Your WireGuard Configuration</h2>
<li>Download WireGuard for your platform: <pre id="wireguard-config" class="bg-dark p-4 rounded-md font-mono text-sm overflow-x-auto"></pre>
<div class="ml-6 mt-2 space-y-2"> <button id="copy-config" class="mt-2 w-full bg-blue-600 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded transition-colors">
<a href="https://www.wireguard.com/install/" Copy Configuration
target="_blank" </button>
class="text-blue-400 hover:text-blue-300 block"> <button id="download-config" class="mt-2 w-full bg-green-600 hover:bg-green-700 text-white font-bold py-2 px-4 rounded transition-colors">
Official WireGuard Downloads Download Configuration
</a> </button>
</div> </div>
</li>
<li>Create a new tunnel in WireGuard</li>
<li>Copy the configuration above and paste it into the new tunnel</li>
<li>Activate the tunnel to connect</li>
</ol>
</div>
<div class="space-y-2 text-sm text-gray-400"> <!-- Installation Instructions -->
<p>• Save your configuration securely - you'll need it to reconnect</p> <div class="space-y-4">
<p>• Your private key is stored in your browser's local storage</p> <h2 class="text-xl font-semibold">Installation Instructions</h2>
<p>• For security, clear your browser data after saving the configuration</p> <ol class="list-decimal list-inside space-y-2 text-gray-300">
</div> <li>Download WireGuard for your platform:
</div> <div class="ml-6 mt-2 space-y-2">
<a href="https://www.wireguard.com/install/" target="_blank" class="text-blue-400 hover:text-blue-300 block">
Official WireGuard Downloads
</a>
</div>
</li>
<li>Create a new tunnel in WireGuard</li>
<li>Paste your keys in.</li>
<li>Activate the tunnel to connect</li>
</ol>
</div>
<div class="mt-8 text-center"> <div class="space-y-2 text-sm text-gray-400">
<a href="/" class="text-blue-400 hover:text-blue-300"> <p>• Thank you for using our service.</p>
Return to Home <p>• Please reach out if there are any issues. The contact form is at the bottom of the page.</p>
</a> <p>• For extra security, clear your browser data.</p>
</div>
<div class="mt-8 text-center">
<a href="/" class="text-blue-400 hover:text-blue-300">Return to Home</a>
</div>
</div>
</div> </div>
</div> </div>
</div>
<footer class="bg-dark-lighter py-4 mt-8">
<div class="container mx-auto text-center">
<p class="text-gray-400">
Need help? Contact us at <a href="mailto:support@vpnservice.com" class="text-blue-400 hover:text-blue-300">support@vpnservice.com</a>
</p>
</div>
</footer>
</div>
<script type="module"> <script type="module">
import { WireGuard } from '/static/js/utils/wireguard.js'; import { WireGuard } from '/static/js/utils/wireguard.js';