Scribd
Upload
21 views9 pages

1painel

The document is an HTML page for a web application called 'MASTER CHEATS' featuring a login interface and a main panel for adjusting sensitivity settings and toggling features. It includes a responsive design with a dark theme, animations, and interactive elements such as tabs and notifications. The JavaScript functions handle user authentication, feature toggling, and sensitivity value generation.

Uploaded by

frailisan01
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
21 views9 pages

1painel

The document is an HTML page for a web application called 'MASTER CHEATS' featuring a login interface and a main panel for adjusting sensitivity settings and toggling features. It includes a responsive design with a dark theme, animations, and interactive elements such as tabs and notifications. The JavaScript functions handle user authentication, feature toggling, and sensitivity value generation.

Uploaded by

frailisan01
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 9

<!

DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>MASTER CHEATS</title>
<style>
body {
margin: 0;
padding: 0;
font-family: Arial, sans-serif;
background-color: #1e1e1e;
color: #fff;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
position: relative;
}

#particles-js {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: -1;
}

.login-container, .main-panel {
width: 300px;
background-color: #2c2c2c;
border-radius: 12px;
padding: 20px;
box-shadow: 0 8px 16px rgba(0, 0, 0, 0.7);
transition: all 0.3s ease;
}

.loading-circle {
width: 30px;
height: 30px;
border: 4px solid #f3f3f3;
border-top: 4px solid #ff0000;
border-radius: 50%;
animation: spin 1s linear infinite;
margin: 10px auto;
display: none;
}

@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}

.toggle-switch {
position: relative;
width: 40px;
height: 20px;
background-color: #555;
border-radius: 20px;
cursor: pointer;
transition: background-color 0.3s;
}

.toggle-switch::before {
content: "";
position: absolute;
width: 18px;
height: 18px;
background-color: white;
border-radius: 50%;
top: 1px;
left: 1px;
transition: transform 0.3s;
}

.toggle-switch.active {
background-color: #ff0000;
}

.toggle-switch.active::before {
transform: translateX(20px);
}

.feature {
display: flex;
justify-content: space-between;
align-items: center;
margin: 8px 0;
}

.range-control {
width: 100%;
}

.login-container {
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
}

.login-container input, .login-container button {


width: 100%;
padding: 10px;
margin: 10px 0;
border-radius: 4px;
border: none;
font-size: 1em;
}

.login-container input {
background-color: #333;
color: white;
}

.login-container button {
background-color: #ff0000;
color: white;
cursor: pointer;
}

.login-container .remember-me {
margin: 5px 0 10px 0;
display: flex;
align-items: center;
font-size: 0.9em;
color: #bbb;
}

.notification {
position: fixed;
bottom: 170px;
left: 50%;
transform: translateX(-50%);
background-color: #ff0000;
color: white;
padding: 15px 30px;
border-radius: 8px;
font-size: 1.2em;
display: none;
animation: fadeInOut 3s forwards;
text-align: center;
}

@keyframes fadeInOut {
0% { opacity: 0; }
10% { opacity: 1; }
90% { opacity: 1; }
100% { opacity: 0; }
}

.welcome-message {
text-align: center;
font-size: 1.5em;
margin-top: 20px;
display: none;
}

.tabs {
display: flex;
justify-content: space-between;
margin-bottom: 20px;
}

.tab {
cursor: pointer;
padding: 10px;
background-color: #444;
border-radius: 8px 8px 0 0;
width: 48%;
text-align: center;
}

.tab.active {
background-color: #ff0000;
}

.tab-content {
display: none;
}

.tab-content.active {
display: block;
}

.sensi-options {
margin-top: 20px;
display: flex;
justify-content: space-between;
align-items: center;
}

.sensi-button {
background-color: #ff0000;
color: white;
border: none;
padding: 10px 15px;
border-radius: 4px;
cursor: pointer;
}

.sensi-button.active {
background-color: #ff0000;
}

.range-control {
width: 100%;
margin-top: 10px;
}

.range-label {
display: flex;
justify-content: space-between;
font-size: 0.9em;
}

.sensi-values {
margin-top: 20px;
font-size: 1.2em;
color: #ff0000;
}
</style>
</head>
<body>

<div id="particles-js"></div>

<div class="login-container" id="login-container">


<h1>Login</h1>
<input type="text" id="username" placeholder="Usuário" required>
<input type="password" id="password" placeholder="Senha" required>
<div class="loading-circle" id="loading-circle"></div>

<div class="remember-me">
<input type="checkbox" id="remember-me"> Lembrar-me
</div>

<button onclick="authenticate()">Entrar</button>
</div>

<div class="welcome-message" id="welcome-message">


<p>Bem-vindo, MASTER CHEATS!</p>
</div>

<div class="main-panel" id="main-panel" style="display: none;">


<div class="header">
<h1 class="title">MASTER SENSI</h1>
</div>

<div class="tabs">
<div class="tab active" onclick="showTab('head')">HEAD</div>
<div class="tab" onclick="showTab('mira')">MIRA</div>
<div class="tab" onclick="showTab('sensi')">SENSI</div>
</div>

<div id="head" class="tab-content active">


<div class="feature">
<span>HS 50% IOS</span>
<div class="toggle-switch" onclick="toggleFeature(this, 'headtrick
ativado!')"></div>
</div>
<div class="feature">
<span>HS 50% ANDROID</span>
<div class="toggle-switch" onclick="toggleFeature(this, 'aimlok
ativado!')"></div>
</div>
</div>

<div id="mira" class="tab-content">


<div class="feature">
<span>Não tremer mira</span>
<div class="toggle-switch" onclick="toggleFeature(this, 'Não tremer
mira ativado!')"></div>
</div>
<div class="feature">
<span>Não pinar mira</span>
<div class="toggle-switch" onclick="toggleFeature(this, 'Não pinar
mira ativado!')"></div>
</div>
</div>

<div id="sensi" class="tab-content">


<div class="range-label">
<span>0%</span>
<span>100%</span>
</div>
<input type="range" id="sensi-range" class="range-control" min="0"
max="100" value="50" oninput="updateSensiValue(this.value)">
<p id="sensi-output">Sensibilidade: 50%</p>

<div class="sensi-options">
<button class="sensi-button" onclick="generateSensiFF()">Gerar
Sensi FF</button>
</div>

<div class="sensi-values" id="sensi-values">

</div>
</div>

</div>

<div class="notification" id="notification"></div>

<script src="https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"></
script> <!-- Biblioteca de partículas -->

<script>
particlesJS("particles-js", {
particles: {
number: {
value: 80,
density: {
enable: true,
value_area: 800
}
},
color: {
value: "#ff0000"
},
shape: {
type: "circle",
stroke: {
width: 0,
color: "#000000"
},
polygon: {
nb_sides: 5
}
},
opacity: {
value: 0.5,
random: true,
anim: {
enable: true,
speed: 1,
opacity_min: 0.1,
sync: false
}
},
size: {
value: 3,
random: true,
anim: {
enable: false,
speed: 4,
size_min: 0.1,
sync: false
}
},
line_linked: {
enable: true,
distance: 150,
color: "#ff0000",
opacity: 0.4,
width: 1
},
move: {
enable: true,
speed: 6,
direction: "none",
random: false,
straight: false,
out_mode: "out",
bounce: false,
attract: {
enable: false,
rotateX: 600,
rotateY: 1200
}
}
},
interactivity: {
detect_on: "canvas",
events: {
onhover: {
enable: true,
mode: "repulse"
},
onclick: {
enable: true,
mode: "push"
},
resize: true
},
modes: {
repulse: {
distance: 100,
duration: 0.4
},
push: {
particles_nb: 4
}
}
},
retina_detect: true
});

function authenticate() {
var username = document.getElementById("username").value;
var password = document.getElementById("password").value;
var loadingCircle = document.getElementById("loading-circle");

loadingCircle.style.display = "block";
setTimeout(function() {
loadingCircle.style.display = "none";
if (username === "1" && password === "1") {
showNotification("Bem-vindo, MASTER CHEATS!");
document.getElementById("login-container").style.display =
"none";
setTimeout(function() {
document.getElementById("welcome-message").style.display =
"block";
}, 500);
setTimeout(function() {
document.getElementById("welcome-message").style.display =
"none";
document.getElementById("main-panel").style.display =
"block";
}, 3000);
} else {
showNotification("Usuário ou senha inválidos!");
}
}, 2000);
}

function showNotification(message) {
var notification = document.getElementById("notification");
notification.textContent = message;
notification.style.display = "block";

setTimeout(function() {
notification.style.display = "none";
}, 3000);
}

function showTab(tabName) {
var tabContents = document.querySelectorAll(".tab-content");
tabContents.forEach(function(content) {
content.classList.remove("active");
});

document.getElementById(tabName).classList.add("active");
document.querySelector(".tab." + tabName).classList.add("active");
}

function toggleFeature(element, message) {


element.classList.toggle("active");
showNotification(message);
}

function updateSensiValue(value) {
document.getElementById("sensi-output").textContent = `Sensibilidade: $
{value}%`;
}

function generateSensiFF() {
var generalSensi = Math.floor(Math.random() * 201);
var redDotSensi = Math.floor(Math.random() * 201);
var twoX = Math.floor(Math.random() * 201);
var fourX = Math.floor(Math.random() * 201);

document.getElementById("sensi-values").innerHTML = `
<p>Geral: ${generalSensi}%</p>
<p>Ponto Vermelho: ${redDotSensi}%</p>
<p>2x: ${twoX}%</p>
<p>4x: ${fourX}%</p>
`;
}
</script>
</body>
</html>

You might also like