206 行
9.7 KiB
JavaScript
206 行
9.7 KiB
JavaScript
/**
|
|
* 电竞暗夜流光矢量 SVG 图标库 (Cyber-Esports SVG Icons)
|
|
* 严格遵照 UI/UX 规范：杜绝系统 Emoji，全矢量渲染，支持无损缩放与跨端显示
|
|
*/
|
|
|
|
function svgToUri(svg) {
|
|
return 'data:image/svg+xml;utf8,' + encodeURIComponent(svg.trim());
|
|
}
|
|
|
|
export const ICONS = {
|
|
// 基础与通用
|
|
search: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#94A3B8" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<circle cx="11" cy="11" r="8"></circle>
|
|
<line x1="21" y1="21" x2="16.65" y2="16.65"></line>
|
|
</svg>
|
|
`),
|
|
|
|
// 游戏分类
|
|
gameAll: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#818CF8" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<rect x="2" y="6" width="20" height="12" rx="4"></rect>
|
|
<line x1="6" y1="12" x2="10" y2="12"></line>
|
|
<line x1="8" y1="10" x2="8" y2="14"></line>
|
|
<circle cx="15" cy="11" r="1" fill="#818CF8"></circle>
|
|
<circle cx="18" cy="13" r="1" fill="#818CF8"></circle>
|
|
</svg>
|
|
`),
|
|
|
|
gameCrown: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#F59E0B" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M2 4l3 12h14l3-12-6 7-4-7-4 7-6-7z"></path>
|
|
<circle cx="12" cy="19" r="1" fill="#F59E0B"></circle>
|
|
</svg>
|
|
`),
|
|
|
|
gameCrosshair: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#10B981" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<circle cx="12" cy="12" r="9"></circle>
|
|
<line x1="12" y1="3" x2="12" y2="7"></line>
|
|
<line x1="12" y1="17" x2="12" y2="21"></line>
|
|
<line x1="3" y1="12" x2="7" y2="12"></line>
|
|
<line x1="17" y1="12" x2="21" y2="12"></line>
|
|
</svg>
|
|
`),
|
|
|
|
gameSwords: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#60A5FA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<polyline points="14.5 17.5 3 6 3 3 6 3 17.5 14.5"></polyline>
|
|
<line x1="13" y1="19" x2="19" y2="13"></line>
|
|
<line x1="16" y1="16" x2="20" y2="20"></line>
|
|
<line x1="19" y1="21" x2="21" y2="19"></line>
|
|
<polyline points="14.5 6.5 18 3 21 3 21 6 17.5 9.5"></polyline>
|
|
<line x1="5" y1="14" x2="10" y2="19"></line>
|
|
</svg>
|
|
`),
|
|
|
|
gameTarget: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#EC4899" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<circle cx="12" cy="12" r="10"></circle>
|
|
<circle cx="12" cy="12" r="6"></circle>
|
|
<circle cx="12" cy="12" r="2" fill="#EC4899"></circle>
|
|
</svg>
|
|
`),
|
|
|
|
gameBlade: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#A78BFA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M4 20l4-4m0 0l12-12a2 2 0 0 0-2.83-2.83L5.17 13.17M8 16l-4 4"></path>
|
|
</svg>
|
|
`),
|
|
|
|
gameTrophy: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#F59E0B" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M6 9H4a2 2 0 0 1-2-2V5h4m12 4h2a2 2 0 0 0 2-2V5h-4M6 5h12v4a6 6 0 0 1-12 0V5zm3 10v4h6v-4m-7 4h8"></path>
|
|
</svg>
|
|
`),
|
|
|
|
// 金刚区与功能
|
|
teamUp: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#8B5CF6" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path>
|
|
<circle cx="9" cy="7" r="4"></circle>
|
|
<path d="M23 21v-2a4 4 0 0 0-3-3.87"></path>
|
|
<path d="M16 3.13a4 4 0 0 1 0 7.75"></path>
|
|
</svg>
|
|
`),
|
|
|
|
ticket: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#10B981" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M3 7v2a3 3 0 0 0 0 6v2a2 2 0 0 0 2 2h14a2 2 0 0 0 2-2v-2a3 3 0 0 0 0-6V7a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2z"></path>
|
|
<line x1="9" y1="6" x2="9" y2="18" stroke-dasharray="2 2"></line>
|
|
</svg>
|
|
`),
|
|
|
|
orderList: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#6366F1" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path>
|
|
<polyline points="14 2 14 8 20 8"></polyline>
|
|
<line x1="16" y1="13" x2="8" y2="13"></line>
|
|
<line x1="16" y1="17" x2="8" y2="17"></line>
|
|
<polyline points="10 9 9 9 8 9"></polyline>
|
|
</svg>
|
|
`),
|
|
|
|
expertBadge: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#F59E0B" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<polygon points="12 2 15.09 8.26 22 9.27 17 14.14 18.18 21.02 12 17.77 5.82 21.02 7 14.14 2 9.27 8.91 8.26 12 2"></polygon>
|
|
</svg>
|
|
`),
|
|
|
|
// 动作与状态
|
|
bolt: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#F59E0B" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"></polygon>
|
|
</svg>
|
|
`),
|
|
|
|
clock: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#94A3B8" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<circle cx="12" cy="12" r="10"></circle>
|
|
<polyline points="12 6 12 12 16 14"></polyline>
|
|
</svg>
|
|
`),
|
|
|
|
mic: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#818CF8" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M12 1a3 3 0 0 0-3 3v8a3 3 0 0 0 6 0V4a3 3 0 0 0-3-3z"></path>
|
|
<path d="M19 10v2a7 7 0 0 1-14 0v-2"></path>
|
|
<line x1="12" y1="19" x2="12" y2="23"></line>
|
|
<line x1="8" y1="23" x2="16" y2="23"></line>
|
|
</svg>
|
|
`),
|
|
|
|
chat: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#60A5FA" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M21 15a2 2 0 0 1-2 2H7l-4 4V5a2 2 0 0 1 2-2h14a2 2 0 0 1 2 2z"></path>
|
|
</svg>
|
|
`),
|
|
|
|
headphones: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#818CF8" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M3 18v-6a9 9 0 0 1 18 0v6"></path>
|
|
<path d="M21 19a2 2 0 0 1-2 2h-1a2 2 0 0 1-2-2v-3a2 2 0 0 1 2-2h3zM3 19a2 2 0 0 0 2 2h1a2 2 0 0 0 2-2v-3a2 2 0 0 0-2-2H3z"></path>
|
|
</svg>
|
|
`),
|
|
|
|
shield: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#10B981" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z"></path>
|
|
</svg>
|
|
`),
|
|
|
|
bell: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#F59E0B" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"></path>
|
|
<path d="M13.73 21a2 2 0 0 1-3.46 0"></path>
|
|
</svg>
|
|
`),
|
|
|
|
settings: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#94A3B8" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<circle cx="12" cy="12" r="3"></circle>
|
|
<path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"></path>
|
|
</svg>
|
|
`),
|
|
|
|
share: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#8B5CF6" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<circle cx="18" cy="5" r="3"></circle>
|
|
<circle cx="6" cy="12" r="3"></circle>
|
|
<circle cx="18" cy="19" r="3"></circle>
|
|
<line x1="8.59" y1="13.51" x2="15.42" y2="17.49"></line>
|
|
<line x1="15.41" y1="6.51" x2="8.59" y2="10.49"></line>
|
|
</svg>
|
|
`),
|
|
|
|
play: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#818CF8" stroke="none">
|
|
<polygon points="6 4 20 12 6 20 6 4"></polygon>
|
|
</svg>
|
|
`),
|
|
|
|
pause: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="#818CF8" stroke="none">
|
|
<rect x="6" y="4" width="4" height="16"></rect>
|
|
<rect x="14" y="4" width="4" height="16"></rect>
|
|
</svg>
|
|
`),
|
|
|
|
deleteKey: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#CBD5E1" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M21 4H8l-7 8 7 8h13a2 2 0 0 0 2-2V6a2 2 0 0 0-2-2z"></path>
|
|
<line x1="18" y1="9" x2="12" y2="15"></line>
|
|
<line x1="12" y1="9" x2="18" y2="15"></line>
|
|
</svg>
|
|
`),
|
|
|
|
clearKey: svgToUri(`
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="#CBD5E1" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<circle cx="12" cy="12" r="10"></circle>
|
|
<line x1="15" y1="9" x2="9" y2="15"></line>
|
|
<line x1="9" y1="9" x2="15" y2="15"></line>
|
|
</svg>
|
|
`)
|
|
};
|