bbpro
Version:
BrowserBox - remote browser isolation tool
167 lines (150 loc) • 3.98 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="theme-color" content="#909">
<title>DocumentSpark - Zero-Trust Document Viewing Service</title>
<style>
/* Reset some default browser styles */
body, h1, p, form, fieldset, label, input {
margin: 0;
padding: 0;
}
/* Make a background color for the page */
:root {
background: linear-gradient(to top, #4a90e2, #f8f8f8);
min-height: 100%;
}
/* Apply a background to the body */
body {
background: inherit;
font-size: 18px;
font-family: Arial, sans-serif;
}
/* Style the header */
header {
background: linear-gradient(to bottom right, white, mintcream, mediumspringgreen, dodgerblue, navy);
background-size: 10% 10%;
padding: 1em;
text-align: center;
border-radius: 5px;
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);
}
header :is(h1, h2) {
background: navy;
clip-path: polygon(0% 0%, 100% 0%, 90% 100%, 10% 100%);
padding: 0.2em 0.5em; /* Add padding for a better look */
text-shadow: 2px 2px 4px rgba(222,222,222, 0.8); /* Horizontal, Vertical, Blur, Color */
}
/* Style the main title */
h1 {
font-size: 1.8em;
color: #fff;
}
/* Add a subhead */
h2 {
font-size: 1.2em;
color: #fff;
}
/* Style the link in the title */
h1 a, h2 a {
text-decoration: none;
color: #fff;
}
/* Style the form */
form {
background: #fff;
padding: 1em;
border-radius: 5px;
margin: 1em auto;
max-width: 600px;
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);
}
/* Style fieldset and legend */
fieldset {
border: none;
}
legend {
font-weight: bold;
margin-bottom: 0.5em;
}
/* Style input fields and labels */
label {
display: block;
font-weight: bold;
margin-bottom: 0.5em;
}
input, button {
font-size: 18px;
width: 100%;
padding: 0.5em;
margin-bottom: 1em;
border: 1px solid #ccc;
border-radius: 4px;
}
/* Style the button */
button {
background-color: #4CAF50;
color: white;
border: none;
cursor: pointer;
}
button:hover {
background-color: #45a049;
}
/* Footer link style */
p a {
color: #fff;
text-decoration: underline;
}
p {
text-align: center;
}
</style>
</head>
<body>
<header>
<h1>DocumentSpark</h1>
<h2>Powered by <a href="https://github.com/dosyago/BrowserBoxPro">BrowserBox</a> - SecureView™ Zero-Trust Document Viewing Service</h2>
</header>
<form id="uploader" method="POST" action="/very-secure-manifest-convert.html" enctype="multipart/form-data" target="output">
<fieldset>
<legend>Document Conversion for Viewing</legend>
<p>
<label>
File upload:
<input type="file" name="pdf">
</label>
<strong>OR</strong>
</p>
<p>
<label>
URL for file:
<input type="url" name="url" placeholder="or a URL of a document">
</label>
</p>
<p>
<label>
Password/API Key for DocSpark Conversion Service:
<input required type="password" name="secret" value="Your password here">
</label>
</p>
<p>
<label>
Get link:
<button title="Upload file, get view link and begin conversion.">Begin Conversion</button>
</label>
</p>
</fieldset>
</form>
<p>
Find out more and buy a license: <a href="https://dosyago.com">DOSYAGO</a>
</p>
<script>
const secret = new URL(location).searchParams.get('secret');
const uploader = document.getElementById('uploader');
uploader.secret.value = secret;
</script>
</body>
</html>