wolfcountBot/views/info.ejs

114 lines
6.0 KiB
Plaintext

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="icon" sizes="192x192" href="/wolf.png">
<title>Wolfcount info</title>
<style>
body {
background-color: #c2c2c2 !important;
/* margin: 0;
width: 100%;
height: 100%;
display: flex;
justify-content: center;
align-items: center; */
font-family: 'Courier New', Courier, monospace;
}
/* Keyframes */
@keyframes colorchange {
from {color: aqua;}
to {color: blue}
}
h3, .translate-box {background-image: linear-gradient(to right, #c2c2c2, #6b6a6a);}
.wolfnav {margin-right:6px;width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;}
.wolfnav a {color:black; animation-name: colorchange; animation-duration: 3s; animation-iteration-count: 3;}
.wolfnav a:nth-child(1) {color:green}
.wolfnav a:nth-child(3) {color:blue}
.wolf-img img{height:760px;max-width: 100%;}
.wolf-footer {margin-right:6px;width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;background-image: linear-gradient(to right, aquamarine, blue);padding: 20px;}
/* Extra Large devices */
/* @media (min-width: 1200px) { .wolf-img img{height:633px;max-width: 90%;margin: auto 40px;} } */
/* Medium devices (tablets, 768px and up) */
@media (min-width: 768px) and (max-width: 991.98px) { .wolf-img img{height:570px;max-width: 90%;margin: auto 40px;} }
/* Galaxy A13 (and all devices sharing the same width)*/
@media (min-width: 718px) and (max-width: 720px) { .wolf-footer {padding: 10px;margin-top: 28.3vh;} }
/* Galaxy Fold (extended) */
@media (max-width: 717px) { .wolfcounting {margin: 25% auto;} }
/* Small devices (landscape phones, 376px and up) */
@media (min-width: 376px) and (max-width: 425px) { .wolf-img img{height:400px;max-width: 90%;margin: auto 25px;} }
/* Small devices (landscape phones, 321px and up) */
@media (min-width: 321px) and (max-width: 375px) { .wolf-img img{height:380px;max-width: 90%;margin: auto 25px;} }
/* Small devices (landscape phones, 320px and under) */
@media (max-width: 320px) { .translate-box{ max-width: 84%;margin-left: 27px;margin-bottom: 10px; } .wolf-img img{height:330px;max-width: 90%;margin: auto 20px;} }
/* Custom devices/others */
/* Custom for up to 1400px */
/* @media (min-width: 1201px) and (max-width:1400px) { .wolfcounting {margin: 26% auto !important;} } */
@media (min-width:992px) and (max-width: 1024px) { .wolf-img img{height:633px;max-width: 90%;margin: auto 40px;} }
/* Surface Duo and Galaxy Fold (Extended)*/
@media (min-width:717px) and (max-width:720px) { .wolf-img img{height:530px;max-width: 90%;margin: auto 40px;} }
</style>
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css" integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">
</head>
<body>
<div class="container" style="padding: 10px">
<nav class="wolfnav">
<h3 style="box-shadow: 4px 6px; border: 3px solid grey; padding: 0.2vh 5px;">
<a href="/">Back to count</a>
<a href="/privacy">Privacy Policy</a>
<a href="/tos">TOS</a>
</h3>
</nav>
<div class="img-fluid wolf-img"><a href="https://imgur.com/zltFwjV"><img src="https://i.imgur.com/zltFwjV.jpg" title="source: imgur.com" /></a></div>
</div>
<div class="border container">
<h1>Some information about this bot.</h1>
<p>The bot counts how many times the set letters are found, this will be once per message. So if someone says in this case wolf bla wolf the bot only counts one (the first one). Data refreshes every 2 minutes based on cron time (so 02, 04, 06, etc...).</p>
<p>You can add this bot by going to <a href="/invite">this page</a>. It will ofcourse ask you to go through some steps set by Discord to safely add it to the wanted server (Only 100 guilds possible, it may not be verified for more).</p>
</div><br>
<footer class="container-fluid wolf-footer">
<div class="row">
<div style="box-shadow: 4px 6px; border: 3px solid grey; padding: 0.2vh 5px;" class="translate-box col-sm-auto">
<h3>Translate this page:</h3>
<div id="google_translate_element"></div>
</div>
<div style="padding: 0 28px" class="col-sm-auto wolf-copy">
<h3 style="box-shadow: 4px 6px; border: 3px solid grey; padding: 0.2vh 5px;">©<script>document.write(new Date().getFullYear())</script> Ultimateplayer1999 (ultimateplayer#0369)</h3>
</div>
</div>
</footer>
<!-- GTRANSLATE -->
<script type="text/javascript">
function googleTranslateElementInit() {
new google.translate.TranslateElement({pageLanguage: 'en'}, 'google_translate_element');
}
</script>
<script type="text/javascript" src="//translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script>
<!-- Bootstrap JS -->
<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js" integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj" crossorigin="anonymous"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct" crossorigin="anonymous"></script>
</body>
</html>