96 lines
4.5 KiB
HTML
96 lines
4.5 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>RE.DFINED BIO</title>
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<style>
|
|
|
|
textarea {
|
|
resize: none;
|
|
}
|
|
|
|
textarea::-webkit-scrollbar {
|
|
width: 12px;
|
|
}
|
|
|
|
textarea::-webkit-scrollbar-track {
|
|
background: rgba(136, 136, 136, 0.2);
|
|
border-radius: 10px;
|
|
}
|
|
|
|
textarea::-webkit-scrollbar-thumb {
|
|
background: rgba(214, 214, 214, 0.5);
|
|
border-radius: 10px;
|
|
}
|
|
|
|
textarea::-webkit-scrollbar-thumb:hover {
|
|
background: rgba(85, 85, 85, 0.8);
|
|
}
|
|
.center {
|
|
display: block;
|
|
margin-left: auto;
|
|
margin-right: auto;
|
|
}
|
|
</style>
|
|
<script>
|
|
|
|
function saveFormData() {
|
|
localStorage.setItem('lastfm_username', document.getElementById('lastfm_username').value);
|
|
localStorage.setItem('y99_session_token', document.getElementById('y99_session_token').value);
|
|
localStorage.setItem('bio_template', document.getElementById('bio_template').value);
|
|
}
|
|
|
|
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
|
|
document.getElementById('lastfm_username').value = localStorage.getItem('lastfm_username') || '';
|
|
document.getElementById('y99_session_token').value = localStorage.getItem('y99_session_token') || '';
|
|
document.getElementById('bio_template').value = localStorage.getItem('bio_template') || '';
|
|
|
|
|
|
document.getElementById('monitoringForm').addEventListener('input', saveFormData);
|
|
});
|
|
</script>
|
|
</head>
|
|
<body class="dark:bg-gray-900 text-white min-h-screen flex items-center justify-center backdrop-filter backdrop-blur-lg" style="background-image: url('https://cdn.neowin.com/news/images/galleries/4686/1654793763_2-ventura-bloom-dark.jpg'); background-size: cover;">
|
|
|
|
|
|
<div class="container max-w-lg mx-auto bg-black bg-opacity-30 backdrop-blur-md rounded-xl shadow-lg p-8 text-center">
|
|
|
|
<img class="center" style="height:200px;" src="https://cloud.re.dfined.net/apps/files_sharing/publicpreview/k6sCc87WjRDbkHM?file=/&fileId=2041&x=1924&y=924&a=true&etag=25010b217b1059db37a0f3aa37026641" alt="Logo">
|
|
|
|
|
|
<form id="monitoringForm" method="post" action="/start_monitoring" class="space-y-4">
|
|
<div class="form-group">
|
|
<label for="lastfm_username" class="block text-left dark:text-gray-300 font-semibold mb-2">Last.fm Username:</label>
|
|
<input type="text" id="lastfm_username" name="lastfm_username" required
|
|
class="w-full p-3 border dark:border-gray-500 rounded-lg shadow-sm bg-white bg-opacity-20 text-white focus:outline-none focus:ring-2 focus:ring-purple-400">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="y99_session_token" class="block text-left dark:text-gray-300 font-semibold mb-2">Y99 Session Token:</label>
|
|
<input type="password" id="y99_session_token" name="y99_session_token" required
|
|
class="w-full p-3 border dark:border-gray-500 rounded-lg shadow-sm bg-white bg-opacity-20 text-white focus:outline-none focus:ring-2 focus:ring-purple-400">
|
|
</div>
|
|
|
|
<div class="form-group">
|
|
<label for="bio_template" class="block text-left text-gray-300 font-semibold mb-2">Bio Template:</label>
|
|
<textarea id="bio_template" style="resize: none; height: 250px;" name="bio_template" required
|
|
class="w-full p-3 border dark:border-gray-500 rounded-lg shadow-sm bg-white bg-opacity-20 text-white focus:outline-none focus:ring-2 focus:ring-purple-400"
|
|
placeholder="Use {song_title} and {youtube_link} as placeholders."></textarea>
|
|
<small class="block text-left dark:text-gray-400">Use <code>{song_title}</code> and <code>{youtube_link}</code> as placeholders.</small>
|
|
</div>
|
|
|
|
<input type="submit" value="Start Monitoring"
|
|
class="w-full dark:bg-purple-500 hover:bg-purple-700 text-white font-bold py-3 rounded-lg shadow-lg cursor-pointer transition duration-200 ease-in-out">
|
|
</form>
|
|
|
|
<p class="text-sm dark:text-gray-400 mt-6">Powered by Last.fm & Y99</p>
|
|
<a class="text-sm dark:text-gray-400 mt-6">Made with ♡ by Skye [RE.DFINED]</a>
|
|
</div>
|
|
|
|
</body>
|
|
</html>
|