feat(profile): update avatar selection with category filters and enhanced UI

- Replaced standard avatar titles with more engaging names. - Added category filter buttons for avatars: Fun & Emojis, Cyber & Bots, Modern Personas, Adventurer & Heroes. - Refactored avatar loading logic to use an array of avatar presets with associated categories and names. - Enhanced button styles for better user interaction feedback. - Implemented JavaScript function to filter displayed avatars based on selected category.
2026-09-10 13:27:36 +02:00
parent 47b0d38084
commit 03c7fb3067
25 changed files with 99 additions and 522 deletions
@@ -1,22 +1 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100" width="100" height="100">
-  <defs>
-    <linearGradient id="bg_avatar-03" x1="0%" y1="0%" x2="100%" y2="100%">
-      <stop offset="0%" stop-color="#10b981"/>
-      <stop offset="100%" stop-color="#059669"/>
-    </linearGradient>
-  </defs>
-  <circle cx="50" cy="50" r="50" fill="url(#bg_avatar-03)"/>
-  <ellipse cx="50" cy="94" rx="34" ry="24" fill="#ffffff" fill-opacity="0.2"/>
-  <rect x="42" y="58" width="16" height="14" rx="4" fill="#fef08a"/>
-  <ellipse cx="50" cy="46" rx="20" ry="22" fill="#fef08a"/>
-  <path d="M26 38 C28 22 72 22 74 38 Z" fill="#1e293b"/>
-  <path d="M30 38 H86 C88 38 88 41 84 43 H30 Z" fill="#0f172a"/>
-  <circle cx="43" cy="45" r="2.5" fill="#1e293b"/>
-  <circle cx="57" cy="45" r="2.5" fill="#1e293b"/>
-  <circle cx="44" cy="44" r="0.8" fill="#ffffff"/>
-  <circle cx="58" cy="44" r="0.8" fill="#ffffff"/>
-  <circle cx="43" cy="45" r="6" fill="none" stroke="#0f172a" stroke-width="2"/>
-  <circle cx="57" cy="45" r="6" fill="none" stroke="#0f172a" stroke-width="2"/>
-  <line x1="49" y1="45" x2="51" y2="45" stroke="#0f172a" stroke-width="2"/>
-  <path d="M45 54 Q50 60 55 54" fill="none" stroke="#991b1b" stroke-width="2" stroke-linecap="round"/>
-</svg>
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" fill="none" shape-rendering="auto"><metadata xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:dcterms="http://purl.org/dc/terms/"><rdf:RDF><rdf:Description><dc:title>Fun Emoji Set</dc:title><dc:creator>Davis Uche</dc:creator><dc:source xsi:type="dcterms:URI">https://www.figma.com/community/file/968125295144990435</dc:source><dcterms:license xsi:type="dcterms:URI">https://creativecommons.org/licenses/by/4.0/</dcterms:license><dc:rights>Remix of „Fun Emoji Set” (https://www.figma.com/community/file/968125295144990435) by „Davis Uche”, licensed under „CC BY 4.0” (https://creativecommons.org/licenses/by/4.0/)</dc:rights></rdf:Description></rdf:RDF></metadata><mask id="viewboxMask"><rect width="200" height="200" rx="100" ry="100" x="0" y="0" fill="#fff" /></mask><g mask="url(#viewboxMask)"><rect fill="#10b981" width="200" height="200" x="0" y="0" /><g transform="matrix(1.5625 0 0 1.5625 37.5 110.94)"><path d="M40.54 12h-.75c-9.7.22-20.8 5.3-23.7 16.15a1.36 1.36 0 0 0 .44 1.55 1.41 1.41 0 0 0 2.26-.86c2.55-9.46 12.42-13.89 21.06-14.08 8.24-.16 19.04 3.84 22.46 14.57a1.47 1.47 0 0 0 1.65.55A1.44 1.44 0 0 0 65 28.5C61.85 18.69 52.3 12 40.54 12Z" fill="#000"/></g><g transform="matrix(1.5625 0 0 1.5625 31.25 59.38)"><path d="M74.38 30a13 13 0 0 0 13-13v-.66C87.38 5.9 75.83-.87 68.45.1c-6.54.84-7.07 5.02-7.07 11.24V17a13.01 13.01 0 0 0 13 13Z" fill="#000"/><path d="M70.2 9.67a2.29 2.29 0 1 0 0-4.58 2.29 2.29 0 0 0 0 4.58Z" fill="#fff"/><path opacity=".1" d="M74.44 18.48a5.32 5.32 0 1 0 0-10.64 5.32 5.32 0 0 0 0 10.64Z" fill="#fff"/><path d="M13.37 30a13.01 13.01 0 0 1-13-13v-.66C.38 5.9 11.93-.87 19.32.1c6.56.84 7.07 5.02 7.07 11.24V17a13 13 0 0 1-13 13Z" fill="#000"/><path d="M9.22 9.67a2.29 2.29 0 1 0 0-4.58 2.29 2.29 0 0 0 0 4.58Z" fill="#fff"/><path opacity=".1" d="M13.46 18.48a5.32 5.32 0 1 0 0-10.64 5.32 5.32 0 0 0 0 10.64Z" fill="#fff"/></g></g></svg>