255 lines
No EOL
13 KiB
XML
255 lines
No EOL
13 KiB
XML
<svg viewBox="0 0 1920 1080" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
|
|
<!-- Definitions -->
|
|
<defs>
|
|
<!-- Gradients -->
|
|
<linearGradient id="bgGradient" x1="0%" y1="0%" x2="100%" y2="100%">
|
|
<stop offset="0%" style="stop-color:#2C3E50;stop-opacity:1" />
|
|
<stop offset="100%" style="stop-color:#1A1A1A;stop-opacity:1" />
|
|
</linearGradient>
|
|
|
|
<linearGradient id="orangeGradient" x1="0%" y1="0%" x2="100%" y2="100%">
|
|
<stop offset="0%" style="stop-color:#CE422B;stop-opacity:1" />
|
|
<stop offset="100%" style="stop-color:#E85D3D;stop-opacity:1" />
|
|
</linearGradient>
|
|
|
|
<linearGradient id="tealGradient" x1="0%" y1="0%" x2="100%" y2="100%">
|
|
<stop offset="0%" style="stop-color:#4ECDC4;stop-opacity:0.3" />
|
|
<stop offset="100%" style="stop-color:#4ECDC4;stop-opacity:0.1" />
|
|
</linearGradient>
|
|
|
|
<!-- Hexagonal Pattern -->
|
|
<pattern id="hexPattern" x="0" y="0" width="40" height="46" patternUnits="userSpaceOnUse">
|
|
<polygon points="20,1 38,11 38,35 20,45 2,35 2,11" fill="none" stroke="#4ECDC4" stroke-width="0.5" opacity="0.05"/>
|
|
</pattern>
|
|
|
|
<!-- Glow Filter -->
|
|
<filter id="glow">
|
|
<feGaussianBlur stdDeviation="4" result="coloredBlur"/>
|
|
<feMerge>
|
|
<feMergeNode in="coloredBlur"/>
|
|
<feMergeNode in="SourceGraphic"/>
|
|
</feMerge>
|
|
</filter>
|
|
|
|
<!-- Shadow Filter -->
|
|
<filter id="shadow" x="-50%" y="-50%" width="200%" height="200%">
|
|
<feGaussianBlur in="SourceAlpha" stdDeviation="10"/>
|
|
<feOffset dx="0" dy="10" result="offsetblur"/>
|
|
<feFlood flood-color="#000000" flood-opacity="0.3"/>
|
|
<feComposite in2="offsetblur" operator="in"/>
|
|
<feMerge>
|
|
<feMergeNode/>
|
|
<feMergeNode in="SourceGraphic"/>
|
|
</feMerge>
|
|
</filter>
|
|
|
|
<!-- Circuit Pattern -->
|
|
<pattern id="circuitPattern" x="0" y="0" width="100" height="100" patternUnits="userSpaceOnUse">
|
|
<path d="M 10,10 L 30,10 M 20,10 L 20,30 M 70,70 L 90,70 M 80,70 L 80,90" stroke="#4ECDC4" stroke-width="1" opacity="0.1"/>
|
|
<circle cx="20" cy="10" r="3" fill="#4ECDC4" opacity="0.2"/>
|
|
<circle cx="80" cy="70" r="3" fill="#4ECDC4" opacity="0.2"/>
|
|
</pattern>
|
|
</defs>
|
|
|
|
<!-- Background -->
|
|
<rect width="1920" height="1080" fill="url(#bgGradient)"/>
|
|
|
|
<!-- Hexagonal Pattern Overlay -->
|
|
<rect width="1920" height="1080" fill="url(#hexPattern)"/>
|
|
|
|
<!-- Circuit Corners -->
|
|
<g id="circuitCorners">
|
|
<!-- Top Left Corner -->
|
|
<rect x="0" y="0" width="200" height="200" fill="url(#circuitPattern)"/>
|
|
<path d="M 0,100 L 100,100 M 100,0 L 100,100" stroke="#4ECDC4" stroke-width="2" opacity="0.2"/>
|
|
|
|
<!-- Bottom Right Corner -->
|
|
<rect x="1720" y="880" width="200" height="200" fill="url(#circuitPattern)"/>
|
|
<path d="M 1820,1080 L 1820,980 M 1920,980 L 1820,980" stroke="#4ECDC4" stroke-width="2" opacity="0.2"/>
|
|
</g>
|
|
|
|
<!-- Left Side - Infrastructure Diagram -->
|
|
<g id="infrastructure">
|
|
<!-- Servers -->
|
|
<g id="servers">
|
|
<!-- Server 1 - Bare Metal -->
|
|
<rect x="100" y="200" width="140" height="70" rx="8" fill="url(#tealGradient)" stroke="#4ECDC4" stroke-width="2" filter="url(#shadow)"/>
|
|
<text x="170" y="240" text-anchor="middle" fill="white" font-family="Arial, sans-serif" font-size="14" font-weight="600">BARE METAL</text>
|
|
<circle cx="220" cy="220" r="5" fill="#4ECDC4">
|
|
<animate attributeName="opacity" values="1;0.3;1" dur="2s" repeatCount="indefinite"/>
|
|
</circle>
|
|
|
|
<!-- Server 2 - Container -->
|
|
<rect x="80" y="400" width="140" height="70" rx="8" fill="url(#tealGradient)" stroke="#4ECDC4" stroke-width="2" filter="url(#shadow)"/>
|
|
<text x="150" y="440" text-anchor="middle" fill="white" font-family="Arial, sans-serif" font-size="14" font-weight="600">CONTAINER</text>
|
|
<circle cx="200" cy="420" r="5" fill="#4ECDC4">
|
|
<animate attributeName="opacity" values="1;0.3;1" dur="2s" begin="0.5s" repeatCount="indefinite"/>
|
|
</circle>
|
|
|
|
<!-- Server 3 - Virtual -->
|
|
<rect x="120" y="600" width="140" height="70" rx="8" fill="url(#tealGradient)" stroke="#4ECDC4" stroke-width="2" filter="url(#shadow)"/>
|
|
<text x="190" y="640" text-anchor="middle" fill="white" font-family="Arial, sans-serif" font-size="14" font-weight="600">VIRTUAL</text>
|
|
<circle cx="240" cy="620" r="5" fill="#4ECDC4">
|
|
<animate attributeName="opacity" values="1;0.3;1" dur="2s" begin="1s" repeatCount="indefinite"/>
|
|
</circle>
|
|
</g>
|
|
|
|
<!-- Cloud Element -->
|
|
<g id="cloud" transform="translate(400, 150)">
|
|
<ellipse cx="0" cy="0" rx="100" ry="60" fill="url(#tealGradient)" stroke="#4ECDC4" stroke-width="2" filter="url(#shadow)"/>
|
|
<text x="0" y="10" text-anchor="middle" font-size="48">☁️</text>
|
|
</g>
|
|
|
|
<!-- Edge Devices -->
|
|
<g id="edgeDevices">
|
|
<!-- Device 1 -->
|
|
<rect x="650" y="350" width="80" height="80" rx="12" fill="rgba(206,66,43,0.1)" stroke="#CE422B" stroke-width="2" filter="url(#shadow)"/>
|
|
<text x="690" y="400" text-anchor="middle" font-size="32">📱</text>
|
|
|
|
<!-- Device 2 -->
|
|
<rect x="680" y="480" width="80" height="80" rx="12" fill="rgba(206,66,43,0.1)" stroke="#CE422B" stroke-width="2" filter="url(#shadow)"/>
|
|
<text x="720" y="530" text-anchor="middle" font-size="32">🖥️</text>
|
|
|
|
<!-- Device 3 -->
|
|
<rect x="640" y="610" width="80" height="80" rx="12" fill="rgba(206,66,43,0.1)" stroke="#CE422B" stroke-width="2" filter="url(#shadow)"/>
|
|
<text x="680" y="660" text-anchor="middle" font-size="32">⚡</text>
|
|
</g>
|
|
|
|
<!-- Data Flow Lines -->
|
|
<g id="dataFlows" stroke="#4ECDC4" stroke-width="2" fill="none" opacity="0.6">
|
|
<path d="M 240,235 Q 350,200 400,210" stroke-dasharray="10,5">
|
|
<animate attributeName="stroke-dashoffset" from="0" to="-15" dur="3s" repeatCount="indefinite"/>
|
|
</path>
|
|
<path d="M 220,435 Q 350,400 400,210" stroke-dasharray="10,5">
|
|
<animate attributeName="stroke-dashoffset" from="0" to="-15" dur="3s" repeatCount="indefinite"/>
|
|
</path>
|
|
<path d="M 260,635 Q 380,600 400,210" stroke-dasharray="10,5">
|
|
<animate attributeName="stroke-dashoffset" from="0" to="-15" dur="3s" repeatCount="indefinite"/>
|
|
</path>
|
|
<path d="M 500,150 L 650,390" stroke-dasharray="10,5">
|
|
<animate attributeName="stroke-dashoffset" from="0" to="-15" dur="3s" repeatCount="indefinite"/>
|
|
</path>
|
|
<path d="M 500,150 L 680,520" stroke-dasharray="10,5">
|
|
<animate attributeName="stroke-dashoffset" from="0" to="-15" dur="3s" repeatCount="indefinite"/>
|
|
</path>
|
|
<path d="M 500,150 L 640,650" stroke-dasharray="10,5">
|
|
<animate attributeName="stroke-dashoffset" from="0" to="-15" dur="3s" repeatCount="indefinite"/>
|
|
</path>
|
|
</g>
|
|
</g>
|
|
|
|
<!-- Logo Placeholder -->
|
|
<g id="logo" transform="translate(80, 60)">
|
|
<rect x="0" y="0" width="280" height="70" rx="8" fill="rgba(255,255,255,0.95)" filter="url(#shadow)"/>
|
|
<!-- Replace this text with your actual logo SVG -->
|
|
<text x="140" y="45" text-anchor="middle" fill="#1A1A1A" font-family="Arial, sans-serif" font-size="18" font-weight="700">provisioning.systems</text>
|
|
</g>
|
|
|
|
<!-- Right Side Content -->
|
|
<g id="mainContent" transform="translate(900, 0)">
|
|
<!-- Rust Crab with Gears -->
|
|
<g id="rustCrab" transform="translate(700, 300)">
|
|
<!-- Gears -->
|
|
<g id="gears">
|
|
<!-- Gear 1 -->
|
|
<circle cx="-50" cy="-50" r="40" fill="none" stroke="rgba(78,205,196,0.5)" stroke-width="3">
|
|
<animateTransform attributeName="transform" type="rotate" from="0 -50 -50" to="360 -50 -50" dur="10s" repeatCount="indefinite"/>
|
|
</circle>
|
|
<text x="-50" y="-40" text-anchor="middle" font-size="30" opacity="0.6">⚙️</text>
|
|
|
|
<!-- Gear 2 -->
|
|
<circle cx="50" cy="50" r="30" fill="none" stroke="rgba(78,205,196,0.5)" stroke-width="3">
|
|
<animateTransform attributeName="transform" type="rotate" from="0 50 50" to="-360 50 50" dur="10s" repeatCount="indefinite"/>
|
|
</circle>
|
|
<text x="50" y="58" text-anchor="middle" font-size="24" opacity="0.6">⚙️</text>
|
|
|
|
<!-- Gear 3 -->
|
|
<circle cx="60" cy="-30" r="25" fill="none" stroke="rgba(78,205,196,0.5)" stroke-width="3">
|
|
<animateTransform attributeName="transform" type="rotate" from="0 60 -30" to="360 60 -30" dur="10s" repeatCount="indefinite"/>
|
|
</circle>
|
|
<text x="60" y="-24" text-anchor="middle" font-size="20" opacity="0.6">⚙️</text>
|
|
</g>
|
|
|
|
<!-- Crab Body -->
|
|
<ellipse cx="0" cy="0" rx="75" ry="50" fill="url(#orangeGradient)" filter="url(#shadow)"/>
|
|
<text x="0" y="15" text-anchor="middle" font-size="80">🦀</text>
|
|
</g>
|
|
|
|
<!-- Title and Content -->
|
|
<g id="textContent">
|
|
<!-- Main Title -->
|
|
<text x="100" y="400" fill="#CE422B" font-family="Arial Black, sans-serif" font-size="86" font-weight="900" letter-spacing="-2">
|
|
<tspan x="100" dy="0">SYSTEMS</tspan>
|
|
<tspan x="100" dy="85">PROVISIONING</tspan>
|
|
</text>
|
|
|
|
<!-- Subtitle -->
|
|
<text x="100" y="520" fill="white" font-family="Arial, sans-serif" font-size="32" font-weight="300" opacity="0.95">
|
|
Infrastructure Automation with Rust
|
|
</text>
|
|
|
|
<!-- Meetup Badge -->
|
|
<text x="100" y="570" fill="#4ECDC4" font-family="Arial, sans-serif" font-size="18" font-weight="600" letter-spacing="2">
|
|
RUST MEETUP 2025
|
|
</text>
|
|
|
|
<!-- Event Info -->
|
|
<text x="100" y="620" fill="white" font-family="Arial, sans-serif" font-size="24" opacity="0.9">
|
|
<tspan fill="#4ECDC4">[FECHA]</tspan> • <tspan fill="#4ECDC4">[LUGAR]</tspan>
|
|
</text>
|
|
|
|
<!-- Feature Points -->
|
|
<g id="features" transform="translate(100, 670)">
|
|
<rect x="0" y="0" width="40" height="30" rx="15" fill="url(#tealGradient)" stroke="#4ECDC4" stroke-width="1"/>
|
|
<text x="20" y="20" text-anchor="middle" fill="#4ECDC4" font-size="14" font-weight="500">AI</text>
|
|
|
|
<rect x="55" y="0" width="100" height="30" rx="15" fill="url(#tealGradient)" stroke="#4ECDC4" stroke-width="1"/>
|
|
<text x="105" y="20" text-anchor="middle" fill="#4ECDC4" font-size="14" font-weight="500">DataFrames</text>
|
|
|
|
<rect x="170" y="0" width="95" height="30" rx="15" fill="url(#tealGradient)" stroke="#4ECDC4" stroke-width="1"/>
|
|
<text x="217" y="20" text-anchor="middle" fill="#4ECDC4" font-size="14" font-weight="500">Dashboards</text>
|
|
|
|
<rect x="280" y="0" width="75" height="30" rx="15" fill="url(#tealGradient)" stroke="#4ECDC4" stroke-width="1"/>
|
|
<text x="317" y="20" text-anchor="middle" fill="#4ECDC4" font-size="14" font-weight="500">ROI 70%</text>
|
|
</g>
|
|
|
|
<!-- Tech Icons -->
|
|
<g id="techIcons" transform="translate(100, 750)">
|
|
<rect x="0" y="0" width="50" height="50" rx="10" fill="rgba(255,255,255,0.05)" stroke="rgba(255,255,255,0.2)" stroke-width="1"/>
|
|
<text x="25" y="35" text-anchor="middle" font-size="24">🖥️</text>
|
|
|
|
<rect x="65" y="0" width="50" height="50" rx="10" fill="rgba(255,255,255,0.05)" stroke="rgba(255,255,255,0.2)" stroke-width="1"/>
|
|
<text x="90" y="35" text-anchor="middle" font-size="24">📦</text>
|
|
|
|
<rect x="130" y="0" width="50" height="50" rx="10" fill="rgba(255,255,255,0.05)" stroke="rgba(255,255,255,0.2)" stroke-width="1"/>
|
|
<text x="155" y="35" text-anchor="middle" font-size="24">🔌</text>
|
|
|
|
<rect x="195" y="0" width="50" height="50" rx="10" fill="rgba(255,255,255,0.05)" stroke="rgba(255,255,255,0.2)" stroke-width="1"/>
|
|
<text x="220" y="35" text-anchor="middle" font-size="24">📊</text>
|
|
|
|
<rect x="260" y="0" width="50" height="50" rx="10" fill="rgba(255,255,255,0.05)" stroke="rgba(255,255,255,0.2)" stroke-width="1"/>
|
|
<text x="285" y="35" text-anchor="middle" font-size="24">🚀</text>
|
|
</g>
|
|
</g>
|
|
|
|
<!-- QR Code Section -->
|
|
<g id="qrSection" transform="translate(800, 880)">
|
|
<rect x="0" y="0" width="120" height="120" rx="12" fill="white" filter="url(#shadow)"/>
|
|
<text x="60" y="70" text-anchor="middle" font-size="60">📱</text>
|
|
<text x="60" y="145" text-anchor="middle" fill="white" font-family="Arial, sans-serif" font-size="14" font-weight="600">RSVP Required</text>
|
|
<text x="60" y="165" text-anchor="middle" fill="#4ECDC4" font-family="Arial, sans-serif" font-size="12">Streaming Available</text>
|
|
</g>
|
|
</g>
|
|
|
|
<!-- Decorative Elements -->
|
|
<g id="decorativeElements" opacity="0.1">
|
|
<!-- Network Nodes -->
|
|
<circle cx="300" cy="800" r="80" fill="none" stroke="#4ECDC4" stroke-width="1"/>
|
|
<circle cx="300" cy="800" r="60" fill="none" stroke="#4ECDC4" stroke-width="1"/>
|
|
<circle cx="300" cy="800" r="40" fill="none" stroke="#4ECDC4" stroke-width="1"/>
|
|
|
|
<circle cx="1600" cy="200" r="70" fill="none" stroke="#CE422B" stroke-width="1"/>
|
|
<circle cx="1600" cy="200" r="50" fill="none" stroke="#CE422B" stroke-width="1"/>
|
|
<circle cx="1600" cy="200" r="30" fill="none" stroke="#CE422B" stroke-width="1"/>
|
|
</g>
|
|
</svg> |
