pablinux/help_desk
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(ui): crear e integrar suite de iconos SVG, PNG e ICO para Help Desk y favicon

Browse Source
This commit is contained in:
pablinux
2026-10-20 11:34:07 -05:00
parent 928aad4aff
commit 5b54fe0982
13 changed files with 256 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/img/apple-touch-icon.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 16 KiB

public/img/favicon-16x16.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 739 B

public/img/favicon-32x32.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

public/img/favicon.ico
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.3 KiB

public/img/favicon.svg
+120
View File
@@ -0,0 +1,120 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="100%" height="100%">
<defs>
<!-- Background Gradient: Deep Navy to Electric Cyan -->
<linearGradient id="bgGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#0b1329" />
<stop offset="45%" stop-color="#1e3a8a" />
<stop offset="100%" stop-color="#0284c7" />
</linearGradient>
<!-- Headset Gradient -->
<linearGradient id="headsetGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#ffffff" />
<stop offset="60%" stop-color="#f1f5f9" />
<stop offset="100%" stop-color="#cbd5e1" />
</linearGradient>
<!-- Cyan Glow Gradient -->
<linearGradient id="cyanGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#38bdf8" />
<stop offset="100%" stop-color="#0284c7" />
</linearGradient>
<!-- Emerald Online Status -->
<linearGradient id="statusGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#4ade80" />
<stop offset="100%" stop-color="#10b981" />
</linearGradient>
<!-- Universal Drop Shadow Filter (SVG 1.1) -->
<filter id="shadow" x="-20%" y="-20%" width="140%" height="140%">
<feGaussianBlur in="SourceAlpha" stdDeviation="10" result="blur" />
<feOffset dx="0" dy="12" result="offset" />
<feComponentTransfer in="offset" result="shadowAlpha">
<feFuncA type="linear" slope="0.4" />
</feComponentTransfer>
<feMerge>
<feMergeNode in="shadowAlpha" />
<feMergeNode in="SourceGraphic" />
</feMerge>
</filter>
<!-- High-tech Glow Filter -->
<filter id="glow" x="-30%" y="-30%" width="160%" height="160%">
<feGaussianBlur stdDeviation="5" result="blur" />
<feMerge>
<feMergeNode in="blur" />
<feMergeNode in="SourceGraphic" />
</feMerge>
</filter>
</defs>
<!-- Modern App Squircle Background -->
<rect width="512" height="512" rx="112" fill="url(#bgGrad)" />
<rect x="2" y="2" width="508" height="508" rx="110" fill="none" stroke="rgba(255,255,255,0.18)" stroke-width="3" />
<!-- Ambient Light Reflection on Top Left -->
<path d="M 2 112 C 2 51, 51 2, 112 2 L 400 2 C 280 2, 2 280, 2 400 Z" fill="rgba(255,255,255,0.04)" />
<g filter="url(#shadow)">
<!-- Central Shield / Support Badge -->
<path d="M 256 160
L 340 195
C 340 280, 295 335, 256 360
C 217 335, 172 280, 172 195
Z"
fill="rgba(15, 23, 42, 0.45)"
stroke="url(#cyanGrad)"
stroke-width="5" />
<!-- Support Cross / Ticket Symbol in Badge -->
<circle cx="256" cy="245" r="32" fill="url(#cyanGrad)" opacity="0.25" />
<path d="M 256 222 L 256 268 M 233 245 L 279 245"
stroke="#38bdf8"
stroke-width="8"
stroke-linecap="round" />
<!-- Headset Band (Ergonomic Arch) -->
<path d="M 122 280
C 122 135, 390 135, 390 280"
fill="none"
stroke="url(#headsetGrad)"
stroke-width="26"
stroke-linecap="round" />
<!-- Headset Inner Cushion Highlight -->
<path d="M 160 215
C 195 160, 317 160, 352 215"
fill="none"
stroke="#38bdf8"
stroke-width="6"
stroke-linecap="round"
opacity="0.8" />
<!-- Left Earpad -->
<g transform="translate(100, 240)">
<rect width="40" height="82" rx="20" fill="url(#headsetGrad)" />
<rect x="14" y="10" width="12" height="62" rx="6" fill="#0284c7" />
</g>
<!-- Right Earpad -->
<g transform="translate(372, 240)">
<rect width="40" height="82" rx="20" fill="url(#headsetGrad)" />
<rect x="14" y="10" width="12" height="62" rx="6" fill="#0284c7" />
</g>
<!-- Microphone Boom with Smooth Organic Arc -->
<path d="M 390 300
C 390 385, 305 410, 268 410"
fill="none"
stroke="url(#headsetGrad)"
stroke-width="14"
stroke-linecap="round" />
<!-- Microphone Capsule -->
<rect x="228" y="398" width="42" height="24" rx="12" fill="url(#headsetGrad)" />
<!-- Online Status LED (Green Pulse) -->
<circle cx="239" cy="410" r="5.5" fill="url(#statusGrad)" filter="url(#glow)" />
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.3 KiB

public/img/icon-192.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

public/img/icon-512.png
BIN
View File
Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 68 KiB

public/img/logo.svg
+120
View File
@@ -0,0 +1,120 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512" width="100%" height="100%">
<defs>
<!-- Background Gradient: Deep Navy to Electric Cyan -->
<linearGradient id="bgGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#0b1329" />
<stop offset="45%" stop-color="#1e3a8a" />
<stop offset="100%" stop-color="#0284c7" />
</linearGradient>
<!-- Headset Gradient -->
<linearGradient id="headsetGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#ffffff" />
<stop offset="60%" stop-color="#f1f5f9" />
<stop offset="100%" stop-color="#cbd5e1" />
</linearGradient>
<!-- Cyan Glow Gradient -->
<linearGradient id="cyanGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#38bdf8" />
<stop offset="100%" stop-color="#0284c7" />
</linearGradient>
<!-- Emerald Online Status -->
<linearGradient id="statusGrad" x1="0%" y1="0%" x2="100%" y2="100%">
<stop offset="0%" stop-color="#4ade80" />
<stop offset="100%" stop-color="#10b981" />
</linearGradient>
<!-- Universal Drop Shadow Filter (SVG 1.1) -->
<filter id="shadow" x="-20%" y="-20%" width="140%" height="140%">
<feGaussianBlur in="SourceAlpha" stdDeviation="10" result="blur" />
<feOffset dx="0" dy="12" result="offset" />
<feComponentTransfer in="offset" result="shadowAlpha">
<feFuncA type="linear" slope="0.4" />
</feComponentTransfer>
<feMerge>
<feMergeNode in="shadowAlpha" />
<feMergeNode in="SourceGraphic" />
</feMerge>
</filter>
<!-- High-tech Glow Filter -->
<filter id="glow" x="-30%" y="-30%" width="160%" height="160%">
<feGaussianBlur stdDeviation="5" result="blur" />
<feMerge>
<feMergeNode in="blur" />
<feMergeNode in="SourceGraphic" />
</feMerge>
</filter>
</defs>
<!-- Modern App Squircle Background -->
<rect width="512" height="512" rx="112" fill="url(#bgGrad)" />
<rect x="2" y="2" width="508" height="508" rx="110" fill="none" stroke="rgba(255,255,255,0.18)" stroke-width="3" />
<!-- Ambient Light Reflection on Top Left -->
<path d="M 2 112 C 2 51, 51 2, 112 2 L 400 2 C 280 2, 2 280, 2 400 Z" fill="rgba(255,255,255,0.04)" />
<g filter="url(#shadow)">
<!-- Central Shield / Support Badge -->
<path d="M 256 160
L 340 195
C 340 280, 295 335, 256 360
C 217 335, 172 280, 172 195
Z"
fill="rgba(15, 23, 42, 0.45)"
stroke="url(#cyanGrad)"
stroke-width="5" />
<!-- Support Cross / Ticket Symbol in Badge -->
<circle cx="256" cy="245" r="32" fill="url(#cyanGrad)" opacity="0.25" />
<path d="M 256 222 L 256 268 M 233 245 L 279 245"
stroke="#38bdf8"
stroke-width="8"
stroke-linecap="round" />
<!-- Headset Band (Ergonomic Arch) -->
<path d="M 122 280
C 122 135, 390 135, 390 280"
fill="none"
stroke="url(#headsetGrad)"
stroke-width="26"
stroke-linecap="round" />
<!-- Headset Inner Cushion Highlight -->
<path d="M 160 215
C 195 160, 317 160, 352 215"
fill="none"
stroke="#38bdf8"
stroke-width="6"
stroke-linecap="round"
opacity="0.8" />
<!-- Left Earpad -->
<g transform="translate(100, 240)">
<rect width="40" height="82" rx="20" fill="url(#headsetGrad)" />
<rect x="14" y="10" width="12" height="62" rx="6" fill="#0284c7" />
</g>
<!-- Right Earpad -->
<g transform="translate(372, 240)">
<rect width="40" height="82" rx="20" fill="url(#headsetGrad)" />
<rect x="14" y="10" width="12" height="62" rx="6" fill="#0284c7" />
</g>
<!-- Microphone Boom with Smooth Organic Arc -->
<path d="M 390 300
C 390 385, 305 410, 268 410"
fill="none"
stroke="url(#headsetGrad)"
stroke-width="14"
stroke-linecap="round" />
<!-- Microphone Capsule -->
<rect x="228" y="398" width="42" height="24" rx="12" fill="url(#headsetGrad)" />
<!-- Online Status LED (Green Pulse) -->
<circle cx="239" cy="410" r="5.5" fill="url(#statusGrad)" filter="url(#glow)" />
</g>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 4.3 KiB