Vibrant 3D gradient CTA buttons for README (#209)
* docs: add demo video and article links to README Add tweet screenshot for the video demo prominently after the intro, and link to the full article thread. Replaces the TODO placeholder. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * docs: use article screenshot for README article link Replace text-only article link with clickable screenshot showing the article title, preview image, and engagement stats. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * docs: replace demo video screenshot with higher quality version Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * docs: vibrant 3D gradient CTA buttons for README - Replace flat black shields.io badges with custom SVG buttons - Purple gradient for "Watch the Demo" with play icon - Coral gradient for "Read the Full Article" with book icon - Both have 3D shine effect (top highlight, bottom shadow) - High contrast on both GitHub light and dark mode - Update article screenshot with cleaner version - Images remain clickable (already wrapped in <a> tags) Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * docs: remove white borders from CTA buttons Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> * docs: use manually captured PNG buttons instead of SVGs Playwright screenshots introduce 1-2px border artifacts on SVG img elements (microsoft/playwright#35014). Use clean manually-captured PNG screenshots instead. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
prateek
GitHub
parent
2c6f9e56b3
commit
001d411219
|
|
@ -25,7 +25,7 @@ Agent Orchestrator manages fleets of AI coding agents working in parallel on you
|
|||
<img src="docs/assets/demo-video-tweet.png" alt="Agent Orchestrator demo — AI agents building their own orchestrator" width="560">
|
||||
</a>
|
||||
|
||||
<a href="https://x.com/agent_wrapper/status/2026329204405723180"><img src="https://img.shields.io/badge/%E2%96%B6%EF%B8%8F_Watch_the_demo_on_X-black?style=for-the-badge&logo=x&logoColor=white" alt="Watch the demo on X"></a>
|
||||
<a href="https://x.com/agent_wrapper/status/2026329204405723180"><img src="docs/assets/btn-watch-demo.png" alt="Watch the Demo on X" height="48"></a>
|
||||
|
||||
</div>
|
||||
|
||||
|
|
@ -35,7 +35,7 @@ Agent Orchestrator manages fleets of AI coding agents working in parallel on you
|
|||
<img src="docs/assets/article-tweet.png" alt="The Self-Improving AI System That Built Itself" width="560">
|
||||
</a>
|
||||
|
||||
<a href="https://x.com/agent_wrapper/status/2025986105485733945"><img src="https://img.shields.io/badge/%F0%9F%93%96_Read_the_full_article_on_X-black?style=for-the-badge&logo=x&logoColor=white" alt="Read the full article on X"></a>
|
||||
<a href="https://x.com/agent_wrapper/status/2025986105485733945"><img src="docs/assets/btn-read-article.png" alt="Read the Full Article on X" height="48"></a>
|
||||
|
||||
</div>
|
||||
|
||||
|
|
|
|||
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
|
|
@ -0,0 +1,24 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="296" height="48" viewBox="0 0 296 48">
|
||||
<defs>
|
||||
<linearGradient id="bg" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0%" stop-color="#E8503A"/>
|
||||
<stop offset="50%" stop-color="#D94530"/>
|
||||
<stop offset="100%" stop-color="#C73A26"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="shine" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0%" stop-color="#FFFFFF" stop-opacity="0.25"/>
|
||||
<stop offset="50%" stop-color="#FFFFFF" stop-opacity="0.05"/>
|
||||
<stop offset="100%" stop-color="#000000" stop-opacity="0.1"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<rect width="296" height="48" rx="10" fill="url(#bg)"/>
|
||||
<rect width="296" height="48" rx="10" fill="url(#shine)"/>
|
||||
<rect x="0.5" y="0.5" width="295" height="47" rx="9.5" fill="none" stroke="none"/>
|
||||
<!-- Book icon -->
|
||||
<g transform="translate(22, 14)" fill="#FFFFFF">
|
||||
<path d="M0,2 C0,0.9 0.9,0 2,0 L8,0 C9.1,0 10,0.5 10,1.5 L10,18 C10,17 9.1,16.5 8,16.5 L2,16.5 C0.9,16.5 0,17.4 0,18.5 Z"/>
|
||||
<path d="M20,2 C20,0.9 19.1,0 18,0 L12,0 C10.9,0 10,0.5 10,1.5 L10,18 C10,17 10.9,16.5 12,16.5 L18,16.5 C19.1,16.5 20,17.4 20,18.5 Z"/>
|
||||
</g>
|
||||
<!-- Text -->
|
||||
<text x="52" y="29" font-family="system-ui,-apple-system,Segoe UI,Helvetica,Arial,sans-serif" font-size="16" font-weight="700" fill="#FFFFFF" letter-spacing="0.5">Read the Full Article on X</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.4 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 17 KiB |
|
|
@ -0,0 +1,21 @@
|
|||
<svg xmlns="http://www.w3.org/2000/svg" width="280" height="48" viewBox="0 0 280 48">
|
||||
<defs>
|
||||
<linearGradient id="bg" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0%" stop-color="#6C5CE7"/>
|
||||
<stop offset="50%" stop-color="#5B4BD5"/>
|
||||
<stop offset="100%" stop-color="#4A3AC3"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="shine" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0%" stop-color="#FFFFFF" stop-opacity="0.25"/>
|
||||
<stop offset="50%" stop-color="#FFFFFF" stop-opacity="0.05"/>
|
||||
<stop offset="100%" stop-color="#000000" stop-opacity="0.1"/>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<rect width="280" height="48" rx="10" fill="url(#bg)"/>
|
||||
<rect width="280" height="48" rx="10" fill="url(#shine)"/>
|
||||
<rect x="0.5" y="0.5" width="279" height="47" rx="9.5" fill="none" stroke="none"/>
|
||||
<!-- Play icon -->
|
||||
<polygon points="28,16 28,32 40,24" fill="#FFFFFF"/>
|
||||
<!-- Text -->
|
||||
<text x="52" y="29" font-family="system-ui,-apple-system,Segoe UI,Helvetica,Arial,sans-serif" font-size="16" font-weight="700" fill="#FFFFFF" letter-spacing="0.5">Watch the Demo on X</text>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.1 KiB |
Loading…
Reference in New Issue