mirror of
https://github.com/PR0M3TH3AN/VoxVera.git
synced 2026-10-31 19:50:42 +00:00
479 lines
18 KiB
HTML
479 lines
18 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=850">
|
|
<title id="site-title">Vox Vera Printable Flyers</title>
|
|
<style>
|
|
body {
|
|
font-family: 'Courier New', Courier, monospace;
|
|
margin: 0;
|
|
padding: 20px 0;
|
|
display: flex;
|
|
justify-content: flex-start;
|
|
align-items: center;
|
|
flex-direction: column;
|
|
min-height: 100vh;
|
|
box-sizing: border-box;
|
|
background-color: #ffffff;
|
|
}
|
|
|
|
a {
|
|
color: #b80000;
|
|
text-decoration: none;
|
|
}
|
|
|
|
a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
|
|
.wrapper {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
flex-direction: column;
|
|
height: 100%;
|
|
width: 100%;
|
|
}
|
|
|
|
.container {
|
|
display: flex;
|
|
flex-direction: row;
|
|
height: 11in;
|
|
width: 8.5in;
|
|
border: 1px solid #000;
|
|
box-sizing: border-box;
|
|
overflow: hidden;
|
|
page-break-inside: avoid;
|
|
}
|
|
|
|
.print-button-container {
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.print-button, .download-button, .lang-select {
|
|
padding: 10px 20px;
|
|
font-size: 14px;
|
|
cursor: pointer;
|
|
background-color: #000;
|
|
color: #fff;
|
|
border: none;
|
|
border-radius: 0px;
|
|
font-family: 'Courier New', Courier, monospace;
|
|
}
|
|
|
|
.lang-select {
|
|
background-color: #f0f0f0;
|
|
color: #000;
|
|
border: 1px solid #000;
|
|
}
|
|
|
|
.print-button:hover, .download-button:hover {
|
|
background-color: #444;
|
|
}
|
|
|
|
.left-tear-offs {
|
|
width: 3.75in;
|
|
padding: 8px;
|
|
border-right: 1px dashed #000;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
gap: 5px;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.tear-off {
|
|
display: flex;
|
|
padding: 5px;
|
|
border: 1px dashed #000;
|
|
font-size: 10px;
|
|
box-sizing: border-box;
|
|
page-break-inside: avoid;
|
|
align-items: flex-start;
|
|
}
|
|
|
|
.tear-off-text {
|
|
flex: 1;
|
|
min-width: 0;
|
|
word-wrap: break-word;
|
|
overflow-wrap: break-word;
|
|
word-break: break-all;
|
|
}
|
|
|
|
.tear-off a {
|
|
color: #b80000;
|
|
text-decoration: none;
|
|
}
|
|
|
|
.tear-off a:hover {
|
|
text-decoration: underline;
|
|
}
|
|
|
|
.qr-code {
|
|
width: 80px;
|
|
height: 80px;
|
|
border: 0px solid #000;
|
|
margin-left: 10px;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.qr-code img {
|
|
width: 100%;
|
|
height: 100%;
|
|
object-fit: contain;
|
|
}
|
|
|
|
.content {
|
|
width: calc(8.5in - 3.75in);
|
|
padding: 20px;
|
|
text-align: center;
|
|
box-sizing: border-box;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: space-between;
|
|
page-break-inside: avoid;
|
|
overflow-wrap: break-word;
|
|
}
|
|
|
|
h1 {
|
|
margin: 0;
|
|
margin-bottom: 10px;
|
|
font-size: 24px;
|
|
letter-spacing: 2px;
|
|
}
|
|
|
|
.distribute {
|
|
font-size: 18px;
|
|
letter-spacing: 6px;
|
|
}
|
|
|
|
.redacted {
|
|
text-decoration: line-through;
|
|
}
|
|
|
|
.message {
|
|
flex: 1;
|
|
margin-top: 10px;
|
|
font-size: 14px;
|
|
line-height: 1.4;
|
|
text-align: left;
|
|
overflow-wrap: break-word;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: flex-end;
|
|
white-space: pre-wrap;
|
|
box-sizing: border-box;
|
|
position: relative;
|
|
}
|
|
|
|
.text-container {
|
|
flex: 1;
|
|
width: 100%;
|
|
height: 100%;
|
|
border: none;
|
|
outline: none;
|
|
font-family: 'Courier New', Courier, monospace;
|
|
font-size: 14px;
|
|
line-height: 1.4;
|
|
white-space: pre-wrap;
|
|
overflow: hidden;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.qr-code-body {
|
|
width: 100%;
|
|
height: auto;
|
|
display: flex;
|
|
justify-content: space-between;
|
|
align-items: center;
|
|
margin-top: 10px;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.qr-code-body img {
|
|
width: 80px;
|
|
height: 80px;
|
|
object-fit: contain;
|
|
flex-shrink: 0;
|
|
}
|
|
|
|
.qr-code-url {
|
|
font-size: 12px;
|
|
text-align: left;
|
|
word-wrap: break-word;
|
|
overflow-wrap: break-word;
|
|
hyphens: auto;
|
|
flex-grow: 1;
|
|
margin-right: 10px;
|
|
max-width: 60%;
|
|
}
|
|
|
|
hr {
|
|
border: none;
|
|
border-top: 1px solid #000;
|
|
width: 100%;
|
|
margin: 10px 0;
|
|
}
|
|
|
|
.footer {
|
|
font-size: 10px;
|
|
overflow-wrap: break-word;
|
|
text-align: center;
|
|
align-self: center;
|
|
width: 100%;
|
|
padding: 10px 0;
|
|
box-sizing: border-box;
|
|
border-top: 1px solid #000;
|
|
}
|
|
|
|
.footer p {
|
|
margin: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
.footer .binary {
|
|
margin-bottom: 5px;
|
|
margin-top: 20px;
|
|
}
|
|
|
|
.footer .credit {
|
|
font-size: 12px;
|
|
margin-top: 5px;
|
|
}
|
|
|
|
@media print {
|
|
body, html {
|
|
width: 8.5in;
|
|
height: 11in;
|
|
margin: 0;
|
|
padding: 0;
|
|
overflow: hidden;
|
|
display: block;
|
|
}
|
|
|
|
.container {
|
|
box-shadow: none;
|
|
border: none;
|
|
page-break-inside: avoid;
|
|
margin: 0;
|
|
padding: 0;
|
|
width: 8.5in;
|
|
height: 11in;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.print-button, .download-button, .lang-select, .button-bar {
|
|
display: none !important;
|
|
}
|
|
|
|
body {
|
|
transform: none;
|
|
}
|
|
}
|
|
|
|
.button-bar {
|
|
display: flex;
|
|
gap: 10px;
|
|
padding: 20px 0 30px;
|
|
}
|
|
|
|
</style>
|
|
<script>
|
|
// VoxVera Multi-Language Engine
|
|
const locales = {"de": {"meta": {"language_name": "Deutsch", "flag": "\ud83c\udde9\ud83c\uddea"}, "web": {"tear_off_tor_browser": "Tor-Browser verwenden", "tear_off_desc": "um diese Nachricht zu verbreiten, gehen Sie zu", "tear_off_footer": "Klicken Sie auf die Schaltfl\u00e4che unten zum Drucken", "built_with": "erstellt mit", "print_button": "Flyer drucken", "download_button": "Tool & Quellcode herunterladen"}}, "en": {"meta": {"language_name": "English", "flag": "\ud83c\uddfa\ud83c\uddf8"}, "web": {"tear_off_tor_browser": "Use Tor Browser", "tear_off_desc": "to help spread this message go to", "tear_off_footer": "click the button below to print", "built_with": "built with", "print_button": "Print this page", "download_button": "Download Tool & Source"}}, "es": {"meta": {"language_name": "Espa\u00f1ol", "flag": "\ud83c\uddea\ud83c\uddf8"}, "web": {"tear_off_tor_browser": "Use el Navegador Tor", "tear_off_desc": "para ayudar a difundir este mensaje vaya a", "tear_off_footer": "haga clic en el bot\u00f3n de abajo para imprimir", "built_with": "construido con", "print_button": "Imprimir volante", "download_button": "Descargar Herramienta y C\u00f3digo"}}}; // Injected at build time
|
|
|
|
function t(path, lang) {
|
|
const parts = path.split('.');
|
|
let val = locales[lang];
|
|
for (const part of parts) {
|
|
if (!val) return path;
|
|
val = val[part];
|
|
}
|
|
return val || path;
|
|
}
|
|
|
|
function setLanguage(lang) {
|
|
if (!locales[lang]) lang = 'en';
|
|
localStorage.setItem('voxvera_lang', lang);
|
|
document.querySelectorAll('[data-i18n]').forEach(el => {
|
|
const path = el.getAttribute('data-i18n');
|
|
el.innerText = t(path, lang);
|
|
});
|
|
document.getElementById('lang-selector').value = lang;
|
|
document.documentElement.lang = lang;
|
|
}
|
|
|
|
window.onload = () => {
|
|
const selector = document.getElementById('lang-selector');
|
|
// Populate selector
|
|
Object.keys(locales).forEach(code => {
|
|
const opt = document.createElement('option');
|
|
opt.value = code;
|
|
opt.innerText = `${locales[code].meta.flag} ${locales[code].meta.language_name}`;
|
|
selector.appendChild(opt);
|
|
});
|
|
|
|
const savedLang = localStorage.getItem('voxvera_lang');
|
|
const browserLang = navigator.language.split('-')[0];
|
|
const defaultLang = savedLang || (locales[browserLang] ? browserLang : 'en');
|
|
|
|
setLanguage(defaultLang);
|
|
};
|
|
</script>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="container">
|
|
<div class="left-tear-offs">
|
|
<div class="tear-off">
|
|
<div class="tear-off-text">
|
|
<span data-i18n="web.tear_off_tor_browser">Use Tor Browser</span><br><br>
|
|
<span data-i18n="web.tear_off_desc">to help spread this message go to</span><br>
|
|
<a class="tear-off-link" href="https://voxvera.org/" target="_blank">https://voxvera.org/</a><br>
|
|
<span data-i18n="web.tear_off_footer">click the button below to print</span>
|
|
</div>
|
|
<div class="qr-code">
|
|
<img src="qrcode-tear-offs.png" alt="QR Code">
|
|
</div>
|
|
</div>
|
|
<!-- Repeat for other tear-offs -->
|
|
<div class="tear-off">
|
|
<div class="tear-off-text">
|
|
<span data-i18n="web.tear_off_tor_browser">Use Tor Browser</span><br><br>
|
|
<span data-i18n="web.tear_off_desc">to help spread this message go to</span><br>
|
|
<a class="tear-off-link" href="https://voxvera.org/" target="_blank">https://voxvera.org/</a><br>
|
|
<span data-i18n="web.tear_off_footer">click the button below to print</span>
|
|
</div>
|
|
<div class="qr-code">
|
|
<img src="qrcode-tear-offs.png" alt="QR Code">
|
|
</div>
|
|
</div>
|
|
<div class="tear-off">
|
|
<div class="tear-off-text">
|
|
<span data-i18n="web.tear_off_tor_browser">Use Tor Browser</span><br><br>
|
|
<span data-i18n="web.tear_off_desc">to help spread this message go to</span><br>
|
|
<a class="tear-off-link" href="https://voxvera.org/" target="_blank">https://voxvera.org/</a><br>
|
|
<span data-i18n="web.tear_off_footer">click the button below to print</span>
|
|
</div>
|
|
<div class="qr-code">
|
|
<img src="qrcode-tear-offs.png" alt="QR Code">
|
|
</div>
|
|
</div>
|
|
<div class="tear-off">
|
|
<div class="tear-off-text">
|
|
<span data-i18n="web.tear_off_tor_browser">Use Tor Browser</span><br><br>
|
|
<span data-i18n="web.tear_off_desc">to help spread this message go to</span><br>
|
|
<a class="tear-off-link" href="https://voxvera.org/" target="_blank">https://voxvera.org/</a><br>
|
|
<span data-i18n="web.tear_off_footer">click the button below to print</span>
|
|
</div>
|
|
<div class="qr-code">
|
|
<img src="qrcode-tear-offs.png" alt="QR Code">
|
|
</div>
|
|
</div>
|
|
<div class="tear-off">
|
|
<div class="tear-off-text">
|
|
<span data-i18n="web.tear_off_tor_browser">Use Tor Browser</span><br><br>
|
|
<span data-i18n="web.tear_off_desc">to help spread this message go to</span><br>
|
|
<a class="tear-off-link" href="https://voxvera.org/" target="_blank">https://voxvera.org/</a><br>
|
|
<span data-i18n="web.tear_off_footer">click the button below to print</span>
|
|
</div>
|
|
<div class="qr-code">
|
|
<img src="qrcode-tear-offs.png" alt="QR Code">
|
|
</div>
|
|
</div>
|
|
<div class="tear-off">
|
|
<div class="tear-off-text">
|
|
<span data-i18n="web.tear_off_tor_browser">Use Tor Browser</span><br><br>
|
|
<span data-i18n="web.tear_off_desc">to help spread this message go to</span><br>
|
|
<a class="tear-off-link" href="https://voxvera.org/" target="_blank">https://voxvera.org/</a><br>
|
|
<span data-i18n="web.tear_off_footer">click the button below to print</span>
|
|
</div>
|
|
<div class="qr-code">
|
|
<img src="qrcode-tear-offs.png" alt="QR Code">
|
|
</div>
|
|
</div>
|
|
<div class="tear-off">
|
|
<div class="tear-off-text">
|
|
<span data-i18n="web.tear_off_tor_browser">Use Tor Browser</span><br><br>
|
|
<span data-i18n="web.tear_off_desc">to help spread this message go to</span><br>
|
|
<a class="tear-off-link" href="https://voxvera.org/" target="_blank">https://voxvera.org/</a><br>
|
|
<span data-i18n="web.tear_off_footer">click the button below to print</span>
|
|
</div>
|
|
<div class="qr-code">
|
|
<img src="qrcode-tear-offs.png" alt="QR Code">
|
|
</div>
|
|
</div>
|
|
<div class="tear-off">
|
|
<div class="tear-off-text">
|
|
<span data-i18n="web.tear_off_tor_browser">Use Tor Browser</span><br><br>
|
|
<span data-i18n="web.tear_off_desc">to help spread this message go to</span><br>
|
|
<a class="tear-off-link" href="https://voxvera.org/" target="_blank">https://voxvera.org/</a><br>
|
|
<span data-i18n="web.tear_off_footer">click the button below to print</span>
|
|
</div>
|
|
<div class="qr-code">
|
|
<img src="qrcode-tear-offs.png" alt="QR Code">
|
|
</div>
|
|
</div>
|
|
<div class="tear-off">
|
|
<div class="tear-off-text">
|
|
<span data-i18n="web.tear_off_tor_browser">Use Tor Browser</span><br><br>
|
|
<span data-i18n="web.tear_off_desc">to help spread this message go to</span><br>
|
|
<a class="tear-off-link" href="https://voxvera.org/" target="_blank">https://voxvera.org/</a><br>
|
|
<span data-i18n="web.tear_off_footer">click the button below to print</span>
|
|
</div>
|
|
<div class="qr-code">
|
|
<img src="qrcode-tear-offs.png" alt="QR Code">
|
|
</div>
|
|
</div>
|
|
<div class="tear-off">
|
|
<div class="tear-off-text">
|
|
<span data-i18n="web.tear_off_tor_browser">Use Tor Browser</span><br><br>
|
|
<span data-i18n="web.tear_off_desc">to help spread this message go to</span><br>
|
|
<a class="tear-off-link" href="https://voxvera.org/" target="_blank">https://voxvera.org/</a><br>
|
|
<span data-i18n="web.tear_off_footer">click the button below to print</span>
|
|
</div>
|
|
<div class="qr-code">
|
|
<img src="qrcode-tear-offs.png" alt="QR Code">
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="content">
|
|
<h1 id="top-secret-title">TOP SECRET</h1>
|
|
<div class="distribute" id="do-not-distribute">DO <span class="redacted">NOT</span> DISTRIBUTE</div>
|
|
<h1 id="operation-title-2">OPERATION VOX VERA</h1>
|
|
<hr>
|
|
<div class="message">
|
|
<div class="text-container" id="main-content" contenteditable="false">Break free from censorship with VoxVera. An anonymous guerrilla marketing and message-spreading tool. Whether online or in the physical world, it can empower you to spread your ideas boldly, shielded by complete anonymity (if you host over Tor). Download the code, design a flyer site, host it online and amplify your message.
|
|
|
|
Use memetic power to share your ideas in your school, workplace, online communities, or even globally. VoxVera ensures your message resonates far and wide, with tear-off sections featuring unique URLs and QR codes for easy reprinting.
|
|
|
|
Privacy can be maintained. Flyers can be shared via the Tor network, protecting hoster and users from censorship.
|
|
|
|
Join us in a revolution that values truth and transparency. Together, we can build a network of informed citizens who are unafraid to speak out.
|
|
</div>
|
|
<div class="qr-code-body">
|
|
<div class="qr-code-url">
|
|
<span class="url-message">Get VoxVera and start spreading your message.</span><br><br>
|
|
<a id="qr-link-2" href="https://github.com/PR0M3TH3AN/VoxVera" target="_blank">https://github.com/PR0M3TH3AN/VoxVera</a>
|
|
</div>
|
|
<img src="qrcode-content.png" alt="QR Code">
|
|
</div>
|
|
</div>
|
|
<hr>
|
|
<div class="footer">
|
|
<p class="credit"><span data-i18n="web.built_with">built with</span> <a href="https://github.com/PR0M3TH3AN/VoxVera">voxvera</a></p>
|
|
<p class="binary" id="binary-message">0110010 0101011 0110010 0111101 0110100</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="button-bar">
|
|
<button class="print-button" onclick="window.print()" data-i18n="web.print_button">Print Flyer</button>
|
|
<a class="download-button" href="download/voxvera-portable.zip" download data-i18n="web.download_button">Download</a>
|
|
<select class="lang-select" id="lang-selector" onchange="setLanguage(this.value)"></select>
|
|
</div>
|
|
</body>
|
|
</html> |