Giovanni Harting
f496380603
- Network nodes tech-style icon (dark theme, cyan accents) - Feature graphic for Play Store (1024x500) - PNG icons for all densities - Justfile with build, release, icons, install tasks
132 lines
5.1 KiB
XML
132 lines
5.1 KiB
XML
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1024 500">
|
|
<defs>
|
|
<linearGradient id="bgGrad" x1="0%" y1="0%" x2="100%" y2="100%">
|
|
<stop offset="0%" style="stop-color:#0f172a"/>
|
|
<stop offset="100%" style="stop-color:#1e293b"/>
|
|
</linearGradient>
|
|
</defs>
|
|
|
|
<!-- Background -->
|
|
<rect width="1024" height="500" fill="url(#bgGrad)"/>
|
|
|
|
<!-- Grid pattern -->
|
|
<g stroke="#334155" stroke-width="1" opacity="0.3">
|
|
<line x1="0" y1="100" x2="1024" y2="100"/>
|
|
<line x1="0" y1="200" x2="1024" y2="200"/>
|
|
<line x1="0" y1="300" x2="1024" y2="300"/>
|
|
<line x1="0" y1="400" x2="1024" y2="400"/>
|
|
<line x1="200" y1="0" x2="200" y2="500"/>
|
|
<line x1="400" y1="0" x2="400" y2="500"/>
|
|
<line x1="600" y1="0" x2="600" y2="500"/>
|
|
<line x1="800" y1="0" x2="800" y2="500"/>
|
|
</g>
|
|
|
|
<!-- Left side network visualization -->
|
|
<g transform="translate(120, 250)">
|
|
<!-- Connection lines -->
|
|
<g stroke="#0ea5e9" stroke-width="3" opacity="0.6">
|
|
<line x1="0" y1="0" x2="-60" y2="-80"/>
|
|
<line x1="0" y1="0" x2="-80" y2="0"/>
|
|
<line x1="0" y1="0" x2="-60" y2="80"/>
|
|
<line x1="0" y1="0" x2="80" y2="0"/>
|
|
</g>
|
|
|
|
<!-- Data pulses -->
|
|
<g fill="#22d3ee">
|
|
<circle cx="-30" cy="-40" r="3"/>
|
|
<circle cx="-40" cy="0" r="3"/>
|
|
<circle cx="-30" cy="40" r="3"/>
|
|
<circle cx="40" cy="0" r="3"/>
|
|
</g>
|
|
|
|
<!-- Outer nodes -->
|
|
<g fill="#0f172a" stroke="#0ea5e9" stroke-width="2">
|
|
<circle cx="-60" cy="-80" r="16"/>
|
|
<circle cx="-80" cy="0" r="16"/>
|
|
<circle cx="-60" cy="80" r="16"/>
|
|
</g>
|
|
<g fill="#22d3ee">
|
|
<circle cx="-60" cy="-80" r="6"/>
|
|
<circle cx="-80" cy="0" r="6"/>
|
|
<circle cx="-60" cy="80" r="6"/>
|
|
</g>
|
|
|
|
<!-- Center hub -->
|
|
<circle cx="0" cy="0" r="36" fill="#0f172a" stroke="#0ea5e9" stroke-width="3"/>
|
|
<circle cx="0" cy="0" r="26" fill="#0ea5e9"/>
|
|
|
|
<!-- Signal bars -->
|
|
<g fill="#0f172a">
|
|
<rect x="-14" y="4" width="6" height="12" rx="1"/>
|
|
<rect x="-5" cy="0" y="-2" width="6" height="18" rx="1"/>
|
|
<rect x="4" y="-8" width="6" height="24" rx="1"/>
|
|
</g>
|
|
</g>
|
|
|
|
<!-- Flowing data lines to right -->
|
|
<g stroke="#0ea5e9" stroke-width="2" fill="none" opacity="0.5">
|
|
<path d="M 200 250 Q 300 200, 400 250 T 600 250"/>
|
|
<path d="M 200 250 Q 300 300, 400 250 T 600 250"/>
|
|
</g>
|
|
<g fill="#22d3ee">
|
|
<circle cx="280" cy="220" r="4"/>
|
|
<circle cx="350" cy="260" r="4"/>
|
|
<circle cx="450" cy="240" r="4"/>
|
|
<circle cx="520" cy="255" r="4"/>
|
|
</g>
|
|
|
|
<!-- App name -->
|
|
<text x="500" y="180" font-family="system-ui, -apple-system, sans-serif" font-size="64" font-weight="700" fill="#ffffff">Tether API</text>
|
|
|
|
<!-- Tagline -->
|
|
<text x="500" y="240" font-family="system-ui, -apple-system, sans-serif" font-size="24" font-weight="400" fill="#94a3b8">Phone status on your desktop</text>
|
|
|
|
<!-- Feature chips -->
|
|
<g font-family="system-ui, sans-serif" font-size="14" fill="#e2e8f0">
|
|
<g transform="translate(500, 290)">
|
|
<rect x="0" y="0" width="120" height="32" rx="16" fill="#0ea5e9" opacity="0.2" stroke="#0ea5e9" stroke-width="1"/>
|
|
<text x="60" y="21" text-anchor="middle">5G / LTE / WiFi</text>
|
|
</g>
|
|
<g transform="translate(635, 290)">
|
|
<rect x="0" y="0" width="100" height="32" rx="16" fill="#0ea5e9" opacity="0.2" stroke="#0ea5e9" stroke-width="1"/>
|
|
<text x="50" y="21" text-anchor="middle">REST API</text>
|
|
</g>
|
|
<g transform="translate(750, 290)">
|
|
<rect x="0" y="0" width="90" height="32" rx="16" fill="#0ea5e9" opacity="0.2" stroke="#0ea5e9" stroke-width="1"/>
|
|
<text x="45" y="21" text-anchor="middle">Waybar</text>
|
|
</g>
|
|
<g transform="translate(855, 290)">
|
|
<rect x="0" y="0" width="100" height="32" rx="16" fill="#0ea5e9" opacity="0.2" stroke="#0ea5e9" stroke-width="1"/>
|
|
<text x="50" y="21" text-anchor="middle">Auto-start</text>
|
|
</g>
|
|
</g>
|
|
|
|
<!-- Right side: laptop illustration -->
|
|
<g transform="translate(780, 380)">
|
|
<!-- Laptop -->
|
|
<rect x="0" y="50" width="160" height="8" rx="2" fill="#334155"/>
|
|
<rect x="15" y="-20" width="130" height="75" rx="4" fill="#1e293b" stroke="#334155" stroke-width="2"/>
|
|
<rect x="22" y="-13" width="116" height="60" rx="2" fill="#0f172a"/>
|
|
|
|
<!-- Terminal content -->
|
|
<text x="28" y="5" font-family="monospace" font-size="10" fill="#22d3ee">$ curl /status</text>
|
|
<text x="28" y="18" font-family="monospace" font-size="9" fill="#94a3b8">{"type":"LTE"}</text>
|
|
<text x="28" y="30" font-family="monospace" font-size="9" fill="#94a3b8">{"signal":3}</text>
|
|
<text x="28" y="42" font-family="monospace" font-size="9" fill="#94a3b8">{"battery":87}</text>
|
|
</g>
|
|
|
|
<!-- Decorative corner nodes -->
|
|
<g fill="#0ea5e9" opacity="0.3">
|
|
<circle cx="50" cy="50" r="8"/>
|
|
<circle cx="974" cy="50" r="8"/>
|
|
<circle cx="50" cy="450" r="8"/>
|
|
<circle cx="974" cy="450" r="8"/>
|
|
</g>
|
|
<g stroke="#0ea5e9" stroke-width="1" fill="none" opacity="0.2">
|
|
<line x1="50" y1="50" x2="120" y2="50"/>
|
|
<line x1="50" y1="50" x2="50" y2="120"/>
|
|
<line x1="974" y1="50" x2="904" y2="50"/>
|
|
<line x1="974" y1="50" x2="974" y2="120"/>
|
|
</g>
|
|
</svg>
|