119 lines
5.0 KiB
HTML
119 lines
5.0 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8"/>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
|
|
<title>Paste Created - I2P Secure Share</title>
|
|
<link rel="stylesheet" href="/static/css/tailwind.css"/>
|
|
<link rel="icon" href="{{ url_for('static', filename='favicon.ico') }}" type="image/x-icon">
|
|
|
|
<style>
|
|
body { background-color: #1a202c; color: #cbd5e0; }
|
|
.link-box { background-color: #2d3748; border:1px solid #4a5568; word-break:break-all; }
|
|
.btn { background-color:#4299e1; transition:background-color .3s ease; }
|
|
.btn:hover { background-color:#3182ce; }
|
|
.code-container {
|
|
background-color:#2d3748; border-radius:0.5rem; border:1px solid #4a5568; overflow:hidden;
|
|
}
|
|
.syntax pre {
|
|
margin:0; padding:1rem; white-space:pre-wrap; word-wrap:break-word;
|
|
}
|
|
.announcement-bar { background-color:#2563eb; border-bottom:1px solid #1e3a8a; }
|
|
.wide-container { max-width: 85rem; }
|
|
|
|
</style>
|
|
</head>
|
|
<body class="font-sans">
|
|
|
|
{% if announcement_enabled and announcement_message %}
|
|
<div id="announcement-bar" class="announcement-bar text-white text-center p-2 relative shadow-lg">
|
|
<span>{{ announcement_message }}</span>
|
|
<button id="close-announcement" class="absolute top-0 right-0 mt-2 mr-4 text-white hover:text-gray-200 text-2xl leading-none">×</button>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<div class="flex items-center justify-center min-h-screen py-8">
|
|
<div class="w-full wide-container mx-auto p-6">
|
|
{% if password_required %}
|
|
<div class="content-container rounded-lg p-10 shadow-lg"></div>
|
|
<h2 class="text-2xl font-semibold text-white mb-6">Enter Password to View Paste</h2>
|
|
<form method="POST">
|
|
<div class="mb-6">
|
|
<label for="password" class="block text-gray-300 text-sm font-bold mb-2">Password:</label>
|
|
<input type="password" name="password" id="password"
|
|
class="w-full p-2 rounded-md text-white bg-gray-700 border border-gray-600 focus:outline-none focus:ring-2 focus:ring-blue-500"
|
|
required>
|
|
</div>
|
|
<button type="submit" class="btn w-full text-white font-bold py-3 px-5 rounded-md">Unlock Paste</button>
|
|
</form>
|
|
</div>
|
|
{% else %}
|
|
<header class="text-center mb-8">
|
|
<a href="/" class="inline-block mb-4">
|
|
<img src="/static/images/stormycloud.svg"
|
|
alt="StormyCloud Logo"
|
|
style="width:550px; max-width:100%;" class="mx-auto"/>
|
|
</a>
|
|
<h1 class="text-3xl font-bold text-white">Paste Created Successfully</h1>
|
|
<p class="text-gray-400 mt-2 text-xl">Expires in: {{ time_left }}</p>
|
|
</header>
|
|
|
|
<main>
|
|
<div class="code-container mb-6 syntax">
|
|
{{ highlighted_content|safe }}
|
|
</div>
|
|
|
|
<div class="link-box rounded-lg p-4 mb-4">
|
|
<label for="share-link" class="block text-gray-300 text-sm font-bold mb-2">Shareable Link:</label>
|
|
<div class="flex items-center space-x-2">
|
|
<input type="text" id="share-link"
|
|
class="bg-gray-700 text-white w-full p-2 border border-gray-600 rounded-md"
|
|
value="{{ request.url }}" readonly>
|
|
<button id="copy-button"
|
|
class="btn whitespace-nowrap flex-shrink-0 text-white font-bold py-3 px-5 rounded-md">
|
|
Copy
|
|
</button>
|
|
<a href="/paste/{{ paste_id }}/raw"
|
|
target="_blank"
|
|
class="btn whitespace-nowrap flex-shrink-0 text-white font-bold py-3 px-5 rounded-md">
|
|
Raw
|
|
</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="text-center mt-8">
|
|
<a href="/" class="text-blue-400 hover:text-blue-300">Create another paste</a>
|
|
</div>
|
|
<div class="text-center mt-4 text-sm">
|
|
<p class="text-gray-500">Find this service useful? <a href="/donate" class="text-blue-400 hover:underline">Consider supporting its future.</a></p>
|
|
</div>
|
|
|
|
</main>
|
|
{% endif %}
|
|
|
|
<footer class="text-center text-gray-500 mt-16 border-t border-gray-700 pt-8 pb-8">
|
|
<a href="http://stormycloud.i2p" class="hover:text-gray-400">StormyCloud</a>
|
|
<span class="mx-2">|</span>
|
|
<a href="/donate" class="hover:text-gray-400">Donate</a>
|
|
</footer>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
const copyBtn = document.getElementById('copy-button');
|
|
if (copyBtn) {
|
|
copyBtn.addEventListener('click', () => {
|
|
const inp = document.getElementById('share-link');
|
|
inp.select(); document.execCommand('copy');
|
|
copyBtn.textContent = 'Copied!';
|
|
setTimeout(() => copyBtn.textContent = 'Copy', 2000);
|
|
});
|
|
}
|
|
const closeBtn = document.getElementById('close-announcement');
|
|
if (closeBtn) closeBtn.addEventListener('click', () =>
|
|
document.getElementById('announcement-bar').style.display = 'none'
|
|
);
|
|
</script>
|
|
</body>
|
|
</html>
|