IMPROVED - Remove dock shadows, fix bounce artifact, mac-radius icons, gallery icon

- Drop all shadows (dock, icons, tooltip, corner pills); this also removes the
  square that showed behind an icon mid-bounce.
- Bounce now moves the whole tile (logo bg lives on the animated element), so
  nothing is left behind.
- Icons use a ~22% macOS-like corner radius (art carries its own shape).
- Portfolio gets an original photo/gallery icon (not Apple's system icon).
This commit is contained in:
moh
2026-09-20 20:48:23 +02:00
parent c41a2e38c9
commit 57423b1baf
6 changed files with 38 additions and 33 deletions
+13 -8
View File
@@ -1,13 +1,18 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
<defs>
<linearGradient id="bg" x1="0" y1="0" x2="0" y2="1"><stop offset="0" stop-color="#454b57"/><stop offset="1" stop-color="#1c2027"/></linearGradient>
<linearGradient id="bg" x1="0" y1="0" x2="1" y2="1">
<stop offset="0" stop-color="#4aa8ff"/><stop offset="1" stop-color="#7b5cff"/></linearGradient>
<linearGradient id="gl" x1="0" y1="0" x2="0" y2="1">
<stop offset="0" stop-color="#fff" stop-opacity="0.26"/><stop offset="0.5" stop-color="#fff" stop-opacity="0"/></linearGradient>
<stop offset="0" stop-color="#fff" stop-opacity="0.30"/><stop offset="0.5" stop-color="#fff" stop-opacity="0"/></linearGradient>
<clipPath id="card"><rect x="27" y="31" width="46" height="38" rx="7"/></clipPath>
</defs>
<rect x="0" y="0" width="100" height="100" rx="28" fill="url(#bg)"/>
<rect x="0" y="0" width="100" height="100" rx="28" fill="url(#gl)"/>
<rect x="0.75" y="0.75" width="98.5" height="98.5" rx="27.25" fill="none" stroke="#fff" stroke-opacity="0.14" stroke-width="1.5"/>
<g fill="#fff">
<rect x="32" y="32" width="15" height="15" rx="4"/><rect x="53" y="32" width="15" height="15" rx="4"/>
<rect x="32" y="53" width="15" height="15" rx="4"/><rect x="53" y="53" width="15" height="15" rx="4"/></g>
<rect x="0" y="0" width="100" height="100" rx="22" fill="url(#bg)"/>
<rect x="0" y="0" width="100" height="100" rx="22" fill="url(#gl)"/>
<rect x="0.75" y="0.75" width="98.5" height="98.5" rx="21.25" fill="none" stroke="#fff" stroke-opacity="0.18" stroke-width="1.5"/>
<rect x="27" y="31" width="46" height="38" rx="7" fill="#ffffff"/>
<g clip-path="url(#card)">
<circle cx="40" cy="44" r="5.5" fill="#ffc23d"/>
<path d="M27 69 L43 52 L53 61 L61 51 L73 69 Z" fill="#37b877"/>
<path d="M55 69 L66 57 L73 64 L73 69 Z" fill="#2c9c86"/>
</g>
</svg>

Before

Width:  |  Height:  |  Size: 909 B

After

Width:  |  Height:  |  Size: 1.0 KiB