starred/sky_phone
1
0
Fork 0
mirror of https://github.com/sky-systems/sky_phone.git synced 2026-08-28 17:01:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add preview image and refine live-demo SVG

Browse Source 
Add readme preview PNG and tweak live-demo-button.svg visuals: introduce a banner clipPath, add a shadowed background rect, wrap the main artwork in a clipped group, and move the outer border stroke outside the clipped area so the stroke renders correctly. Also remove a small teal accent circle. These changes improve rendering and provide a preview asset for the README.
This commit is contained in:
Leon.Schmidt
2026-08-19 12:41:03 +02:00
parent c3f42410a1
commit df824612b3
1 changed files with 6 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
readme-assets/live-demo-button.svg
+6 -3
View File
@@ -15,17 +15,19 @@
<filter id="shadow" x="-10%" y="-30%" width="120%" height="170%">
<feDropShadow dx="0" dy="8" stdDeviation="8" flood-color="#111827" flood-opacity="0.28"/>
</filter>
<clipPath id="banner-clip">
<rect x="4" y="4" width="772" height="136" rx="30"/>
</clipPath>
</defs>
<g filter="url(#shadow)">
<rect x="4" y="4" width="772" height="136" rx="30" fill="#111827" fill-opacity="0.01" filter="url(#shadow)"/>
<g clip-path="url(#banner-clip)">
<rect x="4" y="4" width="772" height="136" rx="30" fill="url(#background)"/>
<rect x="5" y="5" width="770" height="134" rx="29" fill="none" stroke="#c4b5fd" stroke-opacity="0.7" stroke-width="2"/>
<path d="M34 5H400L270 140H5V34A29 29 0 0 1 34 5Z" fill="url(#shine)"/>
<circle cx="72" cy="72" r="43" fill="#ffffff" fill-opacity="0.14"/>
<rect x="51" y="35" width="42" height="74" rx="10" fill="none" stroke="#ffffff" stroke-width="4"/>
<path d="M65 43h14M67 100h10" stroke="#ffffff" stroke-width="4" stroke-linecap="round"/>
<circle cx="86" cy="48" r="8" fill="#22d3ee"/>
<text x="132" y="66" fill="#ffffff" font-family="Segoe UI, Arial, sans-serif" font-size="32" font-weight="800" letter-spacing="0.8">TRY THE LIVE DEMO</text>
<text x="132" y="98" fill="#ede9fe" font-family="Segoe UI, Arial, sans-serif" font-size="17" font-weight="500">Experience the complete Sky Phone in your browser</text>
@@ -33,4 +35,5 @@
<rect x="590" y="48" width="156" height="50" rx="25" fill="#ffffff"/>
<text x="668" y="80" fill="#6d28d9" font-family="Segoe UI, Arial, sans-serif" font-size="16" font-weight="800" text-anchor="middle">OPEN NOW →</text>
</g>
<rect x="5" y="5" width="770" height="134" rx="29" fill="none" stroke="#c4b5fd" stroke-opacity="0.7" stroke-width="2"/>
</svg>
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.2 KiB

After

Width:  |  Height:  |  Size: 2.3 KiB