829 lines
26 KiB
HTML
829 lines
26 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
|
|
<title>Rust Las Palmas Meetup 2025 - Provisioning</title>
|
||
|
|
<style>
|
||
|
|
@import url('https://fonts.googleapis.com/css2?family=Merienda:wght@300;400;700;800;900&family=Inter:wght@400;600;700;900&family=JetBrains+Mono:wght@400;600&display=swap');
|
||
|
|
|
||
|
|
* {
|
||
|
|
margin: 0;
|
||
|
|
padding: 0;
|
||
|
|
box-sizing: border-box;
|
||
|
|
}
|
||
|
|
|
||
|
|
body {
|
||
|
|
font-family: 'Inter', sans-serif;
|
||
|
|
background: #0a0a0a;
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
min-height: 100vh;
|
||
|
|
padding: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.poster {
|
||
|
|
width: 794px;
|
||
|
|
height: 1123px;
|
||
|
|
position: relative;
|
||
|
|
overflow: hidden;
|
||
|
|
background: #000;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Fondo oceánico de Las Palmas con overlay tecnológico */
|
||
|
|
.ocean-tech-bg {
|
||
|
|
position: absolute;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
background: linear-gradient(180deg,
|
||
|
|
rgba(0, 20, 40, 0.95) 0%,
|
||
|
|
rgba(0, 40, 80, 0.9) 30%,
|
||
|
|
rgba(206, 66, 43, 0.3) 60%,
|
||
|
|
rgba(15, 23, 42, 0.95) 100%);
|
||
|
|
animation: waves 20s ease-in-out infinite;
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes waves {
|
||
|
|
0%, 100% { transform: translateY(0); }
|
||
|
|
50% { transform: translateY(-20px); }
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Símbolo del infinito animado */
|
||
|
|
.infinity-container {
|
||
|
|
position: absolute;
|
||
|
|
top: 50%;
|
||
|
|
left: 50%;
|
||
|
|
transform: translate(-50%, -50%);
|
||
|
|
width: 600px;
|
||
|
|
height: 300px;
|
||
|
|
z-index: 4;
|
||
|
|
opacity: 0.4;
|
||
|
|
}
|
||
|
|
|
||
|
|
.infinity-symbol {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
.infinity-path {
|
||
|
|
stroke: url(#infinityGradient);
|
||
|
|
stroke-width: 4;
|
||
|
|
fill: none;
|
||
|
|
stroke-linecap: round;
|
||
|
|
filter: drop-shadow(0 0 30px rgba(0, 212, 255, 0.8));
|
||
|
|
animation: infinity-draw 8s linear infinite;
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes infinity-draw {
|
||
|
|
0% {
|
||
|
|
stroke-dasharray: 0 1000;
|
||
|
|
}
|
||
|
|
50% {
|
||
|
|
stroke-dasharray: 1000 0;
|
||
|
|
}
|
||
|
|
100% {
|
||
|
|
stroke-dasharray: 0 1000;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.infinity-particles {
|
||
|
|
position: absolute;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.infinity-particle {
|
||
|
|
position: absolute;
|
||
|
|
width: 8px;
|
||
|
|
height: 8px;
|
||
|
|
background: radial-gradient(circle, #00FFB3, transparent);
|
||
|
|
border-radius: 50%;
|
||
|
|
animation: follow-infinity 4s linear infinite;
|
||
|
|
box-shadow: 0 0 15px rgba(0, 255, 179, 0.8);
|
||
|
|
}
|
||
|
|
|
||
|
|
.infinity-particle:nth-child(1) { animation-delay: 0s; }
|
||
|
|
.infinity-particle:nth-child(2) { animation-delay: 0.5s; }
|
||
|
|
.infinity-particle:nth-child(3) { animation-delay: 1s; }
|
||
|
|
.infinity-particle:nth-child(4) { animation-delay: 1.5s; }
|
||
|
|
.infinity-particle:nth-child(5) { animation-delay: 2s; }
|
||
|
|
.infinity-particle:nth-child(6) { animation-delay: 2.5s; }
|
||
|
|
|
||
|
|
@keyframes follow-infinity {
|
||
|
|
0%, 100% {
|
||
|
|
left: 50%;
|
||
|
|
top: 50%;
|
||
|
|
opacity: 0;
|
||
|
|
}
|
||
|
|
25% {
|
||
|
|
left: 75%;
|
||
|
|
top: 25%;
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
50% {
|
||
|
|
left: 50%;
|
||
|
|
top: 50%;
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
75% {
|
||
|
|
left: 25%;
|
||
|
|
top: 75%;
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Cangrejo de Rust gigante emergiendo del océano digital */
|
||
|
|
.rust-crab-container {
|
||
|
|
position: absolute;
|
||
|
|
top: 200px;
|
||
|
|
left: 50%;
|
||
|
|
transform: translateX(-50%);
|
||
|
|
width: 600px;
|
||
|
|
height: 400px;
|
||
|
|
filter: drop-shadow(0 20px 40px rgba(206, 66, 43, 0.5));
|
||
|
|
z-index: 5;
|
||
|
|
}
|
||
|
|
|
||
|
|
.digital-crab {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Cuerpo del cangrejo */
|
||
|
|
.crab-body {
|
||
|
|
position: absolute;
|
||
|
|
top: 50%;
|
||
|
|
left: 50%;
|
||
|
|
transform: translate(-50%, -50%);
|
||
|
|
width: 300px;
|
||
|
|
height: 200px;
|
||
|
|
background: linear-gradient(135deg, #CE422B 0%, #8B2F20 50%, #CE422B 100%);
|
||
|
|
border-radius: 50% 50% 40% 40%;
|
||
|
|
box-shadow:
|
||
|
|
inset 0 -20px 40px rgba(0,0,0,0.3),
|
||
|
|
0 30px 60px rgba(206, 66, 43, 0.4);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Pinzas del cangrejo */
|
||
|
|
.claw {
|
||
|
|
position: absolute;
|
||
|
|
width: 120px;
|
||
|
|
height: 80px;
|
||
|
|
background: linear-gradient(135deg, #CE422B, #A0351F);
|
||
|
|
clip-path: polygon(0 50%, 30% 0, 70% 20%, 100% 30%, 100% 70%, 70% 80%, 30% 100%);
|
||
|
|
}
|
||
|
|
|
||
|
|
.claw-left {
|
||
|
|
top: 40%;
|
||
|
|
left: -60px;
|
||
|
|
transform: rotate(-30deg);
|
||
|
|
}
|
||
|
|
|
||
|
|
.claw-right {
|
||
|
|
top: 40%;
|
||
|
|
right: -60px;
|
||
|
|
transform: rotate(30deg) scaleX(-1);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Ojos del cangrejo */
|
||
|
|
.crab-eyes {
|
||
|
|
position: absolute;
|
||
|
|
top: 30%;
|
||
|
|
left: 50%;
|
||
|
|
transform: translateX(-50%);
|
||
|
|
display: flex;
|
||
|
|
gap: 100px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.eye {
|
||
|
|
width: 40px;
|
||
|
|
height: 40px;
|
||
|
|
background: radial-gradient(circle, #fff 30%, #1a1a1a 35%, #CE422B 40%);
|
||
|
|
border-radius: 50%;
|
||
|
|
box-shadow: 0 5px 15px rgba(0,0,0,0.5);
|
||
|
|
animation: blink 4s infinite;
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes blink {
|
||
|
|
0%, 90%, 100% { transform: scaleY(1); }
|
||
|
|
95% { transform: scaleY(0.1); }
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Circuitos digitales emanando del cangrejo */
|
||
|
|
.digital-circuits {
|
||
|
|
position: absolute;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
}
|
||
|
|
|
||
|
|
.circuit-line {
|
||
|
|
position: absolute;
|
||
|
|
background: linear-gradient(90deg, transparent, #3B82F6, transparent);
|
||
|
|
height: 2px;
|
||
|
|
animation: circuit-flow 3s linear infinite;
|
||
|
|
}
|
||
|
|
|
||
|
|
.circuit-line:nth-child(1) {
|
||
|
|
top: 20%;
|
||
|
|
left: -100%;
|
||
|
|
right: -100%;
|
||
|
|
animation-delay: 0s;
|
||
|
|
}
|
||
|
|
|
||
|
|
.circuit-line:nth-child(2) {
|
||
|
|
top: 40%;
|
||
|
|
left: -100%;
|
||
|
|
right: -100%;
|
||
|
|
animation-delay: 1s;
|
||
|
|
}
|
||
|
|
|
||
|
|
.circuit-line:nth-child(3) {
|
||
|
|
top: 60%;
|
||
|
|
left: -100%;
|
||
|
|
right: -100%;
|
||
|
|
animation-delay: 2s;
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes circuit-flow {
|
||
|
|
0% { transform: translateX(-100%); }
|
||
|
|
100% { transform: translateX(100%); }
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Islas flotantes de servidores */
|
||
|
|
.floating-servers {
|
||
|
|
position: absolute;
|
||
|
|
width: 100%;
|
||
|
|
height: 300px;
|
||
|
|
top: 100px;
|
||
|
|
z-index: 3;
|
||
|
|
}
|
||
|
|
|
||
|
|
.server-island {
|
||
|
|
position: absolute;
|
||
|
|
width: 80px;
|
||
|
|
height: 100px;
|
||
|
|
background: linear-gradient(180deg, #1e293b 0%, #0f172a 100%);
|
||
|
|
border: 2px solid #3B82F6;
|
||
|
|
border-radius: 8px;
|
||
|
|
box-shadow: 0 10px 30px rgba(59, 130, 246, 0.3);
|
||
|
|
opacity: 0.8;
|
||
|
|
}
|
||
|
|
|
||
|
|
.server-island::before {
|
||
|
|
content: '';
|
||
|
|
position: absolute;
|
||
|
|
width: 60%;
|
||
|
|
height: 4px;
|
||
|
|
background: #10b981;
|
||
|
|
top: 20px;
|
||
|
|
left: 20%;
|
||
|
|
border-radius: 2px;
|
||
|
|
animation: server-blink 2s infinite;
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes server-blink {
|
||
|
|
0%, 100% { opacity: 1; }
|
||
|
|
50% { opacity: 0.3; }
|
||
|
|
}
|
||
|
|
|
||
|
|
.server-1 {
|
||
|
|
top: 50px;
|
||
|
|
left: 10%;
|
||
|
|
animation: float-1 6s ease-in-out infinite;
|
||
|
|
}
|
||
|
|
|
||
|
|
.server-2 {
|
||
|
|
top: 120px;
|
||
|
|
right: 15%;
|
||
|
|
animation: float-2 8s ease-in-out infinite;
|
||
|
|
}
|
||
|
|
|
||
|
|
.server-3 {
|
||
|
|
top: 30px;
|
||
|
|
right: 30%;
|
||
|
|
animation: float-3 7s ease-in-out infinite;
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes float-1 {
|
||
|
|
0%, 100% { transform: translateY(0) rotate(2deg); }
|
||
|
|
50% { transform: translateY(-20px) rotate(-2deg); }
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes float-2 {
|
||
|
|
0%, 100% { transform: translateY(0) rotate(-1deg); }
|
||
|
|
50% { transform: translateY(-15px) rotate(1deg); }
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes float-3 {
|
||
|
|
0%, 100% { transform: translateY(0) rotate(1deg); }
|
||
|
|
50% { transform: translateY(-25px) rotate(-1deg); }
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Contenido del póster */
|
||
|
|
.content {
|
||
|
|
position: relative;
|
||
|
|
z-index: 10;
|
||
|
|
padding: 40px;
|
||
|
|
height: 100%;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
}
|
||
|
|
|
||
|
|
.header {
|
||
|
|
text-align: center;
|
||
|
|
margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.event-location {
|
||
|
|
font-family: 'Merienda', cursive;
|
||
|
|
font-size: 34px;
|
||
|
|
font-weight: 700;
|
||
|
|
letter-spacing: 3px;
|
||
|
|
color: #CE422B;
|
||
|
|
text-shadow: 0 0 20px rgba(206, 66, 43, 0.5);
|
||
|
|
margin-bottom: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.event-name {
|
||
|
|
font-size: 20px;
|
||
|
|
color: #3B82F6;
|
||
|
|
letter-spacing: 2px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Espacio para el cangrejo */
|
||
|
|
.crab-space {
|
||
|
|
height: 380px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.main-title {
|
||
|
|
text-align: center;
|
||
|
|
margin-bottom: 30px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.title {
|
||
|
|
font-family: 'Merienda', cursive;
|
||
|
|
font-size: 56px;
|
||
|
|
font-weight: 900;
|
||
|
|
letter-spacing: -1px;
|
||
|
|
line-height: 0.95;
|
||
|
|
margin-bottom: 15px;
|
||
|
|
background: linear-gradient(135deg, #00D4FF, #7B2BFF, #00FFB3, #00D4FF);
|
||
|
|
background-size: 200% 200%;
|
||
|
|
-webkit-background-clip: text;
|
||
|
|
-webkit-text-fill-color: transparent;
|
||
|
|
background-clip: text;
|
||
|
|
animation: gradient-shift 4s ease infinite;
|
||
|
|
filter: drop-shadow(0 0 30px rgba(0, 212, 255, 0.5));
|
||
|
|
}
|
||
|
|
|
||
|
|
.title-systems {
|
||
|
|
font-family: 'Merienda', cursive;
|
||
|
|
font-weight: 300;
|
||
|
|
letter-spacing: 8px;
|
||
|
|
font-size: 50px;
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes gradient-shift {
|
||
|
|
0% { background-position: 0% 50%; }
|
||
|
|
50% { background-position: 100% 50%; }
|
||
|
|
100% { background-position: 0% 50%; }
|
||
|
|
}
|
||
|
|
|
||
|
|
.subtitle {
|
||
|
|
font-family: 'Merienda', cursive;
|
||
|
|
font-size: 17px;
|
||
|
|
color: #94a3b8;
|
||
|
|
margin-bottom: 10px;
|
||
|
|
font-weight: 400;
|
||
|
|
letter-spacing: 0px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tagline {
|
||
|
|
font-size: 16px;
|
||
|
|
color: #3B82F6;
|
||
|
|
font-style: italic;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Logo de Provisioning - Hexágono grande y claro */
|
||
|
|
.provisioning-logo {
|
||
|
|
position: absolute;
|
||
|
|
top: 35px;
|
||
|
|
right: 35px;
|
||
|
|
width: 90px;
|
||
|
|
height: 90px;
|
||
|
|
z-index: 20;
|
||
|
|
}
|
||
|
|
|
||
|
|
.logo-hexagon {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
position: relative;
|
||
|
|
animation: logo-rotate 15s linear infinite;
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes logo-rotate {
|
||
|
|
0% { transform: rotate(0deg); }
|
||
|
|
100% { transform: rotate(360deg); }
|
||
|
|
}
|
||
|
|
|
||
|
|
.hex-shape {
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
background: linear-gradient(135deg, #00D4FF, #7B2BFF, #00FFB3);
|
||
|
|
clip-path: polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%);
|
||
|
|
position: relative;
|
||
|
|
box-shadow:
|
||
|
|
0 0 40px rgba(0, 212, 255, 0.6),
|
||
|
|
inset 0 0 20px rgba(255, 255, 255, 0.2);
|
||
|
|
}
|
||
|
|
|
||
|
|
.hex-inner {
|
||
|
|
position: absolute;
|
||
|
|
top: 50%;
|
||
|
|
left: 50%;
|
||
|
|
transform: translate(-50%, -50%);
|
||
|
|
width: 75%;
|
||
|
|
height: 75%;
|
||
|
|
background: rgba(10, 10, 10, 0.95);
|
||
|
|
clip-path: polygon(30% 0%, 70% 0%, 100% 30%, 100% 70%, 70% 100%, 30% 100%, 0% 70%, 0% 30%);
|
||
|
|
}
|
||
|
|
|
||
|
|
.hex-text {
|
||
|
|
position: absolute;
|
||
|
|
top: 50%;
|
||
|
|
left: 50%;
|
||
|
|
transform: translate(-50%, -50%);
|
||
|
|
font-family: 'Merienda', cursive;
|
||
|
|
font-size: 48px;
|
||
|
|
font-weight: 700;
|
||
|
|
color: #00FFB3;
|
||
|
|
text-shadow:
|
||
|
|
0 0 20px rgba(0, 255, 179, 0.9),
|
||
|
|
0 0 40px rgba(0, 255, 179, 0.5);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Anillo de energía alrededor del hexágono */
|
||
|
|
.energy-ring {
|
||
|
|
position: absolute;
|
||
|
|
top: -10px;
|
||
|
|
left: -10px;
|
||
|
|
right: -10px;
|
||
|
|
bottom: -10px;
|
||
|
|
border: 2px solid transparent;
|
||
|
|
border-radius: 50%;
|
||
|
|
background: linear-gradient(45deg, transparent 30%, rgba(0, 255, 179, 0.3) 50%, transparent 70%);
|
||
|
|
animation: ring-pulse 3s linear infinite;
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes ring-pulse {
|
||
|
|
0% {
|
||
|
|
transform: rotate(0deg) scale(1);
|
||
|
|
opacity: 0;
|
||
|
|
}
|
||
|
|
50% {
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
100% {
|
||
|
|
transform: rotate(360deg) scale(1.2);
|
||
|
|
opacity: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Grid de características */
|
||
|
|
.features-grid {
|
||
|
|
display: grid;
|
||
|
|
grid-template-columns: repeat(4, 1fr);
|
||
|
|
gap: 15px;
|
||
|
|
margin-bottom: 30px;
|
||
|
|
padding: 20px;
|
||
|
|
background: rgba(0, 0, 0, 0.5);
|
||
|
|
border-radius: 12px;
|
||
|
|
backdrop-filter: blur(10px);
|
||
|
|
}
|
||
|
|
|
||
|
|
.feature-item {
|
||
|
|
text-align: center;
|
||
|
|
padding: 15px;
|
||
|
|
background: rgba(206, 66, 43, 0.1);
|
||
|
|
border-radius: 8px;
|
||
|
|
border: 1px solid rgba(206, 66, 43, 0.3);
|
||
|
|
}
|
||
|
|
|
||
|
|
.feature-emoji {
|
||
|
|
font-size: 32px;
|
||
|
|
margin-bottom: 5px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.feature-text {
|
||
|
|
font-size: 12px;
|
||
|
|
color: #cbd5e1;
|
||
|
|
font-weight: 600;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Terminal holográfico */
|
||
|
|
.holographic-terminal {
|
||
|
|
background: rgba(0, 0, 0, 0.8);
|
||
|
|
border: 2px solid transparent;
|
||
|
|
background-image:
|
||
|
|
linear-gradient(rgba(0, 0, 0, 0.8), rgba(0, 0, 0, 0.8)),
|
||
|
|
linear-gradient(135deg, #00D4FF, #7B2BFF, #00FFB3);
|
||
|
|
background-origin: border-box;
|
||
|
|
background-clip: padding-box, border-box;
|
||
|
|
border-radius: 8px;
|
||
|
|
padding: 20px;
|
||
|
|
margin-bottom: 30px;
|
||
|
|
position: relative;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
.holographic-terminal::before {
|
||
|
|
content: '';
|
||
|
|
position: absolute;
|
||
|
|
top: -50%;
|
||
|
|
left: -50%;
|
||
|
|
width: 200%;
|
||
|
|
height: 200%;
|
||
|
|
background: linear-gradient(45deg,
|
||
|
|
transparent 30%,
|
||
|
|
rgba(59, 130, 246, 0.1) 50%,
|
||
|
|
transparent 70%);
|
||
|
|
animation: hologram 4s linear infinite;
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes hologram {
|
||
|
|
0% { transform: translate(-50%, -50%) rotate(0deg); }
|
||
|
|
100% { transform: translate(-50%, -50%) rotate(360deg); }
|
||
|
|
}
|
||
|
|
|
||
|
|
.terminal-text {
|
||
|
|
font-family: 'JetBrains Mono', monospace;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #10b981;
|
||
|
|
position: relative;
|
||
|
|
z-index: 1;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Speaker info */
|
||
|
|
.speaker-section {
|
||
|
|
text-align: center;
|
||
|
|
margin-bottom: 30px;
|
||
|
|
padding: 20px;
|
||
|
|
background: rgba(206, 66, 43, 0.1);
|
||
|
|
border-radius: 12px;
|
||
|
|
border: 2px solid rgba(206, 66, 43, 0.3);
|
||
|
|
}
|
||
|
|
|
||
|
|
.speaker-name {
|
||
|
|
font-size: 24px;
|
||
|
|
font-weight: 700;
|
||
|
|
color: #CE422B;
|
||
|
|
margin-bottom: 5px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.speaker-title {
|
||
|
|
font-size: 14px;
|
||
|
|
color: #cbd5e1;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Footer */
|
||
|
|
.footer {
|
||
|
|
margin-top: auto;
|
||
|
|
text-align: center;
|
||
|
|
padding: 20px;
|
||
|
|
background: linear-gradient(135deg, rgba(206, 66, 43, 0.2), rgba(59, 130, 246, 0.2));
|
||
|
|
border-radius: 12px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.contact-row {
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
gap: 30px;
|
||
|
|
margin-bottom: 15px;
|
||
|
|
font-size: 14px;
|
||
|
|
color: #cbd5e1;
|
||
|
|
}
|
||
|
|
|
||
|
|
.register-cta {
|
||
|
|
font-size: 18px;
|
||
|
|
font-weight: 700;
|
||
|
|
color: #fff;
|
||
|
|
text-transform: uppercase;
|
||
|
|
letter-spacing: 2px;
|
||
|
|
padding: 15px 30px;
|
||
|
|
background: linear-gradient(135deg, #CE422B, #f97316);
|
||
|
|
border-radius: 30px;
|
||
|
|
display: inline-block;
|
||
|
|
box-shadow: 0 10px 30px rgba(206, 66, 43, 0.4);
|
||
|
|
animation: pulse-cta 2s infinite;
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes pulse-cta {
|
||
|
|
0%, 100% { transform: scale(1); }
|
||
|
|
50% { transform: scale(1.05); }
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Partículas de datos */
|
||
|
|
.data-particles {
|
||
|
|
position: absolute;
|
||
|
|
width: 100%;
|
||
|
|
height: 100%;
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
z-index: 2;
|
||
|
|
pointer-events: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.particle {
|
||
|
|
position: absolute;
|
||
|
|
width: 4px;
|
||
|
|
height: 4px;
|
||
|
|
background: #3B82F6;
|
||
|
|
border-radius: 50%;
|
||
|
|
opacity: 0;
|
||
|
|
animation: particle-rise 8s linear infinite;
|
||
|
|
}
|
||
|
|
|
||
|
|
.particle:nth-child(1) { left: 10%; animation-delay: 0s; }
|
||
|
|
.particle:nth-child(2) { left: 30%; animation-delay: 2s; }
|
||
|
|
.particle:nth-child(3) { left: 50%; animation-delay: 4s; }
|
||
|
|
.particle:nth-child(4) { left: 70%; animation-delay: 6s; }
|
||
|
|
.particle:nth-child(5) { left: 90%; animation-delay: 8s; }
|
||
|
|
|
||
|
|
@keyframes particle-rise {
|
||
|
|
0% {
|
||
|
|
bottom: -10px;
|
||
|
|
opacity: 0;
|
||
|
|
}
|
||
|
|
10% {
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
90% {
|
||
|
|
opacity: 1;
|
||
|
|
}
|
||
|
|
100% {
|
||
|
|
bottom: 100%;
|
||
|
|
opacity: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div class="poster">
|
||
|
|
<!-- Fondo oceánico/tecnológico -->
|
||
|
|
<div class="ocean-tech-bg"></div>
|
||
|
|
|
||
|
|
<!-- Partículas de datos ascendentes -->
|
||
|
|
<div class="data-particles">
|
||
|
|
<div class="particle"></div>
|
||
|
|
<div class="particle"></div>
|
||
|
|
<div class="particle"></div>
|
||
|
|
<div class="particle"></div>
|
||
|
|
<div class="particle"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Símbolo del infinito detrás del cangrejo -->
|
||
|
|
<div class="infinity-container">
|
||
|
|
<svg class="infinity-symbol" viewBox="0 0 600 300" xmlns="http://www.w3.org/2000/svg">
|
||
|
|
<defs>
|
||
|
|
<linearGradient id="infinityGradient" x1="0%" y1="0%" x2="100%" y2="0%">
|
||
|
|
<stop offset="0%" style="stop-color:#00D4FF;stop-opacity:1">
|
||
|
|
<animate attributeName="stop-color" values="#00D4FF;#7B2BFF;#00FFB3;#00D4FF" dur="4s" repeatCount="indefinite" />
|
||
|
|
</stop>
|
||
|
|
<stop offset="50%" style="stop-color:#7B2BFF;stop-opacity:1">
|
||
|
|
<animate attributeName="stop-color" values="#7B2BFF;#00FFB3;#00D4FF;#7B2BFF" dur="4s" repeatCount="indefinite" />
|
||
|
|
</stop>
|
||
|
|
<stop offset="100%" style="stop-color:#00FFB3;stop-opacity:1">
|
||
|
|
<animate attributeName="stop-color" values="#00FFB3;#00D4FF;#7B2BFF;#00FFB3" dur="4s" repeatCount="indefinite" />
|
||
|
|
</stop>
|
||
|
|
</linearGradient>
|
||
|
|
</defs>
|
||
|
|
<path class="infinity-path" d="M 150 150 C 150 75, 225 75, 300 150 S 450 225, 450 150 S 525 75, 450 150 S 375 225, 300 150 S 150 225, 150 150 Z" />
|
||
|
|
</svg>
|
||
|
|
<div class="infinity-particles">
|
||
|
|
<div class="infinity-particle"></div>
|
||
|
|
<div class="infinity-particle"></div>
|
||
|
|
<div class="infinity-particle"></div>
|
||
|
|
<div class="infinity-particle"></div>
|
||
|
|
<div class="infinity-particle"></div>
|
||
|
|
<div class="infinity-particle"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Servidores flotantes -->
|
||
|
|
<div class="floating-servers">
|
||
|
|
<div class="server-island server-1"></div>
|
||
|
|
<div class="server-island server-2"></div>
|
||
|
|
<div class="server-island server-3"></div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Cangrejo de Rust gigante -->
|
||
|
|
<div class="rust-crab-container">
|
||
|
|
<div class="digital-crab">
|
||
|
|
<div class="crab-body"></div>
|
||
|
|
<div class="claw claw-left"></div>
|
||
|
|
<div class="claw claw-right"></div>
|
||
|
|
<div class="crab-eyes">
|
||
|
|
<div class="eye"></div>
|
||
|
|
<div class="eye"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="digital-circuits">
|
||
|
|
<div class="circuit-line"></div>
|
||
|
|
<div class="circuit-line"></div>
|
||
|
|
<div class="circuit-line"></div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Contenido -->
|
||
|
|
<div class="content">
|
||
|
|
<!-- Logo de Provisioning - Hexágono con infinito -->
|
||
|
|
<div class="provisioning-logo">
|
||
|
|
<div class="energy-ring"></div>
|
||
|
|
<div class="logo-hexagon">
|
||
|
|
<div class="hex-shape"></div>
|
||
|
|
<div class="hex-inner"></div>
|
||
|
|
<div class="hex-text">∞</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="header">
|
||
|
|
<div class="event-location">RUST LAS PALMAS</div>
|
||
|
|
<div class="event-name">MEETUP 2025</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="crab-space"></div>
|
||
|
|
|
||
|
|
<div class="main-title">
|
||
|
|
<h1 class="title">Provisioning<br><span class="title-systems">Systems</span></h1>
|
||
|
|
<p class="subtitle">Infrastructure Automation with Rust, Nushell & KCL</p>
|
||
|
|
<p class="tagline">"Del océano digital al edge computing - Un ciclo infinito de automatización"</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="features-grid">
|
||
|
|
<div class="feature-item">
|
||
|
|
<div class="feature-emoji">🌊</div>
|
||
|
|
<div class="feature-text">Universal Deploy</div>
|
||
|
|
</div>
|
||
|
|
<div class="feature-item">
|
||
|
|
<div class="feature-emoji">⚡</div>
|
||
|
|
<div class="feature-text">10x Performance</div>
|
||
|
|
</div>
|
||
|
|
<div class="feature-item">
|
||
|
|
<div class="feature-emoji">🦀</div>
|
||
|
|
<div class="feature-text">Memory Safe</div>
|
||
|
|
</div>
|
||
|
|
<div class="feature-item">
|
||
|
|
<div class="feature-emoji">🤖</div>
|
||
|
|
<div class="feature-text">AI Powered</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="holographic-terminal">
|
||
|
|
<div class="terminal-text">
|
||
|
|
$ provisioning --target all --deploy<br>
|
||
|
|
🦀 Orchestrating infrastructure across the digital ocean...<br>
|
||
|
|
✓ Bare metal | ✓ Cloud | ✓ Edge | ✓ IoT
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="speaker-section">
|
||
|
|
<div class="speaker-name">Jesús Pérez Lorenzo</div>
|
||
|
|
<div class="speaker-title">Senior Rust Developer & Provisioning Architect</div>
|
||
|
|
<div class="speaker-title" style="margin-top: 5px; color: #CE422B;">Organizador Rust Las Palmas</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="footer">
|
||
|
|
<div class="contact-row">
|
||
|
|
<span>🐦 @jesusperezdev</span>
|
||
|
|
<span>📧 jesus@provisioning.dev</span>
|
||
|
|
<span>🌐 provisioning.systems</span>
|
||
|
|
</div>
|
||
|
|
<div class="register-cta">
|
||
|
|
ÚNETE A LA REVOLUCIÓN
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Símbolo del infinito simple y elegante -->
|
||
|
|
<div class="bottom-infinity">
|
||
|
|
<svg class="bottom-infinity-svg" viewBox="0 0 120 60" xmlns="http://www.w3.org/2000/svg">
|
||
|
|
<defs>
|
||
|
|
<linearGradient id="bottomGradient" x1="0%" y1="0%" x2="100%" y2="0%">
|
||
|
|
<stop offset="0%" style="stop-color:#00D4FF;stop-opacity:1" />
|
||
|
|
<stop offset="50%" style="stop-color:#00FFB3;stop-opacity:1" />
|
||
|
|
<stop offset="100%" style="stop-color:#7B2BFF;stop-opacity:1" />
|
||
|
|
</linearGradient>
|
||
|
|
</defs>
|
||
|
|
<path class="bottom-infinity-path" d="M 30 30 C 30 15, 45 15, 60 30 S 90 45, 90 30 S 105 15, 90 30 S 75 45, 60 30 S 30 45, 30 30 Z" />
|
||
|
|
</svg>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</body>
|
||
|
|
</html>
|