WEBSITE - optimize icons, bake in shadow and glow effect, pre-stepped animation + download only select Google icons

This commit is contained in:
Alex Sim committed 2026-09-27 17:52:16 +02:00
1 parent bcc20b038e
commit 0dc2d9ee6b
8 files changed
+479 -23

No files matched your search

+1 -1
View File
@@ -5,7 +5,7 @@ description: >-
url: "https://alesimula.github.io" url: "https://alesimula.github.io"
baseurl: "" baseurl: ""
version: "1.0.11" #Website version - increase to invalidate cached resources version: "1.0.12" #Website version - increase to invalidate cached resources
github_repo: "alesimula/Murine-launcher" github_repo: "alesimula/Murine-launcher"
icon_url: "https://raw.githubusercontent.com/alesimula/Murine-launcher/refs/heads/main/image/app_icon/icon_browser_fullsize.svg" icon_url: "https://raw.githubusercontent.com/alesimula/Murine-launcher/refs/heads/main/image/app_icon/icon_browser_fullsize.svg"
icon_freeform_url: "https://raw.githubusercontent.com/alesimula/Murine-launcher/refs/heads/main/image/app_icon/icon_freeform.svg" icon_freeform_url: "https://raw.githubusercontent.com/alesimula/Murine-launcher/refs/heads/main/image/app_icon/icon_freeform.svg"
+2 -2
View File
@@ -17,8 +17,8 @@
<link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Noto+Sans:wght@400;500;600;700&display=swap" rel="stylesheet"> <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Noto+Sans:wght@400;500;600;700&display=swap" rel="stylesheet">
<!-- Material Symbols --> <!-- Material Symbols: only the icons in use (~4 KB instead of the ~4 MB variable font). TODO Add every new icon here, list must stay alphabetical -->
<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=block"> <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&icon_names=android,calendar_today,chat,close,cloud_off,code,dark_mode,description,download,favorite,history,home,hourglass_top,light_mode,mail,new_releases,palette,policy,search,sell,smartphone&display=block">
<link rel="icon" type="image/svg+xml" href="{{ site.icon_url }}"> <link rel="icon" type="image/svg+xml" href="{{ site.icon_url }}">
<link rel="stylesheet" href="{{ '/assets/css/style.css' | relative_url }}?v={{ site.version }}"> <link rel="stylesheet" href="{{ '/assets/css/style.css' | relative_url }}?v={{ site.version }}">
+121 -17
View File
@@ -526,11 +526,12 @@ h1, h2, h3, h4, h5, h6 {
position: relative; position: relative;
width: 280px; width: 280px;
height: 280px; height: 280px;
perspective: 1000px; animation: heroFloat 6s step-end infinite;
animation: heroFloat 6s ease-in-out infinite;
} }
/* Tap to flip between the square icon and the freeform one */ /* Tap to flip between the square icon and the freeform one.
The 3D setup only exists while .flipping is set (see index.md): at rest the visible
face is a plain 2D image, so moving it doesn't go through the 3D render path */
.hero-icon-flip { .hero-icon-flip {
width: 100%; width: 100%;
height: 100%; height: 100%;
@@ -539,41 +540,144 @@ h1, h2, h3, h4, h5, h6 {
background: none; background: none;
cursor: pointer; cursor: pointer;
outline: none; outline: none;
transform-style: preserve-3d;
transition: transform .8s cubic-bezier(.2,.7,.2,1);
} }
.hero-icon-wrapper.flipping { perspective: 1000px; }
.hero-icon-wrapper.flipping .hero-icon-flip { transform-style: preserve-3d; }
.hero-icon-wrapper.animating .hero-icon-flip { transition: transform .8s cubic-bezier(.2,.7,.2,1); }
.hero-icon-flip:focus-visible { /* keep a ring for keyboard users */ .hero-icon-flip:focus-visible { /* keep a ring for keyboard users */
outline: 2px solid var(--md-primary); outline: 2px solid var(--md-primary);
outline-offset: 8px; outline-offset: 8px;
border-radius: var(--md-shape-md); border-radius: var(--md-shape-md);
} }
.hero-icon-wrapper.flipped .hero-icon-flip { .hero-icon-wrapper.flipping.flipped .hero-icon-flip {
transform: rotateY(180deg); transform: rotateY(180deg);
} }
/* The *_glow.svg icons have the shadow baked in, with a 320-unit margin around the
1024-unit icon so it isn't clipped: 320/1024 = 31.25% on each side */
.hero-icon-face { .hero-icon-face {
position: absolute; position: absolute;
inset: 0; top: -31.25%;
width: 100%; left: -31.25%;
height: 100%; width: 162.5%;
backface-visibility: hidden; height: 162.5%;
filter: drop-shadow(0 16px 48px rgba(128,50,200,.30)); max-width: none; /* the global img rule would cap it at 100% */
} }
.hero-icon-back { .hero-icon-wrapper.flipping .hero-icon-face { backface-visibility: hidden; }
transform: rotateY(180deg); .hero-icon-wrapper.flipping .hero-icon-back { transform: rotateY(180deg); }
/* At rest, only the current face is shown */
.hero-icon-wrapper:not(.flipping):not(.flipped) .hero-icon-back,
.hero-icon-wrapper.flipped:not(.flipping) .hero-icon-face:not(.hero-icon-back) {
visibility: hidden;
} }
@media (prefers-reduced-motion: reduce) { @media (prefers-reduced-motion: reduce) {
.hero-icon-wrapper { animation: none; } .hero-icon-wrapper { animation: none; }
.hero-icon-flip { transition: none; }
} }
@keyframes heroFloat { @keyframes heroFloat { /* ease-in-out, pre-stepped to 0.25px: redraws 96 times per 6s cycle instead of every frame */
0%, 100% { transform: translateY(0px); } 0%, 100% { transform: translateY(0); }
50% { transform: translateY(-12px); } 3.65% { transform: translateY(-0.25px); }
6.26% { transform: translateY(-0.5px); }
8.04% { transform: translateY(-0.75px); }
9.46% { transform: translateY(-1px); }
10.69% { transform: translateY(-1.25px); }
11.79% { transform: translateY(-1.5px); }
12.79% { transform: translateY(-1.75px); }
13.72% { transform: translateY(-2px); }
14.59% { transform: translateY(-2.25px); }
15.41% { transform: translateY(-2.5px); }
16.19% { transform: translateY(-2.75px); }
16.94% { transform: translateY(-3px); }
17.67% { transform: translateY(-3.25px); }
18.37% { transform: translateY(-3.5px); }
19.05% { transform: translateY(-3.75px); }
19.72% { transform: translateY(-4px); }
20.37% { transform: translateY(-4.25px); }
21.01% { transform: translateY(-4.5px); }
21.64% { transform: translateY(-4.75px); }
22.26% { transform: translateY(-5px); }
22.88% { transform: translateY(-5.25px); }
23.49% { transform: translateY(-5.5px); }
24.09% { transform: translateY(-5.75px); }
24.70% { transform: translateY(-6px); }
25.30% { transform: translateY(-6.25px); }
25.91% { transform: translateY(-6.5px); }
26.51% { transform: translateY(-6.75px); }
27.12% { transform: translateY(-7px); }
27.74% { transform: translateY(-7.25px); }
28.36% { transform: translateY(-7.5px); }
28.99% { transform: translateY(-7.75px); }
29.63% { transform: translateY(-8px); }
30.28% { transform: translateY(-8.25px); }
30.95% { transform: translateY(-8.5px); }
31.63% { transform: translateY(-8.75px); }
32.33% { transform: translateY(-9px); }
33.06% { transform: translateY(-9.25px); }
33.81% { transform: translateY(-9.5px); }
34.59% { transform: translateY(-9.75px); }
35.41% { transform: translateY(-10px); }
36.28% { transform: translateY(-10.25px); }
37.21% { transform: translateY(-10.5px); }
38.21% { transform: translateY(-10.75px); }
39.31% { transform: translateY(-11px); }
40.54% { transform: translateY(-11.25px); }
41.96% { transform: translateY(-11.5px); }
43.74% { transform: translateY(-11.75px); }
46.35% { transform: translateY(-12px); }
53.65% { transform: translateY(-11.75px); }
56.26% { transform: translateY(-11.5px); }
58.04% { transform: translateY(-11.25px); }
59.46% { transform: translateY(-11px); }
60.69% { transform: translateY(-10.75px); }
61.79% { transform: translateY(-10.5px); }
62.79% { transform: translateY(-10.25px); }
63.72% { transform: translateY(-10px); }
64.59% { transform: translateY(-9.75px); }
65.41% { transform: translateY(-9.5px); }
66.19% { transform: translateY(-9.25px); }
66.94% { transform: translateY(-9px); }
67.67% { transform: translateY(-8.75px); }
68.37% { transform: translateY(-8.5px); }
69.05% { transform: translateY(-8.25px); }
69.72% { transform: translateY(-8px); }
70.37% { transform: translateY(-7.75px); }
71.01% { transform: translateY(-7.5px); }
71.64% { transform: translateY(-7.25px); }
72.26% { transform: translateY(-7px); }
72.88% { transform: translateY(-6.75px); }
73.49% { transform: translateY(-6.5px); }
74.09% { transform: translateY(-6.25px); }
74.70% { transform: translateY(-6px); }
75.30% { transform: translateY(-5.75px); }
75.91% { transform: translateY(-5.5px); }
76.51% { transform: translateY(-5.25px); }
77.12% { transform: translateY(-5px); }
77.74% { transform: translateY(-4.75px); }
78.36% { transform: translateY(-4.5px); }
78.99% { transform: translateY(-4.25px); }
79.63% { transform: translateY(-4px); }
80.28% { transform: translateY(-3.75px); }
80.95% { transform: translateY(-3.5px); }
81.63% { transform: translateY(-3.25px); }
82.33% { transform: translateY(-3px); }
83.06% { transform: translateY(-2.75px); }
83.81% { transform: translateY(-2.5px); }
84.59% { transform: translateY(-2.25px); }
85.41% { transform: translateY(-2px); }
86.28% { transform: translateY(-1.75px); }
87.21% { transform: translateY(-1.5px); }
88.21% { transform: translateY(-1.25px); }
89.31% { transform: translateY(-1px); }
90.54% { transform: translateY(-0.75px); }
91.96% { transform: translateY(-0.5px); }
93.74% { transform: translateY(-0.25px); }
96.35% { transform: translateY(0); }
} }
/* --- Feature Cards --- */ /* --- Feature Cards --- */
+1
View File
@@ -0,0 +1 @@
<svg width="1664" height="1664" viewBox="-320 -320 1664 1664" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" xmlns:c2pa="http://c2pa.org/manifest"><metadata><c2pa:manifest>AAAWgmp1bWIAAAAeanVtZGMycGEAEQAQgAAAqgA4m3EDYzJwYQAAABZcanVtYgAAAEdqdW1kYzJtYQARABCAAACqADibcQN1cm46YzJwYTowZDk3NjJhOC0xY2QwLTQyOTItOTlkMS1lNTgzNDEyYTg0MDYAAAADl2p1bWIAAAApanVtZGMyYXMAEQAQgAAAqgA4m3EDYzJwYS5hc3NlcnRpb25zAAAAALxqdW1iAAAARGp1bWRjYm9yABEAEIAAAKoAOJtxE2MycGEuaW5ncmVkaWVudC52MwAAAAAYYzJzaJKtWjgeNQbpSm56G0XFCBYAAABwY2JvcqNpZGM6Zm9ybWF0bWltYWdlL3N2Zyt4bWxqaW5zdGFuY2VJRHgseG1wOmlpZDozYzk2MGE5ZS1lNjM4LTQ3NDAtODRiNC1hNTU5NTZlNDQ0ODlscmVsYXRpb25zaGlwaHBhcmVudE9mAAAB4mp1bWIAAABBanVtZGNib3IAEQAQgAAAqgA4m3ETYzJwYS5hY3Rpb25zLnYyAAAAABhjMnNoFpV/wsrTKF39lN2OA6zGpAAAAZljYm9yomdhY3Rpb25zgqJmYWN0aW9ua2MycGEub3BlbmVkanBhcmFtZXRlcnOha2luZ3JlZGllbnRzgaJjdXJseC1zZWxmI2p1bWJmPWMycGEuYXNzZXJ0aW9ucy9jMnBhLmluZ3JlZGllbnQudjNkaGFzaFgg58Er1J45DVEEi7VlVvp/KBU3pV2SrRcvL+5fkX3veESkZmFjdGlvbngdY29tLmFudGhyb3BpYy5jbGF1ZGUucHJvdmlkZWRqcGFyYW1ldGVyc6F4H2NvbS5hbnRocm9waWMub3JpZ2luLWNvbmZpZGVuY2VndW5rbm93bmtkZXNjcmlwdGlvbnhmQ2xhdWRlIHByb3ZpZGVkIHRoaXMgZmlsZSBhdCB0aGUgcmVxdWVzdCBvZiBhIHVzZXIgYW5kIG1heSBoYXZlIGNyZWF0ZWQgb3IgbW9kaWZpZWQgdGhlIGZpbGUgY29udGVudHMubXNvZnR3YXJlQWdlbnShZG5hbWVmQ2xhdWRlcmFsbEFjdGlvbnNJbmNsdWRlZPUAAADIanVtYgAAAEBqdW1kY2JvcgARABCAAACqADibcRNjMnBhLmhhc2guZGF0YQAAAAAYYzJzaPC8rfkMdQCs/ExtJ3ghQQUAAACAY2JvcqVjYWxnZnNoYTI1NmNwYWRMAAAAAAAAAAAAAAAAZGhhc2hYIMZMu1b+EcbiNUo4OkM21hOoufoPMVUJrTWi91CE1HFsZG5hbWVuanVtYmYgbWFuaWZlc3RqZXhjbHVzaW9uc4GiZXN0YXJ0GQFaZmxlbmd0aBkeBAAAAj5qdW1iAAAAJ2p1bWRjMmNsABEAEIAAAKoAOJtxA2MycGEuY2xhaW0udjIAAAACD2Nib3KlY2FsZ2ZzaGEyNTZpc2lnbmF0dXJleE1zZWxmI2p1bWJmPS9jMnBhL3VybjpjMnBhOjBkOTc2MmE4LTFjZDAtNDI5Mi05OWQxLWU1ODM0MTJhODQwNi9jMnBhLnNpZ25hdHVyZWppbnN0YW5jZUlEeCx4bXA6aWlkOjQxM2ZiYWJjLWU5ZDYtNDQ3NS1hZTc1LWYwNjE3NzQ0MDhjM3JjcmVhdGVkX2Fzc2VydGlvbnODomN1cmx4LXNlbGYjanVtYmY9YzJwYS5hc3NlcnRpb25zL2MycGEuaW5ncmVkaWVudC52M2RoYXNoWCDnwSvUnjkNUQSLtWVW+n8oFTelXZKtFy8v7l+Rfe94RKJjdXJseCpzZWxmI2p1bWJmPWMycGEuYXNzZXJ0aW9ucy9jMnBhLmFjdGlvbnMudjJkaGFzaFggCwdL350tLjBjURXcSI9nJe6koKTAf9ZqCbX5U7hcjYGiY3VybHgpc2VsZiNqdW1iZj1jMnBhLmFzc2VydGlvbnMvYzJwYS5oYXNoLmRhdGFkaGFzaFggAIxjCCyuwvKF+nGmomdaeQ2nYV1oGShIj57sdbS7kNt0Y2xhaW1fZ2VuZXJhdG9yX2luZm+jZG5hbWVvQW50aHJvcGljIEZpbGVzZ3ZlcnNpb25lMS4wLjBrc3BlY1ZlcnNpb25lMi40LjAAABA4anVtYgAAAChqdW1kYzJjcwARABCAAACqADibcQNjMnBhLnNpZ25hdHVyZQAAABAIY2JvctKEWQISogEmGCFZAgowggIGMIIBjaADAgECAhRA5aAK7sI50L64g/oGQgU9Z1UTADAKBggqhkjOPQQDAzBJMRcwFQYDVQQKEw5BbnRocm9waWMsIFBCQzEuMCwGA1UEAxMlQW50aHJvcGljIENvbnRlbnQgQ3JlZGVudGlhbHMgUm9vdCBDQTAeFw0yNjA4MDcxODQzNTZaFw0yODA4MDYxOTQzNTZaMEQxFzAVBgNVBAoTDkFudGhyb3BpYywgUEJDMSkwJwYDVQQDEyBBbnRocm9waWMgQ2xhdWRlIENvbnRlbnQgU2lnbmluZzBZMBMGByqGSM49AgEGCCqGSM49AwEHA0IABJh6CmvLUBgFFNU0vUKlOVtE6djd17L5SuwX0LemFisBM3dkd/3cyjxFA3Qo5S46fX0/ihY0VZ7mfb9KF703t5OjWDBWMA4GA1UdDwEB/wQEAwIHgDAVBgNVHSUEDjAMBgorBgEEAYPoXgIBMAwGA1UdEwEB/wQCMAAwHwYDVR0jBBgwFoAUzlHiBIFOZFsj+OPEz5o+nMHXXMIwCgYIKoZIzj0EAwMDZwAwZAIwMXMdFJ4BetLLVY7ORuE9noqbbAZOZn/aArXyTwFAZfKrPzxF2vPoJNf1+UCdg1XGAjBwX1zd9WGqYkqmL5SFqw1QySjr1zJfpJM9+1rdDwSPLMOPOjKuiXjoU/pUUeG9RwmhY3BhZFkNngAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAALine truncated

After

Width:  |  Height:  |  Size: 20 KiB

+263
View File
@@ -0,0 +1,263 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<svg
width="1664"
height="1664"
viewBox="-320 -320 1664 1664"
version="1.1"
id="svg13"
sodipodi:docname="icon_adaptive_glow.svg"
inkscape:version="1.4.3 (0d15f75, 2025-12-25)"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns="http://www.w3.org/2000/svg"
xmlns:svg="http://www.w3.org/2000/svg">
<defs
id="defs13">
<linearGradient
id="linearGradient3"
inkscape:collect="always">
<stop
style="stop-color:#a721de;stop-opacity:1;"
offset="0"
id="stop3" />
<stop
style="stop-color:#ed6d68;stop-opacity:1;"
offset="1"
id="stop4" />
</linearGradient>
<linearGradient
inkscape:collect="always"
xlink:href="#linearGradient3"
id="linearGradient4"
x1="-586.54504"
y1="572.22617"
x2="337.28998"
y2="572.22617"
gradientUnits="userSpaceOnUse"
gradientTransform="matrix(1.108423,0,0,1.1008397,650.14001,-117.9293)" />
<!-- Hero glow, baked from the site's former CSS drop-shadow(0 16px 48px rgba(128,50,200,.30))
on a 280px icon (1px = 1024/280 units: blur sigma 24px = 87.8, offset 16px = 58.5).
The canvas has a 320-unit margin so the glow isn't clipped; the "out" composite keeps it
only where the icon doesn't cover it -->
<filter id="glow" filterUnits="userSpaceOnUse" x="-320" y="-320" width="1664" height="1664" color-interpolation-filters="sRGB">
<feGaussianBlur in="SourceAlpha" stdDeviation="87.8"/>
<feOffset dy="58.5" result="blur"/>
<feFlood flood-color="#8032c8" flood-opacity="0.3"/>
<feComposite in2="blur" operator="in"/>
<feComposite in2="SourceAlpha" operator="out"/>
</filter>
</defs>
<sodipodi:namedview
id="namedview13"
pagecolor="#ffffff"
bordercolor="#999999"
borderopacity="1"
inkscape:showpageshadow="2"
inkscape:pageopacity="0"
inkscape:pagecheckerboard="0"
inkscape:deskcolor="#d1d1d1"
inkscape:document-units="pt"
inkscape:zoom="0.5"
inkscape:cx="-2"
inkscape:cy="897"
inkscape:window-width="2560"
inkscape:window-height="1494"
inkscape:window-x="2869"
inkscape:window-y="-11"
inkscape:window-maximized="1"
inkscape:current-layer="svg13" />
<use xlink:href="#icon_glow_source" filter="url(#glow)"/>
<g id="icon_glow_source">
<rect
style="fill:url(#linearGradient4);stroke-width:0.828469"
id="rect2"
width="1024"
height="1024"
x="0"
y="-1.4210855e-14"
ry="192.93948"
inkscape:label="background" />
<g
id="#fed700ff"
style="fill:#b24090;fill-opacity:1"
transform="matrix(1.0155896,0,0,1.0155896,-8.5864899,62.203735)"
inkscape:label="nose">
<path
fill="#fed700"
opacity="1"
d="m 460,644 h 105 l -12,60 h -80 z"
id="path9-9-9"
sodipodi:nodetypes="ccccc"
inkscape:label="nostrils"
style="fill:#000000;fill-opacity:1"
transform="translate(0.008042,-0.03745)" />
</g>
<g
id="#0caa35ff-1"
transform="matrix(1.0155896,0,0,1.0155896,78.254588,181.75137)"
inkscape:label="eyes">
<path
fill="#fed700"
opacity="1"
d="m 276.29258,465.67653 45.9092,-47.76297 190.1283,157.77547 -164.83717,2.29915 z"
id="path9-9"
sodipodi:nodetypes="ccccc"
inkscape:label="eye_right_solid"
style="fill:#000000;fill-opacity:1"
transform="translate(-85.5,-117.75)" />
<path
fill="#fed700"
opacity="1"
d="m 748.54109,465.81828 -45.9092,-47.76297 -190.1283,157.77547 164.83717,2.29915 z"
id="path9-9-8"
sodipodi:nodetypes="ccccc"
inkscape:label="eye_left_solid"
style="fill:#000000;fill-opacity:1"
transform="translate(-85.5,-117.75)" />
<path
fill="#ff0800"
opacity="1"
d="m 692.23926,485.01863 c -9.26,5.39 -18.48,10.86 -27.71,16.3 -2.79,1.6 -6.05,3.69 -5.4,7.43 0.3,11.18 -2.12,22.5 -8.04,32.08 -8.28,14.91 -34.32425,26.28559 -51.02425,28.28559 l 26.78425,3.81066 10.82,-5.47625 c 7.16,-3.22 14.35,-6.61 20.55,-11.5 6.98,-5.32 12.85,-12.01 17.69,-19.3 9.84,-15.44 14.18,-33.64 16.33,-51.63 z"
id="path10-8"
style="fill:#c89ab1;fill-opacity:1"
sodipodi:nodetypes="cccccccccc"
inkscape:label="pupil_right"
transform="translate(-85.5,-117.75)" />
<path
fill="#ff0800"
opacity="1"
d="m 331.85,485.18 c 9.26,5.39 18.48,10.86 27.71,16.3 2.79,1.6 6.05,3.69 5.4,7.43 -0.3,11.18 2.12,22.5 8.04,32.08 8.28,14.91 34.32425,26.28559 51.02425,28.28559 L 397.24,573.08625 386.42,567.61 c -7.16,-3.22 -14.35,-6.61 -20.55,-11.5 -6.98,-5.32 -12.85,-12.01 -17.69,-19.3 -9.84,-15.44 -14.18,-33.64 -16.33,-51.63 z"
id="path10"
style="fill:#c89ab1;fill-opacity:1"
sodipodi:nodetypes="cccccccccc"
inkscape:label="pupil_left"
transform="translate(-85.5,-117.75)" />
</g>
<g
id="#0caa35ff"
inkscape:label="ears"
transform="matrix(1.0155896,0,0,1.0155896,-8.5783219,62.165695)">
<path
fill="#fed700"
opacity="1"
d="m 229.99488,263.72503 c -9.59,-33.70939 -40.19784,-76.16736 -59.42082,-100.35401 l 0.59522,64.60061 61.77935,51.9375 z"
id="path9-9-9-9-2"
sodipodi:nodetypes="ccccc"
inkscape:label="ear_left_border"
style="fill:#000000;fill-opacity:1"
transform="translate(85.5,117.75)" />
<path
fill="#fed700"
opacity="1"
d="m 623.82876,263.37841 c 9.59,-33.70939 40.19784,-76.16736 59.42082,-100.35401 l -0.59522,64.60061 -61.77935,51.9375 z"
id="path9-9-9-9"
sodipodi:nodetypes="ccccc"
inkscape:label="ear_right_border"
style="fill:#000000;fill-opacity:1"
transform="translate(85.5,117.75)" />
<path
opacity="1"
d="M 169.2775,213.67 239.34698,256.96632 282.185,440.3175 156.9025,395.4825 Z"
id="path4"
fill="#0caa35"
style="fill:#5a1e64;fill-opacity:1"
inkscape:label="ear_outer_left"
sodipodi:nodetypes="ccccc" />
<path
opacity="1"
d="M 854.6575,214.5 784.58802,257.79632 741.75,441.1475 867.0325,396.3125 Z"
id="path4-9"
fill="#0caa35"
style="fill:#5a1e64;fill-opacity:1"
inkscape:label="ear_outer_right"
sodipodi:nodetypes="ccccc" />
<path
fill="#fed700"
opacity="1"
d="M 767.01026,281.04844 797.91188,252.65 c 3.9,11.23 7.23812,24.89 8.54812,36.76 2.86,22.53 0.38,45.53 -5.7,67.34 -2.02,7.57 -5.65601,14.89831 -8.28601,22.24831 l -42.41496,15.58697 -0.85499,-56.71531 c 4.20212,-16.83967 10.92622,-40.73153 17.80622,-56.82153 z"
id="path8"
inkscape:label="ear_right_inner"
style="fill:#b24090;fill-opacity:1"
sodipodi:nodetypes="cccccccc"
transform="translate(-0.00804248,0.03745265)" />
<path
fill="#fed700"
opacity="1"
d="m 218.41,327.71 c -1.7,-25.53125 1.0025,-50.5025 11.1925,-72.3025 l 28.58274,27.37543 c 7.99758,17.58501 14.06366,36.60348 18.93476,54.22707 l -1.83571,56.56946 -43.62542,-14.01857 C 223.94887,363.49089 220.01,345.38 218.41,327.71 Z"
id="path9"
sodipodi:nodetypes="ccccccc"
inkscape:label="ear_left_inner"
style="fill:#b24090;fill-opacity:1"
transform="translate(-0.00804248,0.03745265)" />
</g>
<g
id="#ff0800ff"
style="fill:#c89ab1;fill-opacity:1"
inkscape:label="whiskers"
transform="matrix(1.0155896,0,0,1.0155896,-8.5783219,62.165695)">
<path
opacity="1"
d="m 230.77387,613.91901 118.55085,-20.75153 69.61419,67.68165 -141.79123,4.61252 10.87624,-26.34715 z"
id="path6"
fill="#0caa35"
style="fill:#5a1e64;fill-opacity:1"
inkscape:label="whisker_bottom_left"
sodipodi:nodetypes="cccccc" />
<path
opacity="1"
d="m 797.88812,611.90783 -124.00397,-14.66606 -67.36419,64.86915 141.79123,4.61252 -10.87624,-26.34715 z"
id="path6-9"
fill="#0caa35"
style="fill:#5a1e64;fill-opacity:1"
inkscape:label="whisker_bottom_right"
sodipodi:nodetypes="cccccc" />
<path
fill="#ff0800"
opacity="1"
d="m 207.25416,561.37297 67.92683,-26.72883 153.94026,92.24836 c -13.05,2.44 -45.18125,0.3375 -58.31125,2.3175 l -10.75,-9.1 z"
id="path12"
style="fill:#c89ab1;fill-opacity:1"
inkscape:label="whisker_top_left"
sodipodi:nodetypes="cccccc" />
<path
fill="#ff0800"
opacity="1"
d="m 816.72761,561.3602 -67.92683,-26.72883 -153.94026,92.24836 c 13.05,2.44 45.84948,0.24027 58.97948,2.22027 l 10.08,-9 z"
id="path12-9"
style="fill:#c89ab1;fill-opacity:1"
inkscape:label="whisker_top_left"
sodipodi:nodetypes="cccccc" />
</g>
<g
id="#000000ff"
style="fill:#fcecdc;fill-opacity:1"
inkscape:label="head"
transform="matrix(1.0155896,0,0,1.0155896,-8.5783219,62.165695)">
<path
fill="#000000"
opacity="1"
d="m 174.79,151.74 c 20.88,-6.44 43.49,-5.88 64.43,0.01 31.2,8.44 58.38,27.45 81.96,49.03 10.6,10.42 21.44,20.66 30.64,32.38 14.36,17.17 26.6,36 37.55,55.49 l 10.14,16.8 -3.55,-16.54 c 8.84,15.73 14.39,32.99 21.66,49.46 5.69,13.84 12.44,27.21 18.49,40.89 -11.64,-7.68 -22.54,-16.46 -34.14,-24.22 -7.76,-5.05 -15.15,-10.71 -23.3,-15.12 8.62,17.79 19.81,34.15 31.08,50.34 10.545,14.625 21.54255,28.91145 33.14625,42.705 L 512.64,515.12191 595.63,414.57 c 11.74,-15.07 22.96,-30.56 33.29,-46.63 5.76,-9.12 11.78,-18.17 16.04,-28.12 -13.91,8.15 -26.72,18.02 -39.97,27.17 -5.96,4.05 -11.42,8.86 -17.84,12.22 10.4,-20.1 19.72,-40.75 28.4,-61.65 4.08,-9.33 8.15537,-20.45719 13.41279,-29.38922 L 625.97,303.21 l 6.79,-11.52 c 17.49,-32.36 39.99,-61.95 66.07,-87.86 24.17,-22.94 52.19,-43.35 84.74,-52.25 22.56,-6.4 47.03,-5.95 69.25,1.63 30.35,10.3 56.31,33.33 69.28,62.73 14.64,32.17 16.09,69.04 9.15,103.33 -7.14,33.74 -23.56,65.6 -47.51,90.48 -24.02,25.23 -56.18,43.84 -91.12,47.85 -10.61,1.24 -21.3,-0.01 -31.92,0.66 10,3.56 20.48,5.53 30.5,9.06 -4.9,8.23 -11.48,15.22 -17.53,22.58 19.13,0.32 38.27,0 57.4,0.25 -8.72,13.55 -19.25,25.96 -31.46,36.49 -3.62,2.97 -7.46,5.65 -11.07,8.63 l 67.62,21.07 c -16.41,24.28 -36.62,46.54 -61.56,62.24 -5.12,3.1 -10.7,5.3 -16,8.05 12.18,1.23 24.42,1.25 36.63,1.63 -5.19,5.26 -11.42,9.29 -17.34,13.66 -26.13,18.83 -55.76,32.08 -85.89,43.1 -8.32,3.54 -17.48,5.58 -24.69,11.3 -12.8,9.88 -26.54,18.49 -40.63,26.41 -9.11,4.91 -18.12,10.18 -27.99,13.43 3.75,-4.09 8.16,-7.49 11.98,-11.5 9.03,-9.65 18.04,-19.31 26.59,-29.39 3.88,-4.73 8.43,-9.03 11.16,-14.59 -5.18,2.89 -9.65,6.81 -14.47,10.23 -15.91,11.58 -31.51,23.79 -48.97,32.99 -15.99,8.31 -33.25,14.34 -51.11,16.92 -2.76,0.27 -5.38,-0.8 -7.89,-1.77 -7.94,-3.19 -15.72,-6.78 -23.34,-10.67 -3.34,-1.69 -6.5,-3.79 -10.04,-5.05 -2.02,-0.73 -3.91,0.75 -5.68,1.5 -8.79,4.75 -17.72,9.24 -26.9,13.19 -4.03,1.65 -8.31,3.49 -12.76,2.67 -14.27,-2.27 -28.28,-6.35 -41.29,-12.66 -26.2,-12.14 -48.04,-31.4 -71.35,-48.04 3.36,5.89 8.02,10.88 12.35,16.06 6.28,7.03 12.58,14.04 18.86,21.08 5.91,6.58 12.69,12.34 18.42,19.09 -24.52,-10.53 -47.93,-23.98 -68.73,-40.76 -6.66,-5.14 -15.03,-7.08 -22.68,-10.24 -19.7,-7.26 -38.95,-15.72 -57.52,-25.51 -16.13,-9.04 -31.62,-19.32 -45.61,-31.43 12.22,-0.31 24.44,-0.81 36.64,-1.54 -6.12,-3.31 -12.77,-5.58 -18.59,-9.43 -24.05,-15.84 -43.54,-37.65 -60.07,-61.02 l 67.62,-20.98 C 217.39,524.02 204.38,506.98 192,490.17 c 11.67,0.38 23.33,-0.16 35,-0.14 7.82,-0.06 15.64,0.17 23.45,-0.23 -5.71,-7.59 -12.15,-14.62 -17.52,-22.47 10.44,-3.01 21.07,-5.46 31.29,-9.19 -11.82,-0.54 -23.72,0.93 -35.49,-0.79 -26,-3.86 -50.79,-15.25 -70.9,-32.15 -18.52,-15.03 -33.55,-34 -45.33,-54.66 C 95,338.66 86.81,301.71 89.46,265.43 c 2.45,-30.57 13.8,-61.29 35.74,-83.25 13.5,-14.25 30.73,-24.94 49.59,-30.44 m -20.28,39.82 c 5.79,2.54 12.05,3.71 17.93,6.02 6.1,2.38 12.05,5.15 17.91,8.07 21.99,11.01 41.11,27.85 54.43,48.56 5.97,9.69 10.5,20.18 14.4,30.85 -10.12,-9.11 -19.22,-19.36 -30.14,-27.59 -10.28,-9.1 -21.73,-16.86 -33.7,-23.55 -14.34,16.14 -21.5,37.66 -22.31,59.03 -1.07,30.17 8.56,60.09 24.56,85.47 11.55,18.31 27.36,34.15 46.37,44.65 6.62,3.64 13.73,6.74 21.35,7.31 -3.85,-4.67 -8.41,-8.7 -12.21,-13.42 -9.54,-11.1 -16.65,-24.11 -21.64,-37.83 10.63,0.23 20.9,3.28 30.93,6.54 -4.04,-6.41 -8.14,-12.81 -11.43,-19.65 -8.81,-18.28 -13.08,-38.68 -12.94,-58.94 12.52,7.37 24.11,16.26 34.7,26.19 1.08812,1.01095 9.74107,9.08331 13.84,14.2 3.88,4.76 8.05,9.28 11.73,14.2 3.85,5.51 7.53,11.15 11.72,16.42 1.61,-38.27 -7.16,-77.04 -25.41,-110.74 -15.04,-27.39 -37.58,-51.16 -65.55,-65.45 -19.71,-9.94 -42.68,-14.66 -64.54,-10.34 m 651.23,9.26 c -14.61,6.71 -27.36,16.92 -38.59,28.32 -24.42,24.23 -40.04,56.34 -47.27,89.76 -4.11,19.45 -6.79,39.37 -5.71,59.28 8.63,-12.23 17.23,-24.57 27.58,-35.44 4.04444,-4.36868 11.32022,-11.84855 19.62,-18.4 7.71,-6.43 16.23,-11.78 24.59,-17.31 0.45,16.85 -2.55,33.75 -8.41,49.54 -3.84,10.58 -9.89,20.09 -15.89,29.53 10.06,-3.37 20.34,-6.26 30.93,-7.4 -3.57,12.42 -10.21,23.72 -17.85,34.05 -4.85,6.72 -11.37,11.95 -16.67,18.27 13.87,-2.01 26.3,-9.31 37.38,-17.55 22.69,-17.78 38.72,-43.12 47.77,-70.3 7.39,-21.65 9.95,-45.24 5.34,-67.76 -3.29,-15.04 -9.55,-29.72 -19.6,-41.5 -11.23,5.78 -21.68,13.04 -31.47,20.99 -11.8,8.88 -21.78,19.83 -32.19,30.22 7.75517,-23.62868 24.25,-48.16 45.01,-64.83 13.93,-11.2 30.16,-19.3 47.13,-24.77 4.29,-1.29 8.65,-2.36 12.86,-3.95 -21.75,-4.07 -44.68,-0.22 -64.56,9.25 M 300.19,450.88 c 4.86,27.35 13.78,54.4 29.08,77.76 8.24,12.84 19.46,23.93 33.04,31.04 22.40799,11.89185 50.19528,11.5636 74.23,4.77 2.95,-0.85 6.07,-2.47 9.17,-1.3 7.06,2.29 14.25,4.42 21.7,4.91 -4.09,-4.2 -9.15,-7.21 -13.83,-10.66 -20.71,-14.97 -41.43,-29.94 -62.45,-44.49 -30.21,-20.82 -60.61,-41.4 -90.94,-62.03 m 415.95,5.24 c -15.69,11.05 -31.72,21.6 -47.56,32.42 -30.94,21.36 -62.33,42.07 -92.45,64.59 -6.66,5.12 -13.8,9.6 -20.27,14.96 7.65,-0.16 14.84,-2.96 22.07,-5.16 3.29,-1.18 6.62,0.41 9.77,1.3 11.39269,3.79169 40.87221,7.78368 58.52258,1.16709 12.8Line truncated
id="path1"
sodipodi:nodetypes="ccccccccccccscccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccccc"
inkscape:label="face"
style="fill:#fcecdc;fill-opacity:1" />
<path
fill="#000000"
opacity="1"
d="m 394.74,245.13 c 10.15,2.26 20.1,5.31 30.13,8.01 10.18,2.91 20.42,5.76 30.28,9.66 3.52,1.24 6.85,4.07 10.79,3.23 26.68,-4.88 54.06,-4.53 80.96,-1.77 5.56,0.38 11.42,3.12 16.79,0.44 10.33,-4.65 21.25,-7.75 32.09,-10.94 11.07,-3.02 22.01,-6.61 33.34,-8.58 L 512.64,437.46 Z"
id="path2"
inkscape:label="head_fluff"
sodipodi:nodetypes="cccccccccc"
style="fill:#fcecdc;fill-opacity:1" />
<path
fill="#000000"
opacity="1"
d="m 509.69,737.61 c 1.92,-1.06 3.95,0.09 5.71,0.93 9.24,4.83 18.51,9.63 27.87,14.24 2.31,0.95 4.74,2.49 7.34,1.82 l 43.67,-12.96 c -15.77,20.18 -34,38.65 -55.15,53.2 l 1.18,-12.53 -28.7,21.15 -28.64,-21.61 1.86,13.11 c -15.85,-11.5 -30.67,-24.47 -43.98,-38.84 -4.24,-4.63 -8.56,-9.21 -12.17,-14.35 l 30.53,9.01 c 4.91,1.2 9.56,3.66 14.63,4.06 4.2,-1.04 7.87,-3.49 11.78,-5.26 8.1,-3.83 15.88,-8.33 24.07,-11.97 z"
id="path3"
inkscape:label="chin"
sodipodi:nodetypes="cccccccccccccccc"
style="fill:#fcecdc;fill-opacity:1" />
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 17 KiB

+1
View File
@@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1664" height="1664" viewBox="-320 -320 1664 1664" xmlns:c2pa="http://c2pa.org/manifest"><metadata><c2pa:manifest>AAAWgmp1bWIAAAAeanVtZGMycGEAEQAQgAAAqgA4m3EDYzJwYQAAABZcanVtYgAAAEdqdW1kYzJtYQARABCAAACqADibcQN1cm46YzJwYTo3MmMxYzE5Zi03MzIyLTRhZjgtYjZkMS05NDI0M2M0ZWVjOTAAAAADl2p1bWIAAAApanVtZGMyYXMAEQAQgAAAqgA4m3EDYzJwYS5hc3NlcnRpb25zAAAAALxqdW1iAAAARGp1bWRjYm9yABEAEIAAAKoAOJtxE2MycGEuaW5ncmVkaWVudC52MwAAAAAYYzJzaC1SvrJF9glqo1xHDrZi39IAAABwY2JvcqNpZGM6Zm9ybWF0bWltYWdlL3N2Zyt4bWxqaW5zdGFuY2VJRHgseG1wOmlpZDo2M2RiOTNmNS1iMzMwLTRmY2YtYTI5NS1jMDFjMDhlMjVlODNscmVsYXRpb25zaGlwaHBhcmVudE9mAAAB4mp1bWIAAABBanVtZGNib3IAEQAQgAAAqgA4m3ETYzJwYS5hY3Rpb25zLnYyAAAAABhjMnNopTN8lFsjSHJyH2l4a6DUKwAAAZljYm9yomdhY3Rpb25zgqJmYWN0aW9ua2MycGEub3BlbmVkanBhcmFtZXRlcnOha2luZ3JlZGllbnRzgaJjdXJseC1zZWxmI2p1bWJmPWMycGEuYXNzZXJ0aW9ucy9jMnBhLmluZ3JlZGllbnQudjNkaGFzaFggmqBmkNLGs0CTF0hjNdFwCxl9WP6ujC2CP7nS9sV4D/2kZmFjdGlvbngdY29tLmFudGhyb3BpYy5jbGF1ZGUucHJvdmlkZWRqcGFyYW1ldGVyc6F4H2NvbS5hbnRocm9waWMub3JpZ2luLWNvbmZpZGVuY2VndW5rbm93bmtkZXNjcmlwdGlvbnhmQ2xhdWRlIHByb3ZpZGVkIHRoaXMgZmlsZSBhdCB0aGUgcmVxdWVzdCBvZiBhIHVzZXIgYW5kIG1heSBoYXZlIGNyZWF0ZWQgb3IgbW9kaWZpZWQgdGhlIGZpbGUgY29udGVudHMubXNvZnR3YXJlQWdlbnShZG5hbWVmQ2xhdWRlcmFsbEFjdGlvbnNJbmNsdWRlZPUAAADIanVtYgAAAEBqdW1kY2JvcgARABCAAACqADibcRNjMnBhLmhhc2guZGF0YQAAAAAYYzJzaPAIA442N4a2cUo0jGHnCkEAAACAY2JvcqVjYWxnZnNoYTI1NmNwYWRMAAAAAAAAAAAAAAAAZGhhc2hYIIq+KY5sHig4jWt2I+vPQAA7fPxmZgv2aIS7lYy8dvMYZG5hbWVuanVtYmYgbWFuaWZlc3RqZXhjbHVzaW9uc4GiZXN0YXJ0GQFEZmxlbmd0aBkeBAAAAj5qdW1iAAAAJ2p1bWRjMmNsABEAEIAAAKoAOJtxA2MycGEuY2xhaW0udjIAAAACD2Nib3KlY2FsZ2ZzaGEyNTZpc2lnbmF0dXJleE1zZWxmI2p1bWJmPS9jMnBhL3VybjpjMnBhOjcyYzFjMTlmLTczMjItNGFmOC1iNmQxLTk0MjQzYzRlZWM5MC9jMnBhLnNpZ25hdHVyZWppbnN0YW5jZUlEeCx4bXA6aWlkOjNmOTUzMjM2LTVmZmUtNDA0Yy1hYWZjLTEwODg3NmNiM2U0NnJjcmVhdGVkX2Fzc2VydGlvbnODomN1cmx4LXNlbGYjanVtYmY9YzJwYS5hc3NlcnRpb25zL2MycGEuaW5ncmVkaWVudC52M2RoYXNoWCCaoGaQ0sazQJMXSGM10XALGX1Y/q6MLYI/udL2xXgP/aJjdXJseCpzZWxmI2p1bWJmPWMycGEuYXNzZXJ0aW9ucy9jMnBhLmFjdGlvbnMudjJkaGFzaFgg2Hk8iPg2sdqdPTbObX9Qtza/U+RL1yeAdlpC5AQpEJyiY3VybHgpc2VsZiNqdW1iZj1jMnBhLmFzc2VydGlvbnMvYzJwYS5oYXNoLmRhdGFkaGFzaFggCCM/zaLREeWMl2UgGiuArErlVjI+W/f+FkWHxEAGr5l0Y2xhaW1fZ2VuZXJhdG9yX2luZm+jZG5hbWVvQW50aHJvcGljIEZpbGVzZ3ZlcnNpb25lMS4wLjBrc3BlY1ZlcnNpb25lMi40LjAAABA4anVtYgAAAChqdW1kYzJjcwARABCAAACqADibcQNjMnBhLnNpZ25hdHVyZQAAABAIY2JvctKEWQISogEmGCFZAgowggIGMIIBjaADAgECAhRA5aAK7sI50L64g/oGQgU9Z1UTADAKBggqhkjOPQQDAzBJMRcwFQYDVQQKEw5BbnRocm9waWMsIFBCQzEuMCwGA1UEAxMlQW50aHJvcGljIENvbnRlbnQgQ3JlZGVudGlhbHMgUm9vdCBDQTAeFw0yNjA4MDcxODQzNTZaFw0yODA4MDYxOTQzNTZaMEQxFzAVBgNVBAoTDkFudGhyb3BpYywgUEJDMSkwJwYDVQQDEyBBbnRocm9waWMgQ2xhdWRlIENvbnRlbnQgU2lnbmluZzBZMBMGByqGSM49AgEGCCqGSM49AwEHA0IABJh6CmvLUBgFFNU0vUKlOVtE6djd17L5SuwX0LemFisBM3dkd/3cyjxFA3Qo5S46fX0/ihY0VZ7mfb9KF703t5OjWDBWMA4GA1UdDwEB/wQEAwIHgDAVBgNVHSUEDjAMBgorBgEEAYPoXgIBMAwGA1UdEwEB/wQCMAAwHwYDVR0jBBgwFoAUzlHiBIFOZFsj+OPEz5o+nMHXXMIwCgYIKoZIzj0EAwMDZwAwZAIwMXMdFJ4BetLLVY7ORuE9noqbbAZOZn/aArXyTwFAZfKrPzxF2vPoJNf1+UCdg1XGAjBwX1zd9WGqYkqmL5SFqw1QySjr1zJfpJM9+1rdDwSPLMOPOjKuiXjoU/pUUeG9RwmhY3BhZFkNngAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAALine truncated

After

Width:  |  Height:  |  Size: 21 KiB

+75
View File
@@ -0,0 +1,75 @@
<?xml version="1.0" encoding="UTF-8"?>
<!-- Legacy launcher icon, generated from res/drawable/ic_launcher_legacy.xml -->
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="1664" height="1664" viewBox="-320 -320 1664 1664">
<defs>
<path id="ic_launcher_path_head" d="m108.8,159.8c25,-7.7 52,-7 77,0 37.3,10.1 69.8,32.8 97.9,58.6 12.7,12.5 25.6,24.7 36.6,38.7 17.2,20.5 31.8,43 44.9,66.3l12.1,20.1 -4.2,-19.8c10.6,18.8 17.2,39.4 25.9,59.1 6.8,16.5 14.9,32.5 22.1,48.9 -13.9,-9.2 -26.9,-19.7 -40.8,-28.9 -9.3,-6 -18.1,-12.8 -27.8,-18.1 10.3,21.3 23.7,40.8 37.1,60.2 12.6,17.5 25.7,34.5 39.6,51L512.6,594.1 611.7,473.9c14,-18 27.4,-36.5 39.8,-55.7 6.9,-10.9 14.1,-21.7 19.2,-33.6 -16.6,9.7 -31.9,21.5 -47.8,32.5 -7.1,4.8 -13.6,10.6 -21.3,14.6 12.4,-24 23.6,-48.7 33.9,-73.7 4.9,-11.1 9.7,-24.4 16,-35.1L648,340.8l8.1,-13.8c20.9,-38.7 47.8,-74 79,-105 28.9,-27.4 62.4,-51.8 101.3,-62.4 27,-7.6 56.2,-7.1 82.8,1.9 36.3,12.3 67.3,39.8 82.8,75 17.5,38.4 19.2,82.5 10.9,123.5 -8.5,40.3 -28.2,78.4 -56.8,108.1 -28.7,30.1 -67.1,52.4 -108.9,57.2 -12.7,1.5 -25.5,-0 -38.1,0.8 11.9,4.3 24.5,6.6 36.4,10.8 -5.9,9.8 -13.7,18.2 -20.9,27 22.9,0.4 45.7,0 68.6,0.3 -10.4,16.2 -23,31 -37.6,43.6 -4.3,3.5 -8.9,6.8 -13.2,10.3l80.8,25.2c-19.6,29 -43.8,55.6 -73.6,74.4 -6.1,3.7 -12.8,6.3 -19.1,9.6 14.6,1.5 29.2,1.5 43.8,1.9 -6.2,6.3 -13.6,11.1 -20.7,16.3 -31.2,22.5 -66.6,38.3 -102.6,51.5 -9.9,4.2 -20.9,6.7 -29.5,13.5 -15.3,11.8 -31.7,22.1 -48.6,31.6 -10.9,5.9 -21.7,12.2 -33.4,16 4.5,-4.9 9.8,-9 14.3,-13.7 10.8,-11.5 21.6,-23.1 31.8,-35.1 4.6,-5.7 10.1,-10.8 13.3,-17.4 -6.2,3.5 -11.5,8.1 -17.3,12.2 -19,13.8 -37.7,28.4 -58.5,39.4 -19.1,9.9 -39.7,17.1 -61.1,20.2 -3.3,0.3 -6.4,-1 -9.4,-2.1 -9.5,-3.8 -18.8,-8.1 -27.9,-12.8 -4,-2 -7.8,-4.5 -12,-6 -2.4,-0.9 -4.7,0.9 -6.8,1.8 -10.5,5.7 -21.2,11 -32.1,15.8 -4.8,2 -9.9,4.2 -15.2,3.2 -17.1,-2.7 -33.8,-7.6 -49.3,-15.1 -31.3,-14.5 -57.4,-37.5 -85.3,-57.4 4,7 9.6,13 14.8,19.2 7.5,8.4 15,16.8 22.5,25.2 7.1,7.9 15.2,14.7 22,22.8 -29.3,-12.6 -57.3,-28.7 -82.1,-48.7 -8,-6.1 -18,-8.5 -27.1,-12.2 -23.5,-8.7 -46.5,-18.8 -68.7,-30.5 -19.3,-10.8 -37.8,-23.1 -54.5,-37.6 14.6,-0.4 29.2,-1 43.8,-1.8 -7.3,-4 -15.3,-6.7 -22.2,-11.3 -28.7,-18.9 -52,-45 -71.8,-72.9l80.8,-25.1C159.7,604.7 144.2,584.3 129.4,564.3c13.9,0.5 27.9,-0.2 41.8,-0.2 9.3,-0.1 18.7,0.2 28,-0.3 -6.8,-9.1 -14.5,-17.5 -20.9,-26.9 12.5,-3.6 25.2,-6.5 37.4,-11 -14.1,-0.6 -28.3,1.1 -42.4,-0.9 -31.1,-4.6 -60.7,-18.2 -84.7,-38.4 -22.1,-18 -40.1,-40.6 -54.2,-65.3C13.5,383.2 3.7,339 6.9,295.7c2.9,-36.5 16.5,-73.2 42.7,-99.5 16.1,-17 36.7,-29.8 59.3,-36.4m-24.2,47.6c6.9,3 14.4,4.4 21.4,7.2 7.3,2.8 14.4,6.2 21.4,9.6 26.3,13.2 49.1,33.3 65,58 7.1,11.6 12.5,24.1 17.2,36.9 -12.1,-10.9 -23,-23.1 -36,-33 -12.3,-10.9 -26,-20.1 -40.3,-28.1 -17.1,19.3 -25.7,45 -26.7,70.5 -1.3,36.1 10.2,71.8 29.3,102.1 13.8,21.9 32.7,40.8 55.4,53.4 7.9,4.3 16.4,8.1 25.5,8.7 -4.6,-5.6 -10,-10.4 -14.6,-16 -11.4,-13.3 -19.9,-28.8 -25.9,-45.2 12.7,0.3 25,3.9 37,7.8 -4.8,-7.7 -9.7,-15.3 -13.7,-23.5 -10.5,-21.8 -15.6,-46.2 -15.5,-70.4 15,8.8 28.8,19.4 41.5,31.3 1.3,1.2 11.6,10.9 16.5,17 4.6,5.7 9.6,11.1 14,17 4.6,6.6 9,13.3 14,19.6 1.9,-45.7 -8.6,-92.1 -30.4,-132.3 -18,-32.7 -44.9,-61.1 -78.3,-78.2 -23.6,-11.9 -51,-17.5 -77.1,-12.4m778.2,11.1c-17.5,8 -32.7,20.2 -46.1,33.8 -29.2,29 -47.8,67.3 -56.5,107.3 -4.9,23.2 -8.1,47 -6.8,70.8 10.3,-14.6 20.6,-29.4 33,-42.3 4.8,-5.2 13.5,-14.2 23.4,-22 9.2,-7.7 19.4,-14.1 29.4,-20.7 0.5,20.1 -3,40.3 -10,59.2 -4.6,12.6 -11.8,24 -19,35.3 12,-4 24.3,-7.5 37,-8.8 -4.3,14.8 -12.2,28.3 -21.3,40.7 -5.8,8 -13.6,14.3 -19.9,21.8 16.6,-2.4 31.4,-11.1 44.7,-21 27.1,-21.2 46.3,-51.5 57.1,-84 8.8,-25.9 11.9,-54.1 6.4,-81 -3.9,-18 -11.4,-35.5 -23.4,-49.6 -13.4,6.9 -25.9,15.6 -37.6,25.1 -14.1,10.6 -26,23.7 -38.5,36.1 9.3,-28.2 29,-57.5 53.8,-77.5 16.6,-13.4 36,-23.1 56.3,-29.6 5.1,-1.5 10.3,-2.8 15.4,-4.7 -26,-4.9 -53.4,-0.3 -77.1,11.1M258.7,517.3c5.8,32.7 16.5,65 34.7,92.9 9.8,15.3 23.3,28.6 39.5,37.1 26.8,14.2 60,13.8 88.7,5.7 3.5,-1 7.3,-3 11,-1.6 8.4,2.7 17,5.3 25.9,5.9 -4.9,-5 -10.9,-8.6 -16.5,-12.7 -24.7,-17.9 -49.5,-35.8 -74.6,-53.2 -36.1,-24.9 -72.4,-49.5 -108.7,-74.1m497,6.3c-18.7,13.2 -37.9,25.8 -56.8,38.7 -37,25.5 -74.5,50.3 -110.5,77.2 -8,6.1 -16.5,11.5 -24.2,17.9 9.1,-0.2 17.7,-3.5 26.4,-6.2 3.9,-1.4 7.9,0.5 11.7,1.6 13.6,4.5 48.8,9.3 69.9,1.4 15.4,-4.9 31,-13.1 42.7,-24.2 12.7,-12.9 22.9,-27.8 30.5,-44.2 10.1,-21.8 16.4,-44.6 20,-68.3 -3.3,2 -6.5,4 -9.6,6.2M178,643.6c6.4,4.4 13.2,8.1 19.9,11.8 37.3,19.6 76.4,35.6 114.1,54.6 6.1,3.1 12.6,5.4 18.2,9.5 -21.9,-4.1 -43.6,-9.1 -65.8,-11 -25,-2.2 -51.1,-2.1 -74.8,7.3 4.3,1.3 8.6,2.4 12.9,3.3 43.9,8.8 87.9,17.7 131.6,27.7 -15.2,2 -30.6,3.1 -45.7,6.1 -18.2,3.8 -36.5,8.6 -52.8,17.7 49.4,-2.4 98.6,-7 147.9,-10.3 -13.5,-9.9 -27.6,-19.1 -40.4,-29.9 15.7,-2.4 31.3,-5 46.9,-7.9 -25.4,-18.2 -53.1,-33 -81.5,-45.8 -41.2,-18.1 -85.1,-32.1 -130.4,-33m536.8,32.6c-18.6,8.4 -37,17.3 -54.2,28.3 -9.4,6.1 -19.4,11.4 -28.4,18.2 16.3,2.5 32.6,5.6 49.1,7.5 -13.7,10.4 -28.1,19.9 -41.7,30.5 7.6,0.2 15.2,0.5 22.9,1.3 29,2.2 58.1,4.4 87.1,6.2 12.1,0.3 24.1,2 36.3,1.3 -15.7,-7.9 -32.9,-12.4 -50,-16.1 -15.2,-3.4 -30.8,-4.3 -46.1,-7 29.4,-7 59,-13 88.7,-18.6 18.8,-4.1 37.9,-6.9 56.5,-11.7 -4.4,-2.4 -9.2,-3.6 -14.1,-4.5 -22.1,-5 -45.1,-5.1 -67.5,-2.6 -20.2,2 -40,6.8 -59.9,10Line truncated
<linearGradient id="gradient1" gradientUnits="userSpaceOnUse" x1="-30.19" y1="546.44" x2="1054.21" y2="546.44">
<stop offset="0" stop-color="#960efc"/>
<stop offset="1" stop-color="#ff804a"/>
</linearGradient>
<!-- Shadow: the icon silhouette, blurred and shifted down; only the shadow is filtered,
so editors that rasterize filters (Inkscape) keep the icon itself sharp
(stdDeviation = softness, dy = distance, slope = darkness) -->
<filter id="shadow" x="-10%" y="-10%" width="120%" height="130%">
<feGaussianBlur in="SourceAlpha" stdDeviation="10"/>
<feOffset dy="18"/>
<feComponentTransfer><feFuncA type="linear" slope="0.27"/></feComponentTransfer>
<!-- only where the icon doesn't cover it -->
<feComposite in2="SourceAlpha" operator="out"/>
</filter>
<!-- Hero glow, baked from the site's former CSS drop-shadow(0 16px 48px rgba(128,50,200,.30))
on a 280px icon (1px = 1024/280 units: blur sigma 24px = 87.8, offset 16px = 58.5).
The canvas has a 320-unit margin so the glow isn't clipped; the "out" composite keeps it
only where the icon doesn't cover it -->
<filter id="glow" filterUnits="userSpaceOnUse" x="-320" y="-320" width="1664" height="1664" color-interpolation-filters="sRGB">
<feGaussianBlur in="SourceAlpha" stdDeviation="87.8"/>
<feOffset dy="58.5" result="blur"/>
<feFlood flood-color="#8032c8" flood-opacity="0.3"/>
<feComposite in2="blur" operator="in"/>
<feComposite in2="SourceAlpha" operator="out"/>
</filter>
</defs>
<use xlink:href="#icon_glow_source" filter="url(#glow)"/>
<g id="icon_glow_source">
<use xlink:href="#icon" filter="url(#shadow)"/>
<!-- scale 0.9 (the drawable uses 0.9442) leaves a 24 unit margin on each side,
so the blurred shadow isn't cut by the canvas edges -->
<g id="icon" transform="translate(512 530.44) scale(0.9 0.9) translate(-512.01 -546.44)">
<!-- Border: the head stroked with the adaptive background gradient;
half of strokeWidth shows outside the head -->
<use xlink:href="#ic_launcher_path_head" fill="url(#gradient1)" stroke="url(#gradient1)" stroke-width="73" stroke-linejoin="round"/>
<!-- nose -->
<path d="m449.7,748.1l125.5,0l-14.3,71.7l-95.6,0z" fill="#000000"/>
<!-- eye, left -->
<path d="m230.1,535 l54.9,-57.1 227.2,188.5 -197,2.7z" fill="#000000"/>
<!-- eye, right -->
<path d="m794.4,535.2 l-54.9,-57.1 -227.2,188.5 197,2.7z" fill="#000000"/>
<!-- eye highlight, right -->
<path d="m727.2,558.1c-11.1,6.4 -22.1,13 -33.1,19.5 -3.3,1.9 -7.2,4.4 -6.5,8.9 0.4,13.4 -2.5,26.9 -9.6,38.3 -9.9,17.8 -41,31.4 -61,33.8l32,4.6 12.9,-6.5c8.6,-3.8 17.1,-7.9 24.6,-13.7 8.3,-6.4 15.4,-14.4 21.1,-23.1 11.8,-18.5 16.9,-40.2 19.5,-61.7z" fill="#c89ab1"/>
<!-- eye highlight, left -->
<path d="m296.5,558.3c11.1,6.4 22.1,13 33.1,19.5 3.3,1.9 7.2,4.4 6.5,8.9 -0.4,13.4 2.5,26.9 9.6,38.3 9.9,17.8 41,31.4 61,33.8L374.7,663.3 361.7,656.8c-8.6,-3.8 -17.1,-7.9 -24.6,-13.7 -8.3,-6.4 -15.4,-14.4 -21.1,-23.1 -11.8,-18.5 -16.9,-40.2 -19.5,-61.7z" fill="#c89ab1"/>
<!-- inner ear, left -->
<path d="m277,434.4c-11.5,-40.3 -48,-91 -71,-119.9l0.7,77.2 73.8,62.1z" fill="#000000"/>
<!-- inner ear, right -->
<path d="m747.6,434c11.5,-40.3 48,-91 71,-119.9l-0.7,77.2 -73.8,62.1z" fill="#000000"/>
<!-- ear, left -->
<path d="M102.2,233.8 L186,285.6 237.2,504.7 87.5,451.1Z" fill="#5a1e64"/>
<!-- ear, right -->
<path d="M921.3,234.8 L837.5,286.6 786.3,505.7 936,452.1Z" fill="#5a1e64"/>
<!-- ear highlight, right -->
<path d="M816.5,314.4 L853.4,280.5c4.7,13.4 8.6,29.7 10.2,43.9 3.4,26.9 0.5,54.4 -6.8,80.5 -2.4,9 -6.8,17.8 -9.9,26.6l-50.7,18.6 -1,-67.8c5,-20.1 13.1,-48.7 21.3,-67.9z" fill="#b24090"/>
<!-- ear highlight, left -->
<path d="m160.9,370.2c-2,-30.5 1.2,-60.3 13.4,-86.4l34.2,32.7c9.6,21 16.8,43.7 22.6,64.8l-2.2,67.6 -52.1,-16.8C167.6,412.9 162.9,391.3 160.9,370.2Z" fill="#b24090"/>
<!-- dark whisker, left -->
<path d="m175.7,712.1 l141.7,-24.8 83.2,80.9 -169.4,5.5 13,-31.5z" fill="#5a1e64"/>
<!-- dark whisker, right -->
<path d="m853.4,709.7 l-148.2,-17.5 -80.5,77.5 169.4,5.5 -13,-31.5z" fill="#5a1e64"/>
<!-- whisker, left -->
<path d="m147.6,649.3 l81.2,-31.9 184,110.2c-15.6,2.9 -54,0.4 -69.7,2.8l-12.8,-10.9z" fill="#c89ab1"/>
<!-- whisker, right -->
<path d="m875.9,649.3 l-81.2,-31.9 -184,110.2c15.6,2.9 54.8,0.3 70.5,2.7l12,-10.8z" fill="#c89ab1"/>
<!-- head -->
<use xlink:href="#ic_launcher_path_head" fill="#fcecdc"/>
</g>
</g>
</svg>

After

Width:  |  Height:  |  Size: 11 KiB

+15 -3
View File
@@ -27,8 +27,8 @@ title: Home
<div class="hero-visual"> <div class="hero-visual">
<div class="hero-icon-wrapper" id="heroIcon"> <div class="hero-icon-wrapper" id="heroIcon">
<button class="hero-icon-flip" aria-label="Flip the icon"> <button class="hero-icon-flip" aria-label="Flip the icon">
<img class="hero-icon-face" src="{{ site.icon_url }}" alt="Murine Launcher icon"> <img class="hero-icon-face" src="{{ '/assets/img/icon_adaptive_baked.svg' | relative_url }}" alt="Murine Launcher icon">
<img class="hero-icon-face hero-icon-back" src="{{ site.icon_freeform_url }}" alt="Murine Launcher icon, freeform" aria-hidden="true"> <img class="hero-icon-face hero-icon-back" src="{{ '/assets/img/icon_freeform_baked.svg' | relative_url }}" alt="Murine Launcher icon, freeform" aria-hidden="true">
</button> </button>
</div> </div>
</div> </div>
@@ -37,7 +37,19 @@ title: Home
<script> <script>
const heroIcon = document.getElementById('heroIcon'); const heroIcon = document.getElementById('heroIcon');
heroIcon.addEventListener('click', () => heroIcon.classList.toggle('flipped')); const heroFlip = heroIcon.querySelector('.hero-icon-flip');
const reduceMotion = window.matchMedia('(prefers-reduced-motion: reduce)');
heroIcon.addEventListener('click', () => {
if (reduceMotion.matches) { heroIcon.classList.toggle('flipped'); return; }
if (!heroIcon.classList.contains('flipping')) {
heroIcon.classList.add('flipping'); // 3D on, still showing the current face
void heroFlip.offsetWidth; // commit that before the transition starts
heroIcon.classList.add('animating');
}
heroIcon.classList.toggle('flipped'); // mid-flip, this reverses from the current angle
});
// Back to flat 2D once the flip ends (same pixels, no jump)
heroFlip.addEventListener('transitionend', () => heroIcon.classList.remove('flipping', 'animating'));
</script> </script>
<!-- Features --> <!-- Features -->