added terms page

This commit is contained in:
BFlat committed 2022-05-23 17:16:36 +01:00
1 parent 2f2889aa27
commit 19299d7764
1 file changed
+358
+358
View File
@@ -0,0 +1,358 @@
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<!-- Bootstrap CSS -->
<link
href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3"
crossorigin="anonymous"
/>
<link rel="stylesheet" href="style.css" />
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Fira+Sans:wght@100;200;300;400;500;600;700;800;900&display=swap"
rel="stylesheet"
/>
<script src="https://unpkg.com/scrollreveal"></script>
<script
src="https://kit.fontawesome.com/a73498f2ed.js"
crossorigin="anonymous"
></script>
<title>FakeYou. Deep Fake Text to Speech.</title>
</head>
<body>
<div class="bg-gradient">
<div class="particles-container">
<div id="particles-js"></div>
</div>
<nav class="navbar navbar-expand-lg navbar-dark navbar-fixed py-3">
<div class="container">
<a class="navbar-brand me-5 pr-8" href="index.html">
<img src="assets/FakeYou-Logo-Left.png" alt="" height="34" />
</a>
<button
class="navbar-toggler"
type="button"
data-toggle="collapse"
data-target="#navbarNavDropdown"
aria-controls="navbarNavDropdown"
aria-expanded="false"
aria-label="Toggle navigation"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarNavDropdown">
<ul class="navbar-nav">
<li class="nav-item active">
<a class="nav-link" href="#">Clone Your Voice!</a>
</li>
<li class="nav-item dropdown">
<a
class="nav-link dropdown-toggle"
href="#"
id="navbarDropdownMenuLink"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
>
Create
</a>
<div
class="dropdown-menu"
aria-labelledby="navbarDropdownMenuLink"
>
<a class="dropdown-item" href="#">TTS</a>
<a class="dropdown-item" href="#">Video</a>
</div>
</li>
<li class="nav-item dropdown">
<a
class="nav-link dropdown-toggle"
href="#"
id="navbarDropdownMenuLink"
data-toggle="dropdown"
aria-haspopup="true"
aria-expanded="false"
>
Community
</a>
<div
class="dropdown-menu"
aria-labelledby="navbarDropdownMenuLink"
>
<a class="dropdown-item" href="#">Contribute/Upload</a>
<a class="dropdown-item" href="#">Leaderboard</a>
<a class="dropdown-item" href="#">Patrons</a>
<a class="dropdown-item" href="#">Feed</a>
<a class="dropdown-item" href="#">My Data</a>
<a class="dropdown-item" href="#">About Us</a>
<a class="dropdown-item" href="#">Terms of Use</a>
</div>
</li>
<li class="nav-item">
<a class="nav-link" href="#">Developers</a>
</li>
</ul>
</div>
<div
class="d-grid gap-2 d-flex justify-content-start d-none d-lg-block"
>
<a class="nav-login me-4" href="">Login</a>
<button type="button" class="btn btn-primary btn-lg">
Sign up
</button>
</div>
</div>
</nav>
<div class="container py-5">
<div class="d-flex flex-column">
<h1 class="display-5 fw-bold">Terms and Conditions</h1>
<h3 class="mb-4">Please use this technology responsibly.</h3>
</div>
</div>
<div class="container-panel pt-4 pb-5">
<div class="panel p-3 p-lg-4 load-hidden mt-5 mt-lg-0">
<h1 class="panel-title">Terms of Use</h1>
<div class="py-6 d-flex flex-column gap-4">
<p>
We do not condone the use of FakeYou for any type of deception,
slur, abuse, or mistreatment of any individual or group. Please
report such abuses to our community staff on Discord. Bad actors
will have their access revoked and materials deleted.<br /><br />This
is a research technololgy for fun. You may not use FakeYou
deepfakes for commercial use.<br /><br />Do not engage in unlawful
activity or attempt to impersonate any person, company, or other
entity. All published usages must be labled as "deep fake".<br /><br />The
audio we generate is watermarked, and we will soon release a tool
to verify that it is deep fake generated and trace it back to its
source.
</p>
<div>
<h2 class="mb-4">Takedown Requests</h2>
<p>
The machine learning models and content at FakeYou are
user-submitted, but we'll be happy to remove content for any
reason for copyright holders, original speakers, voice actors,
et al. Please send us an email to copyright@storyteller.io with
details in order to request a takedown.
</p>
</div>
<div>
<h2 class="mb-4">Voice Acting & Musician Jobs</h2>
<p>
If you're a voice actor or musician, we're looking to hire
talented performers to help us build commercial-friendly AI
voices. (The user-submitted models on FakeYou are just a
technology demonstration and may not be used commercially.) We
want to empower small creators (game designers, musicians, and
more) to voice, sing, and speak emotion into their work. Please
reach out to jobs@storyteller.io if you'd like to work with us.
We can pay a flat fee and/or royalty. Please get in touch to
learn more!
</p>
</div>
</div>
</div>
</div>
<div class="container">
<hr />
</div>
<footer class="d-flex flex-column container py-5 gap-4">
<div
class="text-center align-items-center justify-content-center gap-3"
>
<a class="footer-link" href="#">Text to Speech</a>
&nbsp;|&nbsp;
<a class="footer-link" href="#">Video</a>
&nbsp;|&nbsp;
<a class="footer-link" href="#">Upload</a>
&nbsp;|&nbsp;
<a class="footer-link" href="#">Leaderboard</a>
&nbsp;|&nbsp;
<a class="footer-link" href="#">Patrons</a>
&nbsp;|&nbsp;
<a class="footer-link" href="#">Feed</a>
&nbsp;|&nbsp;
<a class="footer-link" href="#">API Docs</a>
&nbsp;|&nbsp;
<a class="footer-link" href="#">About Us</a>
&nbsp;|&nbsp;
<a class="footer-link" href="#">Terms of Use</a>
</div>
<div class="d-flex justify-content-center gap-4">
<a class="social-icon" href="#"
><i class="fa-brands fa-discord"></i
></a>
<a class="social-icon" href="#"
><i class="fa-brands fa-twitch"></i
></a>
<a class="social-icon" href="#"
><i class="fa-brands fa-twitter"></i
></a>
<a class="social-icon" href="#"
><i class="fa-brands fa-facebook"></i
></a>
<a class="social-icon" href="#"
><i class="fa-brands fa-patreon"></i
></a>
</div>
<div class="d-flex justify-content-center">
Built by&nbsp<a class="footer-link" href="#">echelon</a>&nbspin
Atlanta.
</div>
</footer>
</div>
<!-- Scripts -->
<script
src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous"
></script>
<script
src="https://cdn.jsdelivr.net/npm/popper.js@1.14.7/dist/umd/popper.min.js"
integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
crossorigin="anonymous"
></script>
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@4.3.1/dist/js/bootstrap.min.js"
integrity="sha384-JjSmVgyd0p3pXB1rRibZUAYoIIy6OrQ6VrjIEaFf/nJGzIxFDsf4x0xIM+B07jRM"
crossorigin="anonymous"
></script>
<script>
ScrollReveal().reveal(".ani1", { delay: 100, distance: "20px" });
ScrollReveal().reveal(".ani2", { delay: 200, distance: "20px" });
ScrollReveal().reveal(".ani3", { delay: 250, distance: "20px" });
ScrollReveal().reveal(".ani4", { delay: 150, distance: "20px" });
ScrollReveal().reveal(".panel", { delay: 0, distance: "100px" });
</script>
<script src="https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"></script>
<script type="text/javascript">
particlesJS("particles-js", {
particles: {
number: {
value: 160,
density: {
enable: true,
value_area: 800,
},
},
color: {
value: "#ffffff",
},
shape: {
type: "circle",
stroke: {
width: 0,
color: "#000000",
},
polygon: {
nb_sides: 5,
},
image: {
src: "img/github.svg",
width: 100,
height: 100,
},
},
opacity: {
value: 0.1,
random: false,
anim: {
enable: false,
speed: 1,
opacity_min: 0,
sync: false,
},
},
size: {
value: 4,
random: true,
anim: {
enable: false,
speed: 4,
size_min: 0.3,
sync: false,
},
},
line_linked: {
enable: false,
distance: 150,
color: "#ffffff",
opacity: 0.4,
width: 1,
},
move: {
enable: true,
speed: 0.5,
direction: "top",
random: true,
straight: false,
out_mode: "out",
bounce: false,
attract: {
enable: false,
rotateX: 600,
rotateY: 600,
},
},
},
interactivity: {
detect_on: "canvas",
events: {
onhover: {
enable: false,
mode: "bubble",
},
onclick: {
enable: false,
mode: "repulse",
},
resize: true,
},
modes: {
grab: {
distance: 400,
line_linked: {
opacity: 1,
},
},
bubble: {
distance: 250,
size: 0,
duration: 2,
opacity: 0,
speed: 3,
},
repulse: {
distance: 400,
duration: 0.4,
},
push: {
particles_nb: 4,
},
remove: {
particles_nb: 2,
},
},
},
retina_detect: true,
});
</script>
</body>
</html>