heroesclans
heroesclans
Cargado por
LinkGameSXCopyright:
Formatos disponibles
heroesclans
heroesclans
Cargado por
LinkGameSXDerechos de autor
Formatos disponibles
Compartir este documento
Compartir o incrustar documentos
¿Le pareció útil este documento?
¿Este contenido es inapropiado?
Copyright:
Formatos disponibles
heroesclans
heroesclans
Cargado por
LinkGameSXCopyright:
Formatos disponibles
function enviarCorreo(e) {
// Obtener la hoja de cálculo y los datos del formulario
var hojaCalculo = SpreadsheetApp.getActiveSpreadsheet();
console.log("Nombre de la hoja de cálculo: " + hojaCalculo.getName());
var hojaRespuestas = hojaCalculo.getSheetByName("Selección de clanes"); //
Reemplaza con el nombre correcto de tu hoja
console.log("Hoja de respuestas: " + hojaRespuestas.getName());
// Obtener la última fila (que siempre estará llena)
var ultimaFila = hojaRespuestas.getLastRow();
console.log("Última fila: " + ultimaFila);
// Obtener los datos del estudiante
var nombreEstudiante = hojaRespuestas.getRange(ultimaFila, 2).getValue(); //
Columna B
var correoEstudiante = hojaRespuestas.getRange(ultimaFila, 3).getValue(); //
Columna C
var clan = hojaRespuestas.getRange(ultimaFila, 4).getValue(); // Columna D
console.log("Nombre del estudiante: " + nombreEstudiante);
console.log("Correo electrónico: " + correoEstudiante);
console.log("Clan: " + clan);
// Configurar correos personalizados para cada clan
var cuerpoPersonalizado;
switch (clan) {
case "Sirius":
cuerpoPersonalizado = `
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
@import url('https://fonts.googleapis.com/css2?
family=Inter:wght@200;300;400;600;800&display=swap');
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Inter', sans-serif;
}
body {
margin: 0;
background: #000;
color: #fff;
overflow-x: hidden;
min-height: 100vh;
}
.container {
position: relative;
min-height: 100vh;
background: linear-gradient(135deg, #000000 0%, #0a1f0a 50%, #000000
100%);
overflow: hidden;
display: flex;
flex-direction: column;
padding-bottom: 100px;
}
.star {
position: absolute;
background: #fff;
border-radius: 50%;
animation: twinkle 1.5s infinite ease-in-out;
}
.content {
position: relative;
z-index: 2;
max-width: 1200px;
margin: 0 auto;
padding: 60px 20px;
text-align: center;
display: flex;
flex-direction: column;
justify-content: center;
min-height: calc(100vh - 100px);
}
.welcome-text {
font-size: 32px;
font-weight: 600;
letter-spacing: -1px;
margin-bottom: 20px;
color: #fff;
transform: skew(-5deg);
}
.clan-name {
position: relative;
font-size: 180px;
font-weight: 800;
letter-spacing: -5px;
line-height: 0.9;
color: #4CAF50;
margin: 20px auto;
transform: skew(-5deg);
text-shadow:
0 0 20px rgba(76, 175, 80, 0.5),
0 0 40px rgba(76, 175, 80, 0.3),
0 0 60px rgba(76, 175, 80, 0.2),
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000;
animation: textGlow 3s infinite;
}
@keyframes textGlow {
0% {
text-shadow:
0 0 20px rgba(76, 175, 80, 0.5),
0 0 40px rgba(76, 175, 80, 0.3),
0 0 60px rgba(76, 175, 80, 0.2),
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000;
}
50% {
text-shadow:
0 0 30px rgba(76, 175, 80, 0.8),
0 0 60px rgba(76, 175, 80, 0.6),
0 0 90px rgba(76, 175, 80, 0.4),
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000;
}
100% {
text-shadow:
0 0 20px rgba(76, 175, 80, 0.5),
0 0 40px rgba(76, 175, 80, 0.3),
0 0 60px rgba(76, 175, 80, 0.2),
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000;
}
}
.clan-name::before {
content: '';
position: absolute;
top: -20px;
left: -20px;
right: -20px;
bottom: -20px;
background: radial-gradient(circle,
rgba(76, 175, 80, 0) 30%,
rgba(76, 175, 80, 0.2) 50%,
rgba(76, 175, 80, 0.1) 70%,
transparent 100%
);
opacity: 0;
animation: explosionPulse 3s infinite;
pointer-events: none;
border-radius: 50%;
filter: blur(15px);
}
.join-button {
position: relative;
display: inline-flex;
align-items: center;
padding: 20px 40px;
background: #4CAF50;
color: #000;
text-decoration: none;
font-size: 32px;
font-weight: 600;
letter-spacing: -1px;
margin: 40px auto;
transform: skew(-5deg);
overflow: hidden;
transition: all 0.3s ease;
}
.join-button::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255, 255, 255,
0.4), transparent);
transition: 0.5s;
}
.join-button:hover::before {
left: 100%;
}
.join-button:hover {
background: #45a049;
color: #fff;
transform: skew(-5deg) scale(1.05);
}
@keyframes explosionPulse {
0% {
transform: scale(0.8);
opacity: 0;
}
50% {
transform: scale(1.2);
opacity: 0.5;
}
100% {
transform: scale(0.8);
opacity: 0;
}
}
@keyframes twinkle {
0%, 100% {
opacity: 0.3;
}
50% {
opacity: 1;
}
}
.footer {
position: fixed;
bottom: 0;
width: 100%;
background: rgba(0, 0, 0, 0.95);
backdrop-filter: blur(10px);
padding: 25px;
border-top: 2px solid rgba(76, 175, 80, 0.5);
z-index: 100;
}
.footer-content {
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 20px;
}
.footer-left, .footer-right {
display: flex;
align-items: center;
gap: 30px;
flex-wrap: wrap;
}
.footer-logo {
font-size: 18px;
font-weight: 600;
color: #fff;
text-decoration: none;
letter-spacing: -0.5px;
opacity: 0.7;
transition: all 0.3s ease;
display: flex;
align-items: center;
gap: 10px;
white-space: nowrap;
}
.footer-logo:hover {
opacity: 1;
color: #4CAF50;
}
.footer-logo i {
font-size: 24px;
}
@media (max-width: 768px) {
.clan-name {
font-size: 100px;
}
.welcome-text {
font-size: 24px;
}
.join-button {
font-size: 24px;
padding: 15px 30px;
}
.footer-content {
justify-content: center;
text-align: center;
}
.footer-left, .footer-right {
justify-content: center;
}
}
@media (max-width: 480px) {
.clan-name {
font-size: 60px;
}
.welcome-text {
font-size: 20px;
}
.join-button {
font-size: 20px;
padding: 12px 24px;
}
.footer-logo {
font-size: 16px;
}
}
</style>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-
awesome/6.0.0/css/all.min.css">
</head>
<body>
<div class="container">
<div class="content">
<div class="welcome-text">HAS SIDO ASIGNADO AL</div>
<div class="clan-name">CLAN<br>SIRIUS</div>
<p style="color: #4CAF50; font-size: 24px; font-weight: 600; letter-
spacing: -1px;">
ILUMINA TU CAMINO ENTRE LAS ESTRELLAS
</p>
<a href="https://discord.gg/Ty9RVhedS4" class="join-button"
target="_blank">ÚNETE A TU CLAN</a>
</div>
</div>
<footer class="footer">
<div class="footer-content">
<div class="footer-left">
<a href="https://www.skool.com/heroesacademy" class="footer-logo"
target="_blank">
<i class="fas fa-graduation-cap"></i>
HEROES ACADEMY
</a>
</div>
<div class="footer-right">
<a href="https://www.skool.com/@chief-alejandro?g=heroesacademy"
class="footer-logo" target="_blank">
<i class="fas fa-envelope"></i>
CONTACTO
</a>
<a href="https://www.instagram.com/esunheroe/" class="footer-logo"
target="_blank">
<i class="fab fa-instagram"></i>
INSTAGRAM
</a>
</div>
</div>
</footer>
<script>
function createStars() {
const container = document.querySelector('.container');
for (let i = 0; i < 200; i++) {
const star = document.createElement('div');
star.className = 'star';
star.style.width = Math.random() * 3 + 'px';
star.style.height = star.style.width;
star.style.left = Math.random() * 100 + '%';
star.style.top = Math.random() * 100 + '%';
star.style.animationDelay = Math.random() * 2 + 's';
container.appendChild(star);
}
}
createStars();
</script>
</body>
</html>
`;
break;
case "Arturo":
cuerpoPersonalizado = `
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
@import url('https://fonts.googleapis.com/css2?
family=Inter:wght@200;300;400;600;800&display=swap');
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Inter', sans-serif;
}
body {
margin: 0;
background: #000;
color: #fff;
overflow-x: hidden;
min-height: 100vh;
}
.container {
position: relative;
min-height: 100vh;
background: linear-gradient(135deg, #000000 0%, #1a1700 50%, #000000
100%);
overflow: hidden;
display: flex;
flex-direction: column;
padding-bottom: 100px;
}
.star {
position: absolute;
background: #fff;
border-radius: 50%;
animation: twinkle 1.5s infinite ease-in-out;
}
.content {
position: relative;
z-index: 2;
max-width: 1200px;
margin: 0 auto;
padding: 60px 20px;
text-align: center;
display: flex;
flex-direction: column;
justify-content: center;
min-height: calc(100vh - 100px);
}
.welcome-text {
font-size: 32px;
font-weight: 600;
letter-spacing: -1px;
margin-bottom: 20px;
color: #fff;
transform: skew(-5deg);
}
.clan-name {
position: relative;
font-size: 180px;
font-weight: 800;
letter-spacing: -5px;
line-height: 0.9;
color: #FFD700;
margin: 20px auto;
transform: skew(-5deg);
text-shadow:
0 0 20px rgba(255, 215, 0, 0.5),
0 0 40px rgba(255, 215, 0, 0.3),
0 0 60px rgba(255, 215, 0, 0.2),
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000;
animation: textGlow 3s infinite;
}
@keyframes textGlow {
0% {
text-shadow:
0 0 20px rgba(255, 215, 0, 0.5),
0 0 40px rgba(255, 215, 0, 0.3),
0 0 60px rgba(255, 215, 0, 0.2),
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000;
}
50% {
text-shadow:
0 0 30px rgba(255, 215, 0, 0.8),
0 0 60px rgba(255, 215, 0, 0.6),
0 0 90px rgba(255, 215, 0, 0.4),
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000;
}
100% {
text-shadow:
0 0 20px rgba(255, 215, 0, 0.5),
0 0 40px rgba(255, 215, 0, 0.3),
0 0 60px rgba(255, 215, 0, 0.2),
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000;
}
}
.clan-name::before {
content: '';
position: absolute;
top: -20px;
left: -20px;
right: -20px;
bottom: -20px;
background: radial-gradient(circle,
rgba(255, 215, 0, 0) 30%,
rgba(255, 215, 0, 0.2) 50%,
rgba(255, 215, 0, 0.1) 70%,
transparent 100%
);
opacity: 0;
animation: explosionPulse 3s infinite;
pointer-events: none;
border-radius: 50%;
filter: blur(15px);
}
.join-button {
position: relative;
display: inline-flex;
align-items: center;
padding: 20px 40px;
background: #FFD700;
color: #000;
text-decoration: none;
font-size: 32px;
font-weight: 600;
letter-spacing: -1px;
margin: 40px auto;
transform: skew(-5deg);
overflow: hidden;
transition: all 0.3s ease;
}
.join-button::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255, 255, 255,
0.4), transparent);
transition: 0.5s;
}
.join-button:hover::before {
left: 100%;
}
.join-button:hover {
background: #FFE55C;
color: #000;
transform: skew(-5deg) scale(1.05);
}
@keyframes explosionPulse {
0% {
transform: scale(0.8);
opacity: 0;
}
50% {
transform: scale(1.2);
opacity: 0.5;
}
100% {
transform: scale(0.8);
opacity: 0;
}
}
@keyframes twinkle {
0%, 100% {
opacity: 0.3;
}
50% {
opacity: 1;
}
}
.footer {
position: fixed;
bottom: 0;
width: 100%;
background: rgba(0, 0, 0, 0.95);
backdrop-filter: blur(10px);
padding: 25px;
border-top: 2px solid rgba(255, 215, 0, 0.5);
z-index: 100;
}
.footer-content {
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 20px;
}
.footer-left, .footer-right {
display: flex;
align-items: center;
gap: 30px;
flex-wrap: wrap;
}
.footer-logo {
font-size: 18px;
font-weight: 600;
color: #fff;
text-decoration: none;
letter-spacing: -0.5px;
opacity: 0.7;
transition: all 0.3s ease;
display: flex;
align-items: center;
gap: 10px;
white-space: nowrap;
}
.footer-logo:hover {
opacity: 1;
color: #FFD700;
}
.footer-logo i {
font-size: 24px;
}
@media (max-width: 768px) {
.clan-name {
font-size: 100px;
}
.welcome-text {
font-size: 24px;
}
.join-button {
font-size: 24px;
padding: 15px 30px;
}
.footer-content {
justify-content: center;
text-align: center;
}
.footer-left, .footer-right {
justify-content: center;
}
}
@media (max-width: 480px) {
.clan-name {
font-size: 60px;
}
.welcome-text {
font-size: 20px;
}
.join-button {
font-size: 20px;
padding: 12px 24px;
}
.footer-logo {
font-size: 16px;
}
}
</style>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-
awesome/6.0.0/css/all.min.css">
</head>
<body>
<div class="container">
<div class="content">
<div class="welcome-text">HAS SIDO ASIGNADO AL</div>
<div class="clan-name">CLAN<br>ARTURO</div>
<p style="color: #FFD700; font-size: 24px; font-weight: 600; letter-
spacing: -1px;">
Las estrellas fugaces recorren distancias enormes sin parar. Llego
el momento de convertirte en una de ellas.
</p>
<a href="https://discord.gg/Ty9RVhedS4" class="join-button"
target="_blank">ÚNETE A TU CLAN</a>
</div>
</div>
<footer class="footer">
<div class="footer-content">
<div class="footer-left">
<a href="https://www.skool.com/heroesacademy" class="footer-logo"
target="_blank">
<i class="fas fa-graduation-cap"></i>
HEROES ACADEMY
</a>
</div>
<div class="footer-right">
<a href="https://www.skool.com/@chief-alejandro?g=heroesacademy"
class="footer-logo" target="_blank">
<i class="fas fa-envelope"></i>
CONTACTO
</a>
<a href="https://www.instagram.com/esunheroe/" class="footer-logo"
target="_blank">
<i class="fab fa-instagram"></i>
INSTAGRAM
</a>
</div>
</div>
</footer>
<script>
function createStars() {
const container = document.querySelector('.container');
for (let i = 0; i < 200; i++) {
const star = document.createElement('div');
star.className = 'star';
star.style.width = Math.random() * 3 + 'px';
star.style.height = star.style.width;
star.style.left = Math.random() * 100 + '%';
star.style.top = Math.random() * 100 + '%';
star.style.animationDelay = Math.random() * 2 + 's';
container.appendChild(star);
}
}
createStars();
</script>
</body>
</html>
`;
break;
case "Antares":
cuerpoPersonalizado = `
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
@import url('https://fonts.googleapis.com/css2?
family=Inter:wght@200;300;400;600;800&display=swap');
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Inter', sans-serif;
}
body {
margin: 0;
background: #000;
color: #fff;
overflow-x: hidden;
min-height: 100vh;
}
.container {
position: relative;
min-height: 100vh;
background: linear-gradient(135deg, #000000 0%, #1a0808 50%, #000000
100%);
overflow: hidden;
display: flex;
flex-direction: column;
padding-bottom: 100px;
}
.star {
position: absolute;
background: #fff;
border-radius: 50%;
animation: twinkle 1.5s infinite ease-in-out;
}
.content {
position: relative;
z-index: 2;
max-width: 1200px;
margin: 0 auto;
padding: 60px 20px;
text-align: center;
display: flex;
flex-direction: column;
justify-content: center;
min-height: calc(100vh - 100px);
}
.welcome-text {
font-size: 32px;
font-weight: 600;
letter-spacing: -1px;
margin-bottom: 20px;
color: #fff;
transform: skew(-5deg);
}
.clan-name {
position: relative;
font-size: 180px;
font-weight: 800;
letter-spacing: -5px;
line-height: 0.9;
color: #ff1458;
margin: 20px auto;
transform: skew(-5deg);
text-shadow:
0 0 20px rgba(255, 20, 88, 0.5),
0 0 40px rgba(255, 20, 88, 0.3),
0 0 60px rgba(255, 20, 88, 0.2),
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000;
animation: textGlow 3s infinite;
}
@keyframes textGlow {
0% {
text-shadow:
0 0 20px rgba(255, 20, 88, 0.5),
0 0 40px rgba(255, 20, 88, 0.3),
0 0 60px rgba(255, 20, 88, 0.2),
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000;
}
50% {
text-shadow:
0 0 30px rgba(255, 20, 88, 0.8),
0 0 60px rgba(255, 20, 88, 0.6),
0 0 90px rgba(255, 20, 88, 0.4),
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000;
}
100% {
text-shadow:
0 0 20px rgba(255, 20, 88, 0.5),
0 0 40px rgba(255, 20, 88, 0.3),
0 0 60px rgba(255, 20, 88, 0.2),
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000;
}
}
.clan-name::before {
content: '';
position: absolute;
top: -20px;
left: -20px;
right: -20px;
bottom: -20px;
background: radial-gradient(circle,
rgba(255, 20, 88, 0) 30%,
rgba(255, 20, 88, 0.2) 50%,
rgba(255, 20, 88, 0.1) 70%,
transparent 100%
);
opacity: 0;
animation: explosionPulse 3s infinite;
pointer-events: none;
border-radius: 50%;
filter: blur(15px);
}
.join-button {
position: relative;
display: inline-flex;
align-items: center;
padding: 20px 40px;
background: #ff1458;
color: #fff;
text-decoration: none;
font-size: 32px;
font-weight: 600;
letter-spacing: -1px;
margin: 40px auto;
transform: skew(-5deg);
overflow: hidden;
transition: all 0.3s ease;
}
.join-button::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255, 255, 255,
0.4), transparent);
transition: 0.5s;
}
.join-button:hover::before {
left: 100%;
}
.join-button:hover {
background: #d1124a;
color: #fff;
transform: skew(-5deg) scale(1.05);
}
@keyframes explosionPulse {
0% {
transform: scale(0.8);
opacity: 0;
}
50% {
transform: scale(1.2);
opacity: 0.5;
}
100% {
transform: scale(0.8);
opacity: 0;
}
}
@keyframes twinkle {
0%, 100% {
opacity: 0.3;
}
50% {
opacity: 1;
}
}
.footer {
position: fixed;
bottom: 0;
width: 100%;
background: rgba(0, 0, 0, 0.95);
backdrop-filter: blur(10px);
padding: 25px;
border-top: 2px solid rgba(255, 20, 88, 0.5);
z-index: 100;
}
.footer-content {
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 20px;
}
.footer-left, .footer-right {
display: flex;
align-items: center;
gap: 30px;
flex-wrap: wrap;
}
.footer-logo {
font-size: 18px;
font-weight: 600;
color: #fff;
text-decoration: none;
letter-spacing: -0.5px;
opacity: 0.7;
transition: all 0.3s ease;
display: flex;
align-items: center;
gap: 10px;
white-space: nowrap;
}
.footer-logo:hover {
opacity: 1;
color: #ff1458;
}
.footer-logo i {
font-size: 24px;
}
@media (max-width: 768px) {
.clan-name {
font-size: 100px;
}
.welcome-text {
font-size: 24px;
}
.join-button {
font-size: 24px;
padding: 15px 30px;
}
.footer-content {
justify-content: center;
text-align: center;
}
.footer-left, .footer-right {
justify-content: center;
}
}
@media (max-width: 480px) {
.clan-name {
font-size: 60px;
}
.welcome-text {
font-size: 20px;
}
.join-button {
font-size: 20px;
padding: 12px 24px;
}
.footer-logo {
font-size: 16px;
}
}
</style>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-
awesome/6.0.0/css/all.min.css">
</head>
<body>
<div class="container">
<div class="content">
<div class="welcome-text">HAS SIDO ASIGNADO AL</div>
<div class="clan-name">CLAN<br>ANTARES</div>
<p style="color: #ff1458; font-size: 24px; font-weight: 600; letter-
spacing: -1px;">
ESTA VEZ NO APUNTARÁS A LA LUNA, APUNTARÁS A LAS ESTRELLAS
</p>
<a href="https://discord.gg/Ty9RVhedS4" class="join-button"
target="_blank">ÚNETE A TU CLAN</a>
</div>
</div>
<footer class="footer">
<div class="footer-content">
<div class="footer-left">
<a href="https://www.skool.com/heroesacademy" class="footer-logo"
target="_blank">
<i class="fas fa-graduation-cap"></i>
HEROES ACADEMY
</a>
</div>
<div class="footer-right">
<a href="https://www.skool.com/@chief-alejandro?g=heroesacademy"
class="footer-logo" target="_blank">
<i class="fas fa-envelope"></i>
CONTACTO
</a>
<a href="https://www.instagram.com/esunheroe/" class="footer-logo"
target="_blank">
<i class="fab fa-instagram"></i>
INSTAGRAM
</a>
</div>
</div>
</footer>
<script>
function createStars() {
const container = document.querySelector('.container');
for (let i = 0; i < 200; i++) {
const star = document.createElement('div');
star.className = 'star';
star.style.width = Math.random() * 3 + 'px';
star.style.height = star.style.width;
star.style.left = Math.random() * 100 + '%';
star.style.top = Math.random() * 100 + '%';
star.style.animationDelay = Math.random() * 2 + 's';
container.appendChild(star);
}
}
createStars();
</script>
</body>
</html>
`;
break;
case "Vega":
cuerpoPersonalizado = `
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style>
@import url('https://fonts.googleapis.com/css2?
family=Inter:wght@200;300;400;600;800&display=swap');
* {
margin: 0;
padding: 0;
box-sizing: border-box;
font-family: 'Inter', sans-serif;
}
body {
margin: 0;
background: #000;
color: #fff;
overflow-x: hidden;
min-height: 100vh;
}
.container {
position: relative;
min-height: 100vh;
background: linear-gradient(135deg, #000000 0%, #001a33 50%, #000000
100%);
overflow: hidden;
display: flex;
flex-direction: column;
padding-bottom: 100px;
}
.star {
position: absolute;
background: #fff;
border-radius: 50%;
animation: twinkle 1.5s infinite ease-in-out;
}
.content {
position: relative;
z-index: 2;
max-width: 1200px;
margin: 0 auto;
padding: 60px 20px;
text-align: center;
display: flex;
flex-direction: column;
justify-content: center;
min-height: calc(100vh - 100px);
}
.welcome-text {
font-size: 32px;
font-weight: 600;
letter-spacing: -1px;
margin-bottom: 20px;
color: #fff;
transform: skew(-5deg);
}
.clan-name {
position: relative;
font-size: 180px;
font-weight: 800;
letter-spacing: -5px;
line-height: 0.9;
color: #007bff;
margin: 20px auto;
transform: skew(-5deg);
text-shadow:
0 0 20px rgba(0, 123, 255, 0.5),
0 0 40px rgba(0, 123, 255, 0.3),
0 0 60px rgba(0, 123, 255, 0.2),
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000;
animation: textGlow 3s infinite;
}
@keyframes textGlow {
0% {
text-shadow:
0 0 20px rgba(0, 123, 255, 0.5),
0 0 40px rgba(0, 123, 255, 0.3),
0 0 60px rgba(0, 123, 255, 0.2),
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000;
}
50% {
text-shadow:
0 0 30px rgba(0, 123, 255, 0.8),
0 0 60px rgba(0, 123, 255, 0.6),
0 0 90px rgba(0, 123, 255, 0.4),
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000;
}
100% {
text-shadow:
0 0 20px rgba(0, 123, 255, 0.5),
0 0 40px rgba(0, 123, 255, 0.3),
0 0 60px rgba(0, 123, 255, 0.2),
-2px -2px 0 #000,
2px -2px 0 #000,
-2px 2px 0 #000,
2px 2px 0 #000;
}
}
.clan-name::before {
content: '';
position: absolute;
top: -20px;
left: -20px;
right: -20px;
bottom: -20px;
background: radial-gradient(circle,
rgba(0, 123, 255, 0) 30%,
rgba(0, 123, 255, 0.2) 50%,
rgba(0, 123, 255, 0.1) 70%,
transparent 100%
);
opacity: 0;
animation: explosionPulse 3s infinite;
pointer-events: none;
border-radius: 50%;
filter: blur(15px);
}
.join-button {
position: relative;
display: inline-flex;
align-items: center;
padding: 20px 40px;
background: #007bff;
color: #000;
text-decoration: none;
font-size: 32px;
font-weight: 600;
letter-spacing: -1px;
margin: 40px auto;
transform: skew(-5deg);
overflow: hidden;
transition: all 0.3s ease;
}
.join-button::before {
content: '';
position: absolute;
top: 0;
left: -100%;
width: 100%;
height: 100%;
background: linear-gradient(90deg, transparent, rgba(255, 255, 255,
0.4), transparent);
transition: 0.5s;
}
.join-button:hover::before {
left: 100%;
}
.join-button:hover {
background: #0056b3;
color: #fff;
transform: skew(-5deg) scale(1.05);
}
@keyframes explosionPulse {
0% {
transform: scale(0.8);
opacity: 0;
}
50% {
transform: scale(1.2);
opacity: 0.5;
}
100% {
transform: scale(0.8);
opacity: 0;
}
}
@keyframes twinkle {
0%, 100% {
opacity: 0.3;
}
50% {
opacity: 1;
}
}
.footer {
position: fixed;
bottom: 0;
width: 100%;
background: rgba(0, 0, 0, 0.95);
backdrop-filter: blur(10px);
padding: 25px;
border-top: 2px solid rgba(0, 123, 255, 0.5);
z-index: 100;
}
.footer-content {
max-width: 1200px;
margin: 0 auto;
display: flex;
justify-content: space-between;
align-items: center;
flex-wrap: wrap;
gap: 20px;
}
.footer-left, .footer-right {
display: flex;
align-items: center;
gap: 30px;
flex-wrap: wrap;
}
.footer-logo {
font-size: 18px;
font-weight: 600;
color: #fff;
text-decoration: none;
letter-spacing: -0.5px;
opacity: 0.7;
transition: all 0.3s ease;
display: flex;
align-items: center;
gap: 10px;
white-space: nowrap;
}
.footer-logo:hover {
opacity: 1;
color: #007bff;
}
.footer-logo i {
font-size: 24px;
}
@media (max-width: 768px) {
.clan-name {
font-size: 100px;
}
.welcome-text {
font-size: 24px;
}
.join-button {
font-size: 24px;
padding: 15px 30px;
}
.footer-content {
justify-content: center;
text-align: center;
}
.footer-left, .footer-right {
justify-content: center;
}
}
@media (max-width: 480px) {
.clan-name {
font-size: 60px;
}
.welcome-text {
font-size: 20px;
}
.join-button {
font-size: 20px;
padding: 12px 24px;
}
.footer-logo {
font-size: 16px;
}
}
</style>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-
awesome/6.0.0/css/all.min.css">
</head>
<body>
<div class="container">
<div class="content">
<div class="welcome-text">HAS SIDO ASIGNADO AL</div>
<div class="clan-name">CLAN<br>VEGA</div>
<p style="color: #007bff; font-size: 24px; font-weight: 600; letter-
spacing: -1px;">
Es el momento para convertirte en un Héroe Estrella
</p>
<a href="https://discord.gg/Ty9RVhedS4" class="join-button"
target="_blank">ÚNETE A TU CLAN</a>
</div>
</div>
<footer class="footer">
<div class="footer-content">
<div class="footer-left">
<a href="https://www.skool.com/heroesacademy" class="footer-logo"
target="_blank">
<i class="fas fa-graduation-cap"></i>
HEROES ACADEMY
</a>
</div>
<div class="footer-right">
<a href="https://www.skool.com/@chief-alejandro?g=heroesacademy"
class="footer-logo" target="_blank">
<i class="fas fa-envelope"></i>
CONTACTO
</a>
<a href="https://www.instagram.com/esunheroe/" class="footer-logo"
target="_blank">
<i class="fab fa-instagram"></i>
INSTAGRAM
</a>
</div>
</div>
</footer>
<script>
function createStars() {
const container = document.querySelector('.container');
for (let i = 0; i < 200; i++) {
const star = document.createElement('div');
star.className = 'star';
star.style.width = Math.random() * 3 + 'px';
star.style.height = star.style.width;
star.style.left = Math.random() * 100 + '%';
star.style.top = Math.random() * 100 + '%';
star.style.animationDelay = Math.random() * 2 + 's';
container.appendChild(star);
}
}
createStars();
</script>
</body>
</html>
`;
break;
default:
cuerpoPersonalizado = `
<html>
<body>
<h1>¡Bienvenido/a a Heroes Academy!</h1>
<p>Hola ${nombreEstudiante},</p>
<p>Tu clan está en proceso de asignación, pronto recibirás más
información.</p>
</body>
</html>
`;
}
// Construir el asunto del correo
var asunto = `¡Bienvenido/a al clan ${clan}!`;
// Enviar el correo electrónico desde la dirección especificada
GmailApp.sendEmail({
to: correoEstudiante,
subject: asunto,
htmlBody: cuerpoPersonalizado,
name: "Heroes Academy", // Nombre que aparece como remitente
from: "manelrourebuil@gmail.com" // Reemplaza con tu correo
});
}
function crearTrigger() {
ScriptApp.newTrigger("enviarCorreo")
.forSpreadsheet(SpreadsheetApp.getActiveSpreadsheet())
.onFormSubmit()
.create();
}
También podría gustarte
- Diseño y Elaboración de Páginas Web - Prácticas.100% (2)Diseño y Elaboración de Páginas Web - Prácticas.38 páginas
- Notas Del Curso de Programacion Orientada A Objetos Semana 1Aún no hay calificacionesNotas Del Curso de Programacion Orientada A Objetos Semana 126 páginas
- Formato de Codigos - Dominio2 - ClaveAún no hay calificacionesFormato de Codigos - Dominio2 - Clave12 páginas
- Codigo Como Agregar Slider en BloggerAún no hay calificacionesCodigo Como Agregar Slider en Blogger4 páginas
- Básicamente La Propiedad Transform (Aún no hay calificacionesBásicamente La Propiedad Transform (6 páginas
- Página Web de Un Tienda en Línea (Código CSS)Aún no hay calificacionesPágina Web de Un Tienda en Línea (Código CSS)11 páginas
- Plan Mejoramiento Informatica SeptimoAún no hay calificacionesPlan Mejoramiento Informatica Septimo7 páginas
- HTML - CSS para Poner Enlaces A FacebookAún no hay calificacionesHTML - CSS para Poner Enlaces A Facebook3 páginas
- Neptuno en Escorpio - Planeta CieloAún no hay calificacionesNeptuno en Escorpio - Planeta Cielo91 páginas
- GUÍA DE PRÁCTICA CLÍNICA PARA EL TRATAMIENTO DE LA AGITACIÓN PSICOMOTORA Y LA CONDUCTA AGRESIVAAún no hay calificacionesGUÍA DE PRÁCTICA CLÍNICA PARA EL TRATAMIENTO DE LA AGITACIÓN PSICOMOTORA Y LA CONDUCTA AGRESIVA82 páginas
- Acta - Estrategias de Difusión Proyecto Semillas - 26 de JunioAún no hay calificacionesActa - Estrategias de Difusión Proyecto Semillas - 26 de Junio72 páginas
- Carrusel de imagenes en javascriptAún no hay calificacionesCarrusel de imagenes en javascript2 páginas
- Descripción de Las Dimensiones Del Prototipo A Baja y Alta ResoluciónAún no hay calificacionesDescripción de Las Dimensiones Del Prototipo A Baja y Alta Resolución11 páginas
- B-GonzalezGonzalez EvaMariaPEC5ProgramacionAún no hay calificacionesB-GonzalezGonzalez EvaMariaPEC5Programacion6 páginas
- Programación Paginas Web JavaScript y PHPDe EverandProgramación Paginas Web JavaScript y PHPAún no hay calificaciones
- Notas Del Curso de Programacion Orientada A Objetos Semana 1Notas Del Curso de Programacion Orientada A Objetos Semana 1
- GUÍA DE PRÁCTICA CLÍNICA PARA EL TRATAMIENTO DE LA AGITACIÓN PSICOMOTORA Y LA CONDUCTA AGRESIVAGUÍA DE PRÁCTICA CLÍNICA PARA EL TRATAMIENTO DE LA AGITACIÓN PSICOMOTORA Y LA CONDUCTA AGRESIVA
- Acta - Estrategias de Difusión Proyecto Semillas - 26 de JunioActa - Estrategias de Difusión Proyecto Semillas - 26 de Junio
- Descripción de Las Dimensiones Del Prototipo A Baja y Alta ResoluciónDescripción de Las Dimensiones Del Prototipo A Baja y Alta Resolución
- Aprender Dreamweaver CS6 con 100 ejercicios prácticosDe EverandAprender Dreamweaver CS6 con 100 ejercicios prácticos