1252 lines
51 KiB
HTML
1252 lines
51 KiB
HTML
|
<!doctype html>
|
||
|
|
<html lang="es">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8" />
|
||
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||
|
|
<title>Provisioning - Automatización de Infraestructura</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:
|
||
|
|
"Segoe UI",
|
||
|
|
system-ui,
|
||
|
|
-apple-system,
|
||
|
|
sans-serif;
|
||
|
|
background: #0a0a0a;
|
||
|
|
color: #fff;
|
||
|
|
overflow-x: hidden;
|
||
|
|
}
|
||
|
|
a {
|
||
|
|
text-decoration: none;
|
||
|
|
color: #00d4ff;
|
||
|
|
}
|
||
|
|
.nushell {
|
||
|
|
color: #00ff88;
|
||
|
|
}
|
||
|
|
.rust {
|
||
|
|
color: #ce422b;
|
||
|
|
}
|
||
|
|
.poster-container {
|
||
|
|
width: 100%;
|
||
|
|
max-width: 1200px;
|
||
|
|
margin: 0 auto;
|
||
|
|
background: linear-gradient(
|
||
|
|
135deg,
|
||
|
|
#0f1419 0%,
|
||
|
|
#1a1f2e 50%,
|
||
|
|
#0f1419 100%
|
||
|
|
);
|
||
|
|
position: relative;
|
||
|
|
min-height: 100vh;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Grid Background */
|
||
|
|
.grid-bg {
|
||
|
|
position: absolute;
|
||
|
|
top: 0;
|
||
|
|
left: 0;
|
||
|
|
right: 0;
|
||
|
|
bottom: 0;
|
||
|
|
background-image:
|
||
|
|
linear-gradient(
|
||
|
|
rgba(0, 255, 255, 0.03) 1px,
|
||
|
|
transparent 1px
|
||
|
|
),
|
||
|
|
linear-gradient(
|
||
|
|
90deg,
|
||
|
|
rgba(0, 255, 255, 0.03) 1px,
|
||
|
|
transparent 1px
|
||
|
|
);
|
||
|
|
background-size: 50px 50px;
|
||
|
|
animation: gridMove 20s linear infinite;
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes gridMove {
|
||
|
|
0% {
|
||
|
|
transform: translate(0, 0);
|
||
|
|
}
|
||
|
|
100% {
|
||
|
|
transform: translate(50px, 50px);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Header with Logo */
|
||
|
|
.header {
|
||
|
|
padding: 40px 60px;
|
||
|
|
position: relative;
|
||
|
|
z-index: 10;
|
||
|
|
background: linear-gradient(
|
||
|
|
180deg,
|
||
|
|
rgba(10, 10, 10, 0.9) 0%,
|
||
|
|
transparent 100%
|
||
|
|
);
|
||
|
|
}
|
||
|
|
|
||
|
|
.logo-container {
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
gap: 180px;
|
||
|
|
margin-bottom: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#med-logo {
|
||
|
|
width: 300px;
|
||
|
|
margin-bottom: 25px;
|
||
|
|
}
|
||
|
|
.logo {
|
||
|
|
width: 120px;
|
||
|
|
height: 80px;
|
||
|
|
border-radius: 12px;
|
||
|
|
display: flex;
|
||
|
|
padding: 11px;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
box-shadow: 0 0 30px rgba(0, 212, 255, 0.5);
|
||
|
|
position: relative;
|
||
|
|
overflow: hidden;
|
||
|
|
}
|
||
|
|
|
||
|
|
.logo::before {
|
||
|
|
content: "";
|
||
|
|
font-size: 48px;
|
||
|
|
font-weight: bold;
|
||
|
|
color: #0a0a0a;
|
||
|
|
z-index: 2;
|
||
|
|
position: relative;
|
||
|
|
}
|
||
|
|
|
||
|
|
.logo::after {
|
||
|
|
content: "";
|
||
|
|
position: absolute;
|
||
|
|
inset: -50%;
|
||
|
|
background: linear-gradient(
|
||
|
|
45deg,
|
||
|
|
transparent,
|
||
|
|
rgba(255, 255, 255, 0.3),
|
||
|
|
transparent
|
||
|
|
);
|
||
|
|
animation: shimmer 3s infinite;
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes shimmer {
|
||
|
|
0% {
|
||
|
|
transform: translateX(-100%) translateY(-100%) rotate(45deg);
|
||
|
|
}
|
||
|
|
100% {
|
||
|
|
transform: translateX(100%) translateY(100%) rotate(45deg);
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
.brand-name {
|
||
|
|
font-family: "Merienda", cursive;
|
||
|
|
font-size: 60px;
|
||
|
|
font-weight: 900;
|
||
|
|
letter-spacing: 3px;
|
||
|
|
background: linear-gradient(90deg, #00d4ff 0%, #00ff88 100%);
|
||
|
|
background: linear-gradient(
|
||
|
|
90deg,
|
||
|
|
#00d4ff,
|
||
|
|
#1e40af,
|
||
|
|
#00ff88,
|
||
|
|
#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));
|
||
|
|
}
|
||
|
|
|
||
|
|
@keyframes gradient-shift {
|
||
|
|
0% {
|
||
|
|
background-position: 0% 50%;
|
||
|
|
}
|
||
|
|
50% {
|
||
|
|
background-position: 100% 50%;
|
||
|
|
}
|
||
|
|
100% {
|
||
|
|
background-position: 0% 50%;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
/* Main Title */
|
||
|
|
.main-title {
|
||
|
|
text-align: center;
|
||
|
|
padding: 0 60px;
|
||
|
|
margin-bottom: 50px;
|
||
|
|
position: relative;
|
||
|
|
z-index: 10;
|
||
|
|
}
|
||
|
|
|
||
|
|
.title {
|
||
|
|
font-size: 72px;
|
||
|
|
font-weight: bold;
|
||
|
|
line-height: 1.1;
|
||
|
|
margin-bottom: 20px;
|
||
|
|
margin-left: 100px;
|
||
|
|
text-shadow: 0 0 40px rgba(0, 212, 255, 0.3);
|
||
|
|
}
|
||
|
|
|
||
|
|
.subtitle {
|
||
|
|
font-size: 24px;
|
||
|
|
color: #00ff88;
|
||
|
|
font-weight: 300;
|
||
|
|
letter-spacing: 2px;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Features Grid */
|
||
|
|
.features {
|
||
|
|
display: grid;
|
||
|
|
grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
|
||
|
|
gap: 30px;
|
||
|
|
padding: 0 60px;
|
||
|
|
margin-bottom: 50px;
|
||
|
|
position: relative;
|
||
|
|
z-index: 10;
|
||
|
|
}
|
||
|
|
|
||
|
|
.feature-card {
|
||
|
|
background: rgba(255, 255, 255, 0.03);
|
||
|
|
border: 1px solid rgba(0, 212, 255, 0.2);
|
||
|
|
border-radius: 16px;
|
||
|
|
padding: 30px;
|
||
|
|
position: relative;
|
||
|
|
overflow: hidden;
|
||
|
|
transition: all 0.3s ease;
|
||
|
|
}
|
||
|
|
|
||
|
|
.feature-card:hover {
|
||
|
|
transform: translateY(-5px);
|
||
|
|
border-color: rgba(0, 212, 255, 0.5);
|
||
|
|
box-shadow: 0 10px 40px rgba(0, 212, 255, 0.2);
|
||
|
|
}
|
||
|
|
|
||
|
|
.feature-icon {
|
||
|
|
width: 50px;
|
||
|
|
height: 50px;
|
||
|
|
background: linear-gradient(135deg, #00d4ff 0%, #00ff88 100%);
|
||
|
|
border-radius: 12px;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
font-size: 24px;
|
||
|
|
margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.feature-title {
|
||
|
|
font-size: 20px;
|
||
|
|
margin-bottom: 10px;
|
||
|
|
color: #fff;
|
||
|
|
}
|
||
|
|
|
||
|
|
.feature-desc {
|
||
|
|
font-size: 14px;
|
||
|
|
color: rgba(255, 255, 255, 0.7);
|
||
|
|
line-height: 1.5;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Tech Stack */
|
||
|
|
.tech-stack {
|
||
|
|
padding: 40px 60px;
|
||
|
|
position: relative;
|
||
|
|
z-index: 10;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tech-header {
|
||
|
|
text-align: center;
|
||
|
|
font-size: 32px;
|
||
|
|
margin-bottom: 30px;
|
||
|
|
color: #00d4ff;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tech-grid {
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
gap: 40px;
|
||
|
|
flex-wrap: wrap;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tech-item {
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
align-items: center;
|
||
|
|
gap: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tech-badge {
|
||
|
|
width: 80px;
|
||
|
|
height: 80px;
|
||
|
|
background: rgba(255, 255, 255, 0.05);
|
||
|
|
border: 2px solid rgba(0, 212, 255, 0.3);
|
||
|
|
border-radius: 20px;
|
||
|
|
display: flex;
|
||
|
|
align-items: center;
|
||
|
|
justify-content: center;
|
||
|
|
font-size: 36px;
|
||
|
|
transition: all 0.3s ease;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tech-badge:hover {
|
||
|
|
transform: scale(1.1) rotate(5deg);
|
||
|
|
border-color: #00ff88;
|
||
|
|
box-shadow: 0 0 30px rgba(0, 255, 136, 0.3);
|
||
|
|
}
|
||
|
|
|
||
|
|
.tech-name {
|
||
|
|
font-size: 14px;
|
||
|
|
color: rgba(255, 255, 255, 0.8);
|
||
|
|
}
|
||
|
|
|
||
|
|
/* ROI Section */
|
||
|
|
.roi-section {
|
||
|
|
background: linear-gradient(
|
||
|
|
135deg,
|
||
|
|
rgba(0, 212, 255, 0.1) 0%,
|
||
|
|
rgba(0, 255, 136, 0.1) 100%
|
||
|
|
);
|
||
|
|
margin: 40px 60px;
|
||
|
|
border-radius: 20px;
|
||
|
|
padding: 40px;
|
||
|
|
position: relative;
|
||
|
|
z-index: 10;
|
||
|
|
border: 1px solid rgba(0, 212, 255, 0.2);
|
||
|
|
}
|
||
|
|
|
||
|
|
.roi-title {
|
||
|
|
text-align: center;
|
||
|
|
font-size: 28px;
|
||
|
|
margin-bottom: 30px;
|
||
|
|
color: #00ff88;
|
||
|
|
}
|
||
|
|
|
||
|
|
.roi-metrics {
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-around;
|
||
|
|
flex-wrap: wrap;
|
||
|
|
gap: 30px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.metric {
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.metric-value {
|
||
|
|
font-size: 48px;
|
||
|
|
font-weight: bold;
|
||
|
|
background: linear-gradient(90deg, #00d4ff 0%, #00ff88 100%);
|
||
|
|
-webkit-background-clip: text;
|
||
|
|
-webkit-text-fill-color: transparent;
|
||
|
|
background-clip: text;
|
||
|
|
}
|
||
|
|
|
||
|
|
.metric-label {
|
||
|
|
font-size: 14px;
|
||
|
|
color: rgba(255, 255, 255, 0.7);
|
||
|
|
margin-top: 5px;
|
||
|
|
}
|
||
|
|
.rust-laspalmas-logo-black {
|
||
|
|
padding: 8px;
|
||
|
|
border-radius: 20%;
|
||
|
|
background: #0a0a0a;
|
||
|
|
margin-bottom: 5px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.bottom-page {
|
||
|
|
text-align: center;
|
||
|
|
padding: 10px 10px;
|
||
|
|
}
|
||
|
|
/* Footer */
|
||
|
|
.footer {
|
||
|
|
text-align: center;
|
||
|
|
padding: 30px 60px;
|
||
|
|
position: relative;
|
||
|
|
z-index: 10;
|
||
|
|
background: linear-gradient(
|
||
|
|
0deg,
|
||
|
|
rgba(10, 10, 10, 0.9) 0%,
|
||
|
|
transparent 100%
|
||
|
|
);
|
||
|
|
border-top: 1px solid #dadada;
|
||
|
|
}
|
||
|
|
|
||
|
|
.cta {
|
||
|
|
display: inline-block;
|
||
|
|
padding: 15px 40px;
|
||
|
|
background: linear-gradient(90deg, #00d4ff 0%, #00ff88 100%);
|
||
|
|
color: #0a0a0a;
|
||
|
|
text-decoration: none;
|
||
|
|
border-radius: 30px;
|
||
|
|
font-weight: bold;
|
||
|
|
font-size: 18px;
|
||
|
|
transition: all 0.3s ease;
|
||
|
|
margin-bottom: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.event-cta {
|
||
|
|
display: inline-block;
|
||
|
|
padding: 5px 10px;
|
||
|
|
background: linear-gradient(90deg, #00d4ff 0%, #00ff88 100%);
|
||
|
|
color: #0a0a0a;
|
||
|
|
text-decoration: none;
|
||
|
|
border-radius: 30px;
|
||
|
|
font-weight: bold;
|
||
|
|
font-size: 15px;
|
||
|
|
transition: all 0.3s ease;
|
||
|
|
margin-bottom: 2px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.cta:hover {
|
||
|
|
transform: scale(1.05);
|
||
|
|
box-shadow: 0 0 40px rgba(0, 212, 255, 0.5);
|
||
|
|
}
|
||
|
|
|
||
|
|
.website {
|
||
|
|
font-size: 20px;
|
||
|
|
color: #00d4ff;
|
||
|
|
margin-top: 20px;
|
||
|
|
}
|
||
|
|
|
||
|
|
#event-rust-las-palmas {
|
||
|
|
background: linear-gradient(45deg, #ce422b 0%, #ff6b35 100%);
|
||
|
|
width: 300px;
|
||
|
|
margin: 15px auto;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
z-index: 20;
|
||
|
|
border-radius: 10px;
|
||
|
|
font-size: 16px;
|
||
|
|
color: white;
|
||
|
|
text-align: center;
|
||
|
|
padding: 20px 40px;
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
#event-rust-las-palmas span {
|
||
|
|
margin-left: 15px;
|
||
|
|
}
|
||
|
|
/* Event Info Band */
|
||
|
|
.event-band {
|
||
|
|
position: absolute;
|
||
|
|
left: -8px;
|
||
|
|
top: 5.5%;
|
||
|
|
bottom: 83%;
|
||
|
|
width: 200px;
|
||
|
|
background: linear-gradient(45deg, #ce422b 0%, #ff6b35 100%);
|
||
|
|
transform: rotate(-5deg);
|
||
|
|
/*box-shadow: 0 10px 30px rgba(206, 66, 43, 0.4);*/
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
z-index: 20;
|
||
|
|
border-radius: 10px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.event-info {
|
||
|
|
font-size: 16px;
|
||
|
|
color: white;
|
||
|
|
text-align: center;
|
||
|
|
padding: 20px 20px;
|
||
|
|
transform: rotate(5deg);
|
||
|
|
font-weight: bold;
|
||
|
|
}
|
||
|
|
.event-info span {
|
||
|
|
margin-left: 8px;
|
||
|
|
}
|
||
|
|
.event-date {
|
||
|
|
font-size: 16px;
|
||
|
|
margin-bottom: 15px;
|
||
|
|
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
|
||
|
|
}
|
||
|
|
|
||
|
|
.event-time {
|
||
|
|
font-size: 16px;
|
||
|
|
margin-bottom: 15px;
|
||
|
|
text-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
|
||
|
|
}
|
||
|
|
|
||
|
|
.event-location {
|
||
|
|
font-size: 14px;
|
||
|
|
line-height: 1.3;
|
||
|
|
}
|
||
|
|
.event-location p {
|
||
|
|
margin-top: 8px;
|
||
|
|
}
|
||
|
|
.event-location .white {
|
||
|
|
background: white;
|
||
|
|
padding: 2px;
|
||
|
|
border-radius: 50%;
|
||
|
|
}
|
||
|
|
.event-type a,
|
||
|
|
.event-location a {
|
||
|
|
color: white;
|
||
|
|
font-weight: normal;
|
||
|
|
text-decoration: none;
|
||
|
|
}
|
||
|
|
|
||
|
|
.location-header,
|
||
|
|
.event-type {
|
||
|
|
font-size: 13px;
|
||
|
|
margin: 12px 5px;
|
||
|
|
opacity: 0.9;
|
||
|
|
text-transform: uppercase;
|
||
|
|
letter-spacing: 1px;
|
||
|
|
}
|
||
|
|
#event-rust-las-palmas .rust-laspalmas-logo-black {
|
||
|
|
margin-bottom: 15px;
|
||
|
|
}
|
||
|
|
.event-register {
|
||
|
|
font-size: 15px;
|
||
|
|
marging-top: 2px;
|
||
|
|
}
|
||
|
|
.event-warning {
|
||
|
|
font-size: 13px;
|
||
|
|
margin: 15px;
|
||
|
|
opacity: 0.9;
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Animated particles */
|
||
|
|
.particle {
|
||
|
|
position: absolute;
|
||
|
|
width: 4px;
|
||
|
|
height: 4px;
|
||
|
|
background: #00d4ff;
|
||
|
|
border-radius: 50%;
|
||
|
|
opacity: 0.5;
|
||
|
|
animation: float 10s infinite linear;
|
||
|
|
}
|
||
|
|
@keyframes float {
|
||
|
|
from {
|
||
|
|
transform: translateY(100vh) translateX(0);
|
||
|
|
opacity: 0;
|
||
|
|
}
|
||
|
|
10% {
|
||
|
|
opacity: 0.5;
|
||
|
|
}
|
||
|
|
90% {
|
||
|
|
opacity: 0.5;
|
||
|
|
}
|
||
|
|
to {
|
||
|
|
transform: translateY(-100vh) translateX(100px);
|
||
|
|
opacity: 0;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
/* Responsive Design */
|
||
|
|
@media (max-width: 768px) {
|
||
|
|
.header,
|
||
|
|
.main-title,
|
||
|
|
.features,
|
||
|
|
.tech-stack,
|
||
|
|
.bottom-page,
|
||
|
|
.footer {
|
||
|
|
padding: 20px 30px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.title {
|
||
|
|
font-size: 48px;
|
||
|
|
margin-left: auto;
|
||
|
|
}
|
||
|
|
|
||
|
|
.subtitle {
|
||
|
|
font-size: 18px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.brand-name {
|
||
|
|
font-size: 40px;
|
||
|
|
text-align: center;
|
||
|
|
}
|
||
|
|
|
||
|
|
.roi-section {
|
||
|
|
margin: 20px 30px;
|
||
|
|
padding: 20px;
|
||
|
|
}
|
||
|
|
.logo-container {
|
||
|
|
flex-direction: column;
|
||
|
|
gap: 30px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.event-band {
|
||
|
|
position: relative;
|
||
|
|
margin: auto;
|
||
|
|
transform: none;
|
||
|
|
}
|
||
|
|
.event-info {
|
||
|
|
transform: none;
|
||
|
|
}
|
||
|
|
.event-date,
|
||
|
|
.event-time {
|
||
|
|
font-size: 14px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.event-location {
|
||
|
|
font-size: 12px;
|
||
|
|
}
|
||
|
|
|
||
|
|
.event-type {
|
||
|
|
font-size: 14px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<div class="poster-container">
|
||
|
|
<div class="grid-bg"></div>
|
||
|
|
|
||
|
|
<!-- Partículas Animadas -->
|
||
|
|
<div class="particle" style="left: 10%; animation-delay: 0s"></div>
|
||
|
|
<div class="particle" style="left: 30%; animation-delay: 2s"></div>
|
||
|
|
<div class="particle" style="left: 50%; animation-delay: 4s"></div>
|
||
|
|
<div class="particle" style="left: 70%; animation-delay: 6s"></div>
|
||
|
|
<div class="particle" style="left: 90%; animation-delay: 8s"></div>
|
||
|
|
|
||
|
|
<!-- Encabezado con Logo -->
|
||
|
|
<div class="header">
|
||
|
|
<div class="logo-container">
|
||
|
|
<div class="logo">
|
||
|
|
<svg fill="currentColor">
|
||
|
|
<use href="#logo-black"></use>
|
||
|
|
</svg>
|
||
|
|
</div>
|
||
|
|
<div class="brand-name">Provisioning</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Event Info Band -->
|
||
|
|
<div class="event-band">
|
||
|
|
<div class="event-info">
|
||
|
|
<div class="event-type">
|
||
|
|
<a href="https://rust-laspalmais.dev" target="_blank">
|
||
|
|
<img
|
||
|
|
class="rust-laspalmas-logo-black"
|
||
|
|
src="https://rust-laspalmas.dev/images/logos/rust-laspalmas-dark.svg"
|
||
|
|
width="100"
|
||
|
|
/>
|
||
|
|
<span>Rust Las Palmas</span>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
<div class="event-date">📅 <span>26 Sept. 2025</span></div>
|
||
|
|
<div class="event-time">🕐 <span>18:30 horas</span></div>
|
||
|
|
<div class="event-location">
|
||
|
|
<span class="white">📍</span>
|
||
|
|
<span
|
||
|
|
><a href="#event-rust-las-palmas">
|
||
|
|
click para ver</a
|
||
|
|
></span
|
||
|
|
>
|
||
|
|
</div>
|
||
|
|
<div class="event-warning">Plazas limitadas</div>
|
||
|
|
<div class="event-register">
|
||
|
|
<a
|
||
|
|
class="event-cta"
|
||
|
|
href="mailto:info@rust-laspalmas.dev?subject=INSCRIPCION%3A%20Evento%20con%20Rust%20LasPalmas.%20Septiembre%202025"
|
||
|
|
>Inscribirse</a
|
||
|
|
>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Main Title -->
|
||
|
|
<div class="main-title">
|
||
|
|
<h1 class="title">Automatización de Infraestructura</h1>
|
||
|
|
<p class="subtitle">
|
||
|
|
Type-Safe • Despliegue Universal • Potenciado por IA
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Cuadrícula de Características -->
|
||
|
|
<div class="features">
|
||
|
|
<div class="feature-card">
|
||
|
|
<div class="feature-icon">🚀</div>
|
||
|
|
<h3 class="feature-title">Infraestructura Universal</h3>
|
||
|
|
<p class="feature-desc">
|
||
|
|
Despliega en cualquier lugar: bare metal, cloud, edge
|
||
|
|
computing, y dispositivos IoT con un solo framework
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="feature-card">
|
||
|
|
<div class="feature-icon">🦀</div>
|
||
|
|
<h3 class="feature-title">
|
||
|
|
Potenciado por <span class="rust">Rust</span>
|
||
|
|
</h3>
|
||
|
|
<p class="feature-desc">
|
||
|
|
Construido con Rust para máximo rendimiento, seguridad
|
||
|
|
de memoria, y confiabilidad a escala
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="feature-card">
|
||
|
|
<div class="feature-icon">🐚</div>
|
||
|
|
<h3 class="feature-title">
|
||
|
|
Integración <span class="nushell">Nushell</span>
|
||
|
|
</h3>
|
||
|
|
<p class="feature-desc">
|
||
|
|
Shell moderno para manipulación de datos estructurados y
|
||
|
|
pipelines de automatización potentes
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="feature-card">
|
||
|
|
<div class="feature-icon">🔐</div>
|
||
|
|
<h3 class="feature-title">Seguridad Empresarial</h3>
|
||
|
|
<p class="feature-desc">
|
||
|
|
Cosmian KMS para gestión avanzada de claves y KCL para
|
||
|
|
políticas de configuración seguras
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="feature-card">
|
||
|
|
<div class="feature-icon">🤖</div>
|
||
|
|
<h3 class="feature-title">Inteligencia Artificial</h3>
|
||
|
|
<p class="feature-desc">
|
||
|
|
Agentes inteligentes optimizan despliegues, predicen
|
||
|
|
fallos, y automatizan flujos de trabajo complejos
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="feature-card">
|
||
|
|
<div class="feature-icon">📊</div>
|
||
|
|
<h3 class="feature-title">Análisis en Tiempo Real</h3>
|
||
|
|
<p class="feature-desc">
|
||
|
|
Dashboards avanzados y dataframes para monitoreo,
|
||
|
|
reportes, y toma de decisiones
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Stack Tecnológico -->
|
||
|
|
<div class="tech-stack">
|
||
|
|
<h2 class="tech-header">Potenciado por tecnología moderna</h2>
|
||
|
|
<div class="tech-grid">
|
||
|
|
<div class="tech-item">
|
||
|
|
<div class="tech-badge">🦀</div>
|
||
|
|
<span class="tech-name">Rust</span>
|
||
|
|
</div>
|
||
|
|
<div class="tech-item">
|
||
|
|
<div class="tech-badge">🐚</div>
|
||
|
|
<span class="tech-name">Nushell</span>
|
||
|
|
</div>
|
||
|
|
<div class="tech-item">
|
||
|
|
<div class="tech-badge">⚙️</div>
|
||
|
|
<span class="tech-name">KCL</span>
|
||
|
|
</div>
|
||
|
|
<div class="tech-item">
|
||
|
|
<div class="tech-badge">🔐</div>
|
||
|
|
<span class="tech-name">Cosmian KMS</span>
|
||
|
|
</div>
|
||
|
|
<div class="tech-item">
|
||
|
|
<div class="tech-badge">🔧</div>
|
||
|
|
<span class="tech-name">Tokio</span>
|
||
|
|
</div>
|
||
|
|
<div class="tech-item">
|
||
|
|
<div class="tech-badge">🌐</div>
|
||
|
|
<span class="tech-name">WebAssembly</span>
|
||
|
|
</div>
|
||
|
|
<div class="tech-item">
|
||
|
|
<div class="tech-badge">📊</div>
|
||
|
|
<span class="tech-name">Polars</span>
|
||
|
|
</div>
|
||
|
|
<div class="tech-item">
|
||
|
|
<div class="tech-badge">🔒</div>
|
||
|
|
<span class="tech-name">Encriptación </span>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<!-- Sección Beneficios Verificados -->
|
||
|
|
<div class="roi-section">
|
||
|
|
<h2 class="roi-title">
|
||
|
|
Beneficios Comprobados de
|
||
|
|
<span style="color: #ce422b">Rust</span>
|
||
|
|
</h2>
|
||
|
|
<div class="roi-metrics">
|
||
|
|
<div class="metric">
|
||
|
|
<div class="metric-value">⚡</div>
|
||
|
|
<div class="metric-label">Zero-Cost Abstractions</div>
|
||
|
|
</div>
|
||
|
|
<div class="metric">
|
||
|
|
<div class="metric-value">🛡️</div>
|
||
|
|
<div class="metric-label">Memory Safety</div>
|
||
|
|
</div>
|
||
|
|
<div class="metric">
|
||
|
|
<div class="metric-value">🔧</div>
|
||
|
|
<div class="metric-label">Compile-Time Errors</div>
|
||
|
|
</div>
|
||
|
|
<div class="metric">
|
||
|
|
<div class="metric-value">🌍</div>
|
||
|
|
<div class="metric-label">Cross-Platform</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="bottom-page">
|
||
|
|
<div>
|
||
|
|
<a href="https://provisioning.systems" target="_blank">
|
||
|
|
<svg id="med-logo" fill="currentColor">
|
||
|
|
<use href="#logo-black"></use>
|
||
|
|
</svg>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
<a
|
||
|
|
href="https://provisioning.systems"
|
||
|
|
target="_blank"
|
||
|
|
class="cta"
|
||
|
|
>Únete a la Revolución</a
|
||
|
|
>
|
||
|
|
<div id="event-rust-las-palmas">
|
||
|
|
<div class="event-type">
|
||
|
|
<a href="https://rust-laspalmais.dev" target="_blank">
|
||
|
|
<img
|
||
|
|
class="rust-laspalmas-logo-black"
|
||
|
|
src="https://rust-laspalmas.dev/images/logos/rust-laspalmas-dark.svg"
|
||
|
|
width="200"
|
||
|
|
/>
|
||
|
|
<span>Rust Las Palmas</span>
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
<div class="event-date">📅<span>26 Sept. 2025</span></div>
|
||
|
|
<div class="event-time">🕐<span>18:30 horas</span></div>
|
||
|
|
<div class="event-location">
|
||
|
|
<span class="white">📍</span>
|
||
|
|
<p>
|
||
|
|
<a
|
||
|
|
href="https://nautilus-cyberneering.de/"
|
||
|
|
target="_blank"
|
||
|
|
class="location-header"
|
||
|
|
>
|
||
|
|
Nautilus
|
||
|
|
</a>
|
||
|
|
</p>
|
||
|
|
<p>
|
||
|
|
<a
|
||
|
|
href="https://maps.app.goo.gl/ecUfxkpjKJPr6wuLA"
|
||
|
|
target="_blank"
|
||
|
|
>
|
||
|
|
C. Fernando Guanarteme 14<br />
|
||
|
|
Santa Brígida Las Palmas
|
||
|
|
<br />(entrada por arriba,<br />por la cancela)
|
||
|
|
</a>
|
||
|
|
</p>
|
||
|
|
</div>
|
||
|
|
<div class="event-warning">Plazas limitadas</div>
|
||
|
|
<div class="event-register">
|
||
|
|
<a
|
||
|
|
class="cta"
|
||
|
|
href="mailto:info@rust-laspalmas.dev?subject=INSCRIPCION%3A%20Evento%20con%20Rust%20LasPalmas.%20Septiembre%202025"
|
||
|
|
>Inscribirse</a
|
||
|
|
>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<!-- Pie de Página -->
|
||
|
|
<footer class="footer">
|
||
|
|
<div class="website">
|
||
|
|
<a
|
||
|
|
href="https://provisioning.systems"
|
||
|
|
target="_blank"
|
||
|
|
style=""
|
||
|
|
>© 2025 provisioning.systems
|
||
|
|
</a>
|
||
|
|
</div>
|
||
|
|
</footer>
|
||
|
|
</div>
|
||
|
|
<svg style="display: none">
|
||
|
|
<symbol id="logo-black" viewBox="0 0 359.49 221.13">
|
||
|
|
<defs>
|
||
|
|
<clipPath id="d">
|
||
|
|
<path
|
||
|
|
d="M226.79,113.62c0,19.36,15.85,35.06,35.4,35.06,19.55,0,35.4-15.7,35.4-35.06,0-19.36-15.85-35.06-35.4-35.06h0c-42.68,0-35.4,15.7-35.4,35.06"
|
||
|
|
style="fill: none"
|
||
|
|
/>
|
||
|
|
</clipPath>
|
||
|
|
|
||
|
|
<!-- Animated gradient for connecting elements -->
|
||
|
|
<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>
|
||
|
|
|
||
|
|
<g id="c">
|
||
|
|
<g>
|
||
|
|
<!-- Left wheel - only outer shape rotates -->
|
||
|
|
<g>
|
||
|
|
<path
|
||
|
|
d="M3.04,87.53c-3.66,16.4-3.36,33.43,.85,49.7l18.49-.31c2.12,7.08,5.09,13.89,8.85,20.26l-12.81,13.12c9.22,14.08,21.56,25.9,36.09,34.55l12.81-13.13c6.56,3.51,13.52,6.22,20.74,8.08l.31,18.3c16.56,3.62,33.75,3.33,50.18-.85l-.31-18.3c7.15-2.1,14.02-5.04,20.46-8.77l13.25,12.69c14.22-9.14,26.14-21.36,34.87-35.75l-13.25-12.68c3.54-6.5,6.28-13.4,8.15-20.55l18.49-.31c3.65-16.4,3.36-33.43-.85-49.7l-18.49,.31c-2.12-7.08-5.09-13.88-8.85-20.26l12.8-13.12c-9.22-14.08-21.56-25.9-36.08-34.55l-12.81,13.13c-6.56-3.51-13.53-6.23-20.75-8.08l-.31-18.3c-16.56-3.62-33.75-3.33-50.18,.85l.31,18.3c-7.15,2.1-14.01,5.04-20.45,8.77l-13.25-12.69c-14.22,9.14-26.15,21.36-34.88,35.75l13.25,12.68c-3.54,6.5-6.28,13.4-8.15,20.55l-18.49,.31Z"
|
||
|
|
style="
|
||
|
|
fill: #4cc2f1;
|
||
|
|
fill-rule: evenodd;
|
||
|
|
stroke: #fff;
|
||
|
|
stroke-miterlimit: 10;
|
||
|
|
"
|
||
|
|
>
|
||
|
|
<animateTransform
|
||
|
|
attributeName="transform"
|
||
|
|
type="rotate"
|
||
|
|
values="0 115.86 113.25;360 115.86 113.25"
|
||
|
|
dur="8s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
</path>
|
||
|
|
</g>
|
||
|
|
|
||
|
|
<!-- Right wheel - only outer shape rotates -->
|
||
|
|
<g>
|
||
|
|
<path
|
||
|
|
d="M167.28,92.87c-3.19,14.31-2.94,29.17,.74,43.37l16.13-.27c1.85,6.18,4.44,12.12,7.72,17.68l-11.18,11.45c8.05,12.29,18.82,22.6,31.49,30.15l11.18-11.46c5.72,3.06,11.8,5.43,18.1,7.05l.27,15.97c14.45,3.16,29.45,2.91,43.78-.74l-.27-15.97c6.24-1.83,12.23-4.4,17.85-7.66l11.56,11.08c12.41-7.97,22.81-18.64,30.43-31.19l-11.56-11.06c3.09-5.67,5.48-11.69,7.11-17.93l16.13-.27c3.18-14.31,2.93-29.17-.74-43.37l-16.13,.27c-1.85-6.18-4.44-12.11-7.72-17.68l11.17-11.44c-8.04-12.29-18.81-22.6-31.48-30.15l-11.18,11.46c-5.72-3.07-11.8-5.43-18.1-7.05l-.27-15.97c-14.45-3.16-29.45-2.91-43.78,.74l.27,15.97c-6.24,1.83-12.23,4.4-17.84,7.66l-11.56-11.08c-12.41,7.97-22.81,18.64-30.44,31.19l11.56,11.06c-3.09,5.67-5.48,11.69-7.11,17.93l-16.13,.27Z"
|
||
|
|
style="
|
||
|
|
fill: #4cc2f1;
|
||
|
|
fill-rule: evenodd;
|
||
|
|
stroke: #fff;
|
||
|
|
stroke-miterlimit: 10;
|
||
|
|
"
|
||
|
|
>
|
||
|
|
<animateTransform
|
||
|
|
attributeName="transform"
|
||
|
|
type="rotate"
|
||
|
|
values="0 261.91 113.28;-360 261.91 113.28"
|
||
|
|
dur="6s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
</path>
|
||
|
|
</g>
|
||
|
|
|
||
|
|
<!-- Left wheel center -->
|
||
|
|
<path
|
||
|
|
d="M115.86,78.19c19.55,0,35.4,15.7,35.4,35.06s-15.85,35.06-35.4,35.06-35.4-15.7-35.4-35.06,15.85-35.06,35.4-35.06"
|
||
|
|
style="fill: #f2b03f"
|
||
|
|
/>
|
||
|
|
<ellipse
|
||
|
|
cx="116.42"
|
||
|
|
cy="115.68"
|
||
|
|
rx="20.17"
|
||
|
|
ry="20.15"
|
||
|
|
style="
|
||
|
|
fill: none;
|
||
|
|
stroke: #4159a4;
|
||
|
|
stroke-miterlimit: 10;
|
||
|
|
stroke-width: 1.58px;
|
||
|
|
"
|
||
|
|
/>
|
||
|
|
<path
|
||
|
|
d="M116.42,107.88c4.35-.04,7.91,3.43,7.95,7.73,.04,4.31-3.46,7.83-7.81,7.87-4.35,.04-7.91-3.43-7.95-7.73,0-.02,0-.05,0-.07-.02-4.29,3.48-7.78,7.81-7.8"
|
||
|
|
style="fill: #fff"
|
||
|
|
/>
|
||
|
|
<path
|
||
|
|
d="M116.42,100.38c.2,0,.37,.16,.37,.36s-.16,.37-.37,.37c-.2,0-.37-.16-.37-.36,0,0,0,0,0,0,0-.2,.16-.36,.37-.37h0Zm1.38-4.53v-4.06h1.55c.82,.02,1.49-.63,1.51-1.43,.02-.81-.63-1.48-1.45-1.49-.02,0-.04,0-.06,0h-6.1c-.82-.02-1.49,.63-1.51,1.43-.02,.81,.63,1.48,1.45,1.49,.02,0,.04,0,.06,0h1.79v4.06m.14,18.68l6.92-9.15c.08-.11,.23-.13,.34-.05,.09,.07,.12,.19,.08,.29l-4.47,10.56c-.35,.84-1.32,1.23-2.16,.89-.07-.03-.14-.06-.2-.1-.8-.47-1.07-1.49-.6-2.28,.03-.05,.07-.11,.11-.16h0Zm-8.08-16.69l-1.86-3.97m2.09-.71l-3.98,1.86"
|
||
|
|
style="
|
||
|
|
fill: none;
|
||
|
|
stroke: #4159a4;
|
||
|
|
stroke-miterlimit: 10;
|
||
|
|
stroke-width: 1.58px;
|
||
|
|
"
|
||
|
|
/>
|
||
|
|
|
||
|
|
<!-- Green dot with smooth pulse -->
|
||
|
|
<path
|
||
|
|
d="M86.86,91.68c0-1.42,1.17-2.57,2.6-2.56,1.43,0,2.59,1.16,2.59,2.58,0,1.42-1.17,2.57-2.6,2.56-1.43,0-2.58-1.15-2.59-2.56v-.02Z"
|
||
|
|
style="fill: #50a89c"
|
||
|
|
>
|
||
|
|
<animateTransform
|
||
|
|
attributeName="transform"
|
||
|
|
type="scale"
|
||
|
|
values="1;1.3;1"
|
||
|
|
dur="2s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
</path>
|
||
|
|
|
||
|
|
<!-- Connection elements forming infinity symbol - AGILE ANIMATION -->
|
||
|
|
<!-- Top left part of infinity -->
|
||
|
|
<path
|
||
|
|
d="M225.8,83.92c1.22-1.35,2.46-2.66,3.75-3.94,16.69-16.54,43.22-18.12,61.79-3.68l17.46-2.65,2.57-16.63c-29.5-25.42-73.83-23.89-101.47,3.5-1.24,1.23-2.45,2.49-3.63,3.77l16.89,2.56,2.64,17.07Z"
|
||
|
|
style="stroke: #fff; stroke-miterlimit: 10"
|
||
|
|
>
|
||
|
|
<animate
|
||
|
|
attributeName="fill"
|
||
|
|
values="#5e74b7;#00D4FF;#7B2BFF;#00FFB3;#5e74b7"
|
||
|
|
dur="2s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
<animate
|
||
|
|
attributeName="stroke-width"
|
||
|
|
values="1;3;1"
|
||
|
|
dur="2s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
</path>
|
||
|
|
|
||
|
|
<!-- Bottom left part of infinity -->
|
||
|
|
<path
|
||
|
|
d="M78.59,141.18c-14.54-18.4-12.95-44.65,3.71-61.2,1.33-1.31,2.73-2.54,4.2-3.68l-17.46-2.65-2.57-16.63c-1.3,1.13-2.58,2.28-3.82,3.5-27.79,27.53-28.96,71.57-3.53,100.51l16.79-2.55,2.67-17.3Z"
|
||
|
|
style="stroke: #fff; stroke-miterlimit: 10"
|
||
|
|
>
|
||
|
|
<animate
|
||
|
|
attributeName="fill"
|
||
|
|
values="#5e74b7;#7B2BFF;#00FFB3;#00D4FF;#5e74b7"
|
||
|
|
dur="2s"
|
||
|
|
begin="0.5s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
<animate
|
||
|
|
attributeName="stroke-width"
|
||
|
|
values="1;3;1"
|
||
|
|
dur="2s"
|
||
|
|
begin="0.5s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
</path>
|
||
|
|
|
||
|
|
<!-- Top right part of infinity -->
|
||
|
|
<path
|
||
|
|
d="M86.5,76.3c18.57-14.44,45.1-12.86,61.79,3.68,1.29,1.27,2.53,2.6,3.75,3.94l2.64-17.07,16.89-2.56c-1.18-1.28-2.39-2.54-3.63-3.77-27.64-27.39-71.97-28.92-101.48-3.5l2.57,16.63,17.46,2.65Z"
|
||
|
|
style="stroke: #fff; stroke-miterlimit: 10"
|
||
|
|
>
|
||
|
|
<animate
|
||
|
|
attributeName="fill"
|
||
|
|
values="#8d9ccf;#00FFB3;#00D4FF;#7B2BFF;#8d9ccf"
|
||
|
|
dur="2s"
|
||
|
|
begin="1s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
<animate
|
||
|
|
attributeName="stroke-width"
|
||
|
|
values="1;3;1"
|
||
|
|
dur="2s"
|
||
|
|
begin="1s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
</path>
|
||
|
|
|
||
|
|
<!-- Bottom right part of infinity -->
|
||
|
|
<path
|
||
|
|
d="M299.26,141.18c-15.88,20.08-45.19,23.61-65.46,7.88l-.04-.03-17.46,2.65-2.57,16.63c29.5,25.42,73.83,23.89,101.47-3.5,1.24-1.22,2.4-2.49,3.53-3.78l-16.79-2.55-2.68-17.3Z"
|
||
|
|
style="stroke: #fff; stroke-miterlimit: 10"
|
||
|
|
>
|
||
|
|
<animate
|
||
|
|
attributeName="fill"
|
||
|
|
values="#8d9ccf;#7B2BFF;#00D4FF;#00FFB3;#8d9ccf"
|
||
|
|
dur="2s"
|
||
|
|
begin="1.5s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
<animate
|
||
|
|
attributeName="stroke-width"
|
||
|
|
values="1;3;1"
|
||
|
|
dur="2s"
|
||
|
|
begin="1.5s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
</path>
|
||
|
|
|
||
|
|
<!-- Additional elements -->
|
||
|
|
<path
|
||
|
|
d="M315.19,60.52c-1.23-1.22-2.51-2.38-3.82-3.5l-2.57,16.63-17.46,2.65c1.47,1.14,2.88,2.37,4.2,3.68,16.66,16.55,18.25,42.8,3.71,61.2l2.68,17.3,16.79,2.55c25.42-28.93,24.26-72.98-3.53-100.5m-171.1,88.5c-20.2,15.76-49.48,12.31-65.39-7.7-.04-.05-.08-.1-.12-.15l-2.68,17.3-16.79,2.55c1.13,1.29,2.3,2.56,3.53,3.78,27.64,27.39,71.97,28.92,101.47,3.5l-2.57-16.63-17.46-2.65Z"
|
||
|
|
style="
|
||
|
|
fill: #455aa5;
|
||
|
|
stroke: #fff;
|
||
|
|
stroke-miterlimit: 10;
|
||
|
|
"
|
||
|
|
/>
|
||
|
|
<path
|
||
|
|
d="M204.38,103.42c1.09,1.79,2.17,3.56,3.25,5.32,5.65-8.96,11.44-17.4,18.17-24.81l-2.64-17.07-16.89-2.56c-5.38,5.87-10.34,12.11-14.83,18.68,4.58,6.77,8.8,13.66,12.94,20.45m-30.92,18.5c-1.09-1.79-2.18-3.56-3.25-5.32-6.68,10.59-13.53,20.44-21.92,28.75-1.33,1.31-2.73,2.54-4.21,3.68l17.46,2.65,2.57,16.63c1.3-1.12,2.58-2.28,3.82-3.5,6.84-6.9,13.02-14.41,18.46-22.43-4.57-6.76-8.78-13.66-12.93-20.46"
|
||
|
|
style="
|
||
|
|
fill: #8d9ccf;
|
||
|
|
stroke: #fff;
|
||
|
|
stroke-miterlimit: 10;
|
||
|
|
"
|
||
|
|
/>
|
||
|
|
|
||
|
|
<!-- Central flow representing infinity -->
|
||
|
|
<path
|
||
|
|
d="M171.57,64.29c11.77,12.66,20.64,27.17,29.24,41.26,9,14.74,17.5,28.67,28.74,39.8,1.33,1.31,2.73,2.54,4.21,3.68l-17.46,2.65-2.57,16.63c-1.3-1.12-2.58-2.27-3.82-3.5-13.63-13.5-23.41-29.52-32.87-45.02-7.97-13.05-15.55-25.46-24.99-35.86l2.64-17.07,16.89-2.56Z"
|
||
|
|
style="stroke: #fff; stroke-miterlimit: 10"
|
||
|
|
>
|
||
|
|
<animate
|
||
|
|
attributeName="fill"
|
||
|
|
values="#5e74b7;url(#infinityGradient);#00D4FF;url(#infinityGradient);#5e74b7"
|
||
|
|
dur="3s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
<animate
|
||
|
|
attributeName="stroke-width"
|
||
|
|
values="1;4;1"
|
||
|
|
dur="3s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
<animate
|
||
|
|
attributeName="opacity"
|
||
|
|
values="0.8;1;0.8"
|
||
|
|
dur="3s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
</path>
|
||
|
|
|
||
|
|
<!-- Chronometer/clock with CSS pulse animation -->
|
||
|
|
<g>
|
||
|
|
<ellipse
|
||
|
|
cx="261.91"
|
||
|
|
cy="113.28"
|
||
|
|
rx="35.65"
|
||
|
|
ry="35.31"
|
||
|
|
style="fill: #f9b224"
|
||
|
|
>
|
||
|
|
<!-- CSS-style pulse animation: scale + opacity -->
|
||
|
|
<animateTransform
|
||
|
|
attributeName="transform"
|
||
|
|
type="scale"
|
||
|
|
values="1;1.05;1"
|
||
|
|
dur="2s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
<animate
|
||
|
|
attributeName="opacity"
|
||
|
|
values="1;0.75;1"
|
||
|
|
dur="2s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
</ellipse>
|
||
|
|
|
||
|
|
<!-- Chronometer display -->
|
||
|
|
<g style="clip-path: url(#d)">
|
||
|
|
<g>
|
||
|
|
<path
|
||
|
|
d="M329.9,88.02v57.19c0,1.92-1.57,3.47-3.51,3.47h-89.87c-1.94,0-3.51-1.55-3.51-3.47v-57.19c0-1.92,1.57-3.47,3.51-3.47h89.87c1.94,0,3.51,1.55,3.51,3.47"
|
||
|
|
style="fill: #5e74b7"
|
||
|
|
/>
|
||
|
|
<path
|
||
|
|
d="M236.69,87.19c.3,0,.55,.24,.55,.54s-.25,.54-.55,.54-.55-.24-.55-.54,.25-.54,.55-.54h0"
|
||
|
|
style="fill: #dba0a6"
|
||
|
|
/>
|
||
|
|
<path
|
||
|
|
d="M238.63,87.19c.3,0,.55,.24,.55,.54s-.25,.54-.55,.54-.55-.24-.55-.54,.25-.54,.55-.54h0"
|
||
|
|
style="fill: #f5cc56"
|
||
|
|
/>
|
||
|
|
<path
|
||
|
|
d="M240.56,87.19c.3,0,.55,.24,.55,.54s-.25,.54-.55,.54-.55-.24-.55-.54,.25-.54,.55-.54h0"
|
||
|
|
style="fill: #263682"
|
||
|
|
/>
|
||
|
|
<path
|
||
|
|
d="M237.73,89.86h87.43c.92,0,1.66,.74,1.66,1.64s-.74,1.64-1.66,1.64h-87.43c-.92,0-1.66-.74-1.66-1.64s.74-1.64,1.66-1.64m-1.16,9.24h22.25v45.29h-22.25v-45.29Zm23.91,0h64.88v45.29h-64.88v-45.29Z"
|
||
|
|
style="fill: #f3f4f5"
|
||
|
|
/>
|
||
|
|
|
||
|
|
<!-- Animated chart -->
|
||
|
|
<path
|
||
|
|
d="M265.45,108.82v13.02h53.62v-9.61s-3.47,2.93-5.61,2.93c-3.49,0-5.5-2.32-7.99-2.27-3.52,.07-4.32,2.03-7.04,2.27-3.57,.31-4.73-4.21-9.35-4.47-4.62-.27-6.46,4.96-10.78,4.65-3.26-.23-6.17-5.71-8.31-6.51-1.48-.45-3.06-.45-4.53,0"
|
||
|
|
style="fill: #f2ac41"
|
||
|
|
>
|
||
|
|
<!-- Real-time data animation -->
|
||
|
|
<animateTransform
|
||
|
|
attributeName="transform"
|
||
|
|
type="scale"
|
||
|
|
values="1,1;1.02,1.1;1,1"
|
||
|
|
dur="2s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
</path>
|
||
|
|
|
||
|
|
<path
|
||
|
|
d="M239.78,102.82h4.96v4.93h-4.96v-4.93Zm0,7.89h4.96v4.93h-4.96v-4.93Zm0,7.89h4.96v4.93h-4.96v-4.93Zm0,7.89h4.96v4.93h-4.96v-4.93Zm0,7.89h4.96v4.93h-4.96v-4.93Z"
|
||
|
|
style="fill: #8d9ccf"
|
||
|
|
/>
|
||
|
|
<path
|
||
|
|
d="M284.39,127.69h16.01v11.29h-16.01v-11.29Zm-18.94,0h16.01v11.29h-16.01v-11.29Zm37.61,0h16.01v11.29h-16.01v-11.29Zm-56.48-22.8h9.27v1.08h-9.27v-1.08Zm0,7.89h9.27v1.08h-9.27v-1.08Zm0,7.7h9.27v1.08h-9.27v-1.08Zm0,7.89h9.27v1.08h-9.27v-1.08Zm0,7.79h9.27v1.08h-9.27v-1.08Z"
|
||
|
|
style="fill: #d1d9e0"
|
||
|
|
/>
|
||
|
|
</g>
|
||
|
|
</g>
|
||
|
|
|
||
|
|
<!-- Green indicator with CSS pulse animation -->
|
||
|
|
<ellipse
|
||
|
|
cx="287.99"
|
||
|
|
cy="132.27"
|
||
|
|
rx="11.69"
|
||
|
|
ry="11.58"
|
||
|
|
style="fill: #05ab9e"
|
||
|
|
>
|
||
|
|
<animateTransform
|
||
|
|
attributeName="transform"
|
||
|
|
type="scale"
|
||
|
|
values="1;1.05;1"
|
||
|
|
dur="2s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
<animate
|
||
|
|
attributeName="opacity"
|
||
|
|
values="1;0.8;1"
|
||
|
|
dur="2s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
</ellipse>
|
||
|
|
|
||
|
|
<!-- Animated check mark -->
|
||
|
|
<path
|
||
|
|
d="M281.89,131.18l4.78,4.73,8.02-7.94"
|
||
|
|
style="
|
||
|
|
fill: none;
|
||
|
|
stroke: #fff;
|
||
|
|
stroke-width: 4px;
|
||
|
|
"
|
||
|
|
>
|
||
|
|
<animate
|
||
|
|
attributeName="stroke-dasharray"
|
||
|
|
values="0 20;20 20"
|
||
|
|
dur="1s"
|
||
|
|
repeatCount="indefinite"
|
||
|
|
/>
|
||
|
|
</path>
|
||
|
|
</g>
|
||
|
|
</g>
|
||
|
|
</g>
|
||
|
|
</symbol>
|
||
|
|
</svg>
|
||
|
|
</body>
|
||
|
|
</html>
|