mirror of
https://github.com/github/awesome-copilot.git
synced 2026-04-16 13:15:56 +00:00
107 lines
5.9 KiB
XML
107 lines
5.9 KiB
XML
<svg xmlns="http://www.w3.org/2000/svg" width="800" height="460" viewBox="0 0 800 460">
|
|
<defs>
|
|
<linearGradient id="termBg" x1="0" y1="0" x2="0" y2="1">
|
|
<stop offset="0%" stop-color="#2D2B55"/>
|
|
<stop offset="100%" stop-color="#1E1B3A"/>
|
|
</linearGradient>
|
|
<linearGradient id="browserGlow" x1="0" y1="0" x2="1" y2="1">
|
|
<stop offset="0%" stop-color="#0D9488" stop-opacity="0.15"/>
|
|
<stop offset="100%" stop-color="#0D9488" stop-opacity="0.05"/>
|
|
</linearGradient>
|
|
</defs>
|
|
|
|
<!-- Background -->
|
|
<rect width="800" height="460" rx="12" fill="#F8FAFB"/>
|
|
|
|
<!-- Step indicator -->
|
|
<circle cx="46" cy="28" r="16" fill="#0D9488"/>
|
|
<text x="46" y="33" text-anchor="middle" font-family="Arial, Helvetica, sans-serif" font-size="14" font-weight="bold" fill="white">1</text>
|
|
<text x="72" y="33" font-family="Arial, Helvetica, sans-serif" font-size="15" font-weight="bold" fill="#334155">Type "let's napkin" to start</text>
|
|
|
|
<!-- Terminal Window -->
|
|
<g transform="translate(40, 55)">
|
|
<!-- Terminal chrome -->
|
|
<rect width="480" height="280" rx="10" fill="#1E1B3A" stroke="#3D3A5C" stroke-width="1"/>
|
|
<!-- Title bar -->
|
|
<rect width="480" height="36" rx="10" fill="#2D2B55"/>
|
|
<rect x="0" y="26" width="480" height="10" fill="#2D2B55"/>
|
|
<!-- Window buttons -->
|
|
<circle cx="20" cy="18" r="6" fill="#FF5F57"/>
|
|
<circle cx="40" cy="18" r="6" fill="#FFBD2E"/>
|
|
<circle cx="60" cy="18" r="6" fill="#28C840"/>
|
|
<!-- Title -->
|
|
<text x="240" y="22" text-anchor="middle" font-family="Arial, Helvetica, sans-serif" font-size="12" fill="#8B87B0">Terminal</text>
|
|
|
|
<!-- Terminal content -->
|
|
<!-- Prompt line 1 -->
|
|
<text x="20" y="68" font-family="monospace" font-size="13" fill="#8B87B0">~/Projects</text>
|
|
<text x="115" y="68" font-family="monospace" font-size="13" fill="#6C6A8A">$</text>
|
|
<text x="130" y="68" font-family="monospace" font-size="13" fill="#E0DEF4">copilot</text>
|
|
|
|
<!-- Prompt line 2 - the napkin command -->
|
|
<text x="20" y="100" font-family="monospace" font-size="13" fill="#0D9488">❯</text>
|
|
<text x="36" y="100" font-family="monospace" font-size="13" fill="#E0DEF4">let's napkin</text>
|
|
|
|
<!-- Copilot response -->
|
|
<text x="20" y="140" font-family="monospace" font-size="13" fill="#0D9488">✓</text>
|
|
<text x="36" y="140" font-family="monospace" font-size="13" fill="#A5F3FC">Opening your napkin whiteboard...</text>
|
|
|
|
<!-- Blank line then response -->
|
|
<text x="20" y="172" font-family="monospace" font-size="13" fill="#C4B5FD">Copilot</text>
|
|
<text x="20" y="196" font-family="monospace" font-size="13" fill="#E0DEF4">Your napkin is open in your browser!</text>
|
|
<text x="20" y="218" font-family="monospace" font-size="13" fill="#E0DEF4">Sketch your ideas, then click</text>
|
|
<text x="20" y="240" font-family="monospace" font-size="13" fill="#34D399">"Share with Copilot"</text>
|
|
<text x="215" y="240" font-family="monospace" font-size="13" fill="#E0DEF4">when ready.</text>
|
|
|
|
<!-- Cursor -->
|
|
<rect x="20" y="260" width="8" height="14" fill="#0D9488" opacity="0.8"/>
|
|
</g>
|
|
|
|
<!-- Browser opening indicator -->
|
|
<g transform="translate(560, 100)">
|
|
<!-- Mini browser window -->
|
|
<rect width="200" height="160" rx="8" fill="white" stroke="#D1D5DB" stroke-width="1.5"/>
|
|
<!-- Browser chrome -->
|
|
<rect width="200" height="28" rx="8" fill="#F1F5F9"/>
|
|
<rect x="0" y="20" width="200" height="8" fill="#F1F5F9"/>
|
|
<!-- Browser dots -->
|
|
<circle cx="14" cy="14" r="4" fill="#E2E8F0"/>
|
|
<circle cx="28" cy="14" r="4" fill="#E2E8F0"/>
|
|
<circle cx="42" cy="14" r="4" fill="#E2E8F0"/>
|
|
<!-- Address bar -->
|
|
<rect x="56" y="7" width="132" height="14" rx="3" fill="white" stroke="#E2E8F0" stroke-width="1"/>
|
|
<text x="72" y="17" font-family="Arial, Helvetica, sans-serif" font-size="7" fill="#94A3B8">napkin.html</text>
|
|
|
|
<!-- Canvas preview -->
|
|
<rect x="10" y="38" width="180" height="110" rx="3" fill="#FAFAFA"/>
|
|
<!-- Mini toolbar -->
|
|
<rect x="40" y="44" width="120" height="14" rx="3" fill="#F1F5F9" stroke="#E2E8F0" stroke-width="0.5"/>
|
|
<!-- Mini green button -->
|
|
<rect x="130" y="130" width="50" height="12" rx="3" fill="#0D9488"/>
|
|
<text x="155" y="139" text-anchor="middle" font-family="Arial, Helvetica, sans-serif" font-size="5" fill="white">Share</text>
|
|
<!-- Whiteboard grid dots -->
|
|
<circle cx="50" cy="80" r="1" fill="#E2E8F0"/>
|
|
<circle cx="80" cy="80" r="1" fill="#E2E8F0"/>
|
|
<circle cx="110" cy="80" r="1" fill="#E2E8F0"/>
|
|
<circle cx="140" cy="80" r="1" fill="#E2E8F0"/>
|
|
<circle cx="50" cy="105" r="1" fill="#E2E8F0"/>
|
|
<circle cx="80" cy="105" r="1" fill="#E2E8F0"/>
|
|
<circle cx="110" cy="105" r="1" fill="#E2E8F0"/>
|
|
<circle cx="140" cy="105" r="1" fill="#E2E8F0"/>
|
|
</g>
|
|
|
|
<!-- Curved arrow from terminal to browser -->
|
|
<path d="M525,200 C555,180 555,160 570,150" fill="none" stroke="#0D9488" stroke-width="2.5" stroke-dasharray="6,4"/>
|
|
<polygon points="568,144 576,150 568,156" fill="#0D9488"/>
|
|
|
|
<!-- Arrow label -->
|
|
<rect x="530" y="270" width="190" height="36" rx="6" fill="#0D9488" opacity="0.1"/>
|
|
<text x="625" y="285" text-anchor="middle" font-family="Arial, Helvetica, sans-serif" font-size="12" fill="#0D9488" font-weight="bold">Browser opens</text>
|
|
<text x="625" y="300" text-anchor="middle" font-family="Arial, Helvetica, sans-serif" font-size="11" fill="#0D9488">automatically</text>
|
|
|
|
<!-- Bottom caption -->
|
|
<rect x="40" y="365" width="720" height="70" rx="8" fill="white" stroke="#E2E8F0" stroke-width="1"/>
|
|
<text x="60" y="393" font-family="Arial, Helvetica, sans-serif" font-size="13" fill="#64748B" font-weight="bold">How it works:</text>
|
|
<text x="60" y="418" font-family="Arial, Helvetica, sans-serif" font-size="12" fill="#94A3B8">Type "let's napkin" (or "open the napkin") in your Copilot CLI session.</text>
|
|
<text x="60" y="436" font-family="Arial, Helvetica, sans-serif" font-size="12" fill="#94A3B8">A whiteboard will open in your default browser — no setup needed.</text>
|
|
</svg> |