122 lines
14 KiB
JavaScript
122 lines
14 KiB
JavaScript
/**
|
|
* ZioInfo 라인 아이콘 라이브러리 — 모두 직접 그린 SVG
|
|
* stroke 기반, strokeLinecap/Join=round, fill=none
|
|
*/
|
|
|
|
const D = { size: 22, sw: 1.8 };
|
|
|
|
const Ico = ({ size = D.size, color = 'currentColor', sw = D.sw, children, ...p }) => (
|
|
<svg width={size} height={size} viewBox="0 0 24 24" fill="none"
|
|
stroke={color} strokeWidth={sw} strokeLinecap="round" strokeLinejoin="round" {...p}>
|
|
{children}
|
|
</svg>
|
|
);
|
|
|
|
/* ── 회사/조직 ── */
|
|
export const IconBuilding = p => <Ico {...p}><path d="M3 21h18M3 7l9-4 9 4M4 7v14M20 7v14M9 21v-4h6v4M9 11h1M14 11h1M9 15h1M14 15h1"/></Ico>;
|
|
export const IconUser = p => <Ico {...p}><circle cx="12" cy="8" r="4"/><path d="M4 20c0-4 3.6-7 8-7s8 3 8 7"/></Ico>;
|
|
export const IconUsers = p => <Ico {...p}><circle cx="9" cy="8" r="3"/><path d="M2 20c0-3.3 2.9-6 7-6s7 2.7 7 6"/><circle cx="18" cy="9" r="2.5" opacity=".6"/><path d="M22 20c0-2.5-2-4.5-4-4.5" opacity=".6"/></Ico>;
|
|
export const IconCEO = p => <Ico {...p}><circle cx="12" cy="7" r="4"/><path d="M4 21v-1a8 8 0 0116 0v1"/><path d="M9 7l1.5 2L12 7l1.5 2L15 7" strokeWidth="1.2"/></Ico>;
|
|
export const IconTeam = p => <Ico {...p}><circle cx="12" cy="6" r="3"/><circle cx="5" cy="17" r="2.5"/><circle cx="19" cy="17" r="2.5"/><path d="M12 9v4M8.5 16L12 13l3.5 3"/></Ico>;
|
|
|
|
/* ── 연락처 ── */
|
|
export const IconPhone = p => <Ico {...p}><path d="M22 16.9v3a2 2 0 01-2.2 2 19.8 19.8 0 01-8.6-3.1 19.5 19.5 0 01-6-6A19.8 19.8 0 012.1 4.2 2 2 0 014.1 2h3a2 2 0 012 1.7 12.8 12.8 0 00.7 2.8 2 2 0 01-.5 2.1L8.1 9.9a16 16 0 006 6l1.3-1.3a2 2 0 012.1-.4 12.8 12.8 0 002.8.7 2 2 0 011.7 2z"/></Ico>;
|
|
export const IconEmail = p => <Ico {...p}><rect x="2" y="4" width="20" height="16" rx="2"/><path d="M2 7l10 7 10-7"/></Ico>;
|
|
export const IconMapPin = p => <Ico {...p}><path d="M12 2C8.7 2 6 4.7 6 8c0 5 6 14 6 14s6-9 6-14c0-3.3-2.7-6-6-6z"/><circle cx="12" cy="8" r="2.5"/></Ico>;
|
|
export const IconClock = p => <Ico {...p}><circle cx="12" cy="12" r="10"/><path d="M12 6v6l4 2"/></Ico>;
|
|
export const IconFax = p => <Ico {...p}><rect x="2" y="7" width="14" height="14" rx="1.5"/><path d="M16 7V5a2 2 0 00-2-2H8a2 2 0 00-2 2v2"/><rect x="16" y="9" width="6" height="8" rx="1"/><path d="M6 12h6M6 15h4"/></Ico>;
|
|
|
|
/* ── 핵심 가치 ── */
|
|
export const IconTarget = p => <Ico {...p}><circle cx="12" cy="12" r="10"/><circle cx="12" cy="12" r="6"/><circle cx="12" cy="12" r="2"/><path d="M12 2v4M12 18v4M2 12h4M18 12h4"/></Ico>;
|
|
export const IconRocket = p => <Ico {...p}><path d="M4.5 16.5c-1.5 1.5-1.5 3.5 0 3.5s3.5-1.5 3.5-3.5c0 0-1.5-.5-3.5 0z"/><path d="M12 2C8 2 5 8 5 13l2 2 4-2 4 2 2-2c0-5-3-11-5-11z"/><path d="M5 13c-1 2-1.5 4-1.5 4"/><path d="M19 13c1 2 1.5 4 1.5 4"/><circle cx="12" cy="10" r="2"/></Ico>;
|
|
export const IconHandshake= p => <Ico {...p}><path d="M9 11l-3 3 5 5 8-8-5-5-3 3"/><path d="M6 14l-4 4M14 6l4-4M9 11L7 9"/></Ico>;
|
|
export const IconLeaf = p => <Ico {...p}><path d="M2 22c4-4 6-8 6-12A8 8 0 0122 2c0 4-2 8-4 10s-6 4-10 4H2z"/><path d="M2 22l8-8"/></Ico>;
|
|
export const IconTrophy = p => <Ico {...p}><path d="M8 21h8M12 17v4M17 3H7l1 8a4 4 0 008 0l1-8z"/><path d="M7 3H4a2 2 0 000 4h3M17 3h3a2 2 0 010 4h-3"/></Ico>;
|
|
export const IconStar = p => <Ico {...p}><polygon points="12 2 15.1 8.3 22 9.3 17 14.1 18.2 21 12 17.8 5.8 21 7 14.1 2 9.3 8.9 8.3 12 2"/></Ico>;
|
|
export const IconAward = p => <Ico {...p}><circle cx="12" cy="9" r="7"/><path d="M8.2 14.4L6 22l6-3 6 3-2.2-7.6"/></Ico>;
|
|
|
|
/* ── AI / 기술 ── */
|
|
export const IconAI = p => <Ico {...p}><rect x="3" y="6" width="18" height="12" rx="2"/><circle cx="8" cy="12" r="1.5"/><circle cx="12" cy="12" r="1.5"/><circle cx="16" cy="12" r="1.5"/><path d="M8 6V4M12 6V4M16 6V4M8 18v2M12 18v2M16 18v2"/></Ico>;
|
|
export const IconBrain = p => <Ico {...p}><path d="M12 5a3 3 0 10-3 3H12"/><path d="M12 5a3 3 0 113 3H12"/><path d="M6 8a4 4 0 000 8h.5"/><path d="M18 8a4 4 0 010 8h-.5"/><path d="M8 16a4 4 0 008 0v-4H8v4z"/><path d="M9 12v-1M15 12v-1"/></Ico>;
|
|
export const IconNetwork = p => <Ico {...p}><circle cx="12" cy="5" r="2"/><circle cx="5" cy="19" r="2"/><circle cx="19" cy="19" r="2"/><path d="M12 7v5M12 12l-5.5 5M12 12l5.5 5"/></Ico>;
|
|
export const IconCode = p => <Ico {...p}><polyline points="16 18 22 12 16 6"/><polyline points="8 6 2 12 8 18"/><line x1="19" y1="12" x2="5" y2="12" strokeOpacity=".4"/></Ico>;
|
|
export const IconZap = p => <Ico {...p}><polygon points="13 2 3 14 12 14 11 22 21 10 12 10 13 2"/></Ico>;
|
|
export const IconCpu = p => <Ico {...p}><rect x="4" y="4" width="16" height="16" rx="2"/><rect x="9" y="9" width="6" height="6"/><path d="M9 1v3M15 1v3M9 20v3M15 20v3M1 9h3M1 15h3M20 9h3M20 15h3"/></Ico>;
|
|
|
|
/* ── 인프라/서버 ── */
|
|
export const IconServer = p => <Ico {...p}><rect x="2" y="2" width="20" height="8" rx="2"/><rect x="2" y="14" width="20" height="8" rx="2"/><circle cx="6" cy="6" r="1" fill="currentColor"/><circle cx="6" cy="18" r="1" fill="currentColor"/><path d="M10 6h8M10 18h8"/></Ico>;
|
|
export const IconCloud = p => <Ico {...p}><path d="M18 10h-1.3A7 7 0 106 19h12a4 4 0 000-8v-1z"/></Ico>;
|
|
export const IconDatabase = p => <Ico {...p}><ellipse cx="12" cy="5" rx="9" ry="3"/><path d="M21 12c0 1.7-4 3-9 3s-9-1.3-9-3"/><path d="M3 5v14c0 1.7 4 3 9 3s9-1.3 9-3V5"/></Ico>;
|
|
export const IconHardDrive= p => <Ico {...p}><rect x="2" y="6" width="20" height="12" rx="2"/><path d="M17 13h.01"/><path d="M6 13h8"/></Ico>;
|
|
export const IconGlobe = p => <Ico {...p}><circle cx="12" cy="12" r="10"/><path d="M2 12h20M12 2a15 15 0 010 20M12 2a15 15 0 000 20"/></Ico>;
|
|
|
|
/* ── 보안 ── */
|
|
export const IconShield = p => <Ico {...p}><path d="M12 2l9 4v5c0 5.2-3.9 10-9 11C6.9 21 3 16.2 3 11V6l9-4z"/></Ico>;
|
|
export const IconLock = p => <Ico {...p}><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0110 0v4"/><circle cx="12" cy="16" r="1" fill="currentColor"/></Ico>;
|
|
export const IconKey = p => <Ico {...p}><circle cx="8" cy="15" r="4"/><path d="M12 11l8-8M17 6l3 3"/></Ico>;
|
|
export const IconEye = p => <Ico {...p}><path d="M1 12S5 4 12 4s11 8 11 8-4 8-11 8S1 12 1 12z"/><circle cx="12" cy="12" r="3"/></Ico>;
|
|
|
|
/* ── 문서/콘텐츠 ── */
|
|
export const IconFileText = p => <Ico {...p}><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><polyline points="14 2 14 8 20 8"/><path d="M8 13h8M8 17h5"/></Ico>;
|
|
export const IconClipboard= p => <Ico {...p}><rect x="4" y="3" width="16" height="18" rx="2"/><path d="M9 3a3 3 0 006 0"/><path d="M8 10h8M8 14h6M8 18h4"/></Ico>;
|
|
export const IconBook = p => <Ico {...p}><path d="M4 19.5A2.5 2.5 0 016.5 17H20V3H6.5A2.5 2.5 0 004 5.5v14z"/><path d="M6.5 17v4"/><path d="M8 7h8M8 11h6"/></Ico>;
|
|
export const IconNewspaper= p => <Ico {...p}><rect x="3" y="3" width="18" height="18" rx="1.5"/><path d="M7 7h10M7 11h7M7 15h5"/><rect x="14" y="11" width="3" height="4" rx=".5"/></Ico>;
|
|
export const IconDownload = p => <Ico {...p}><path d="M21 15v4a2 2 0 01-2 2H5a2 2 0 01-2-2v-4"/><polyline points="7 10 12 15 17 10"/><line x1="12" y1="15" x2="12" y2="3"/></Ico>;
|
|
|
|
/* ── 분석/차트 ── */
|
|
export const IconBarChart = p => <Ico {...p}><rect x="18" y="3" width="4" height="18"/><rect x="10" y="8" width="4" height="13"/><rect x="2" y="13" width="4" height="8"/></Ico>;
|
|
export const IconTrendUp = p => <Ico {...p}><polyline points="23 6 13.5 15.5 8.5 10.5 1 18"/><polyline points="17 6 23 6 23 12"/></Ico>;
|
|
export const IconPieChart = p => <Ico {...p}><path d="M21.2 15A9 9 0 118.8 2.8"/><path d="M12 2v10l7 4"/></Ico>;
|
|
export const IconActivity = p => <Ico {...p}><polyline points="22 12 18 12 15 21 9 3 6 12 2 12"/></Ico>;
|
|
|
|
/* ── 비즈니스 ── */
|
|
export const IconBriefcase= p => <Ico {...p}><rect x="2" y="7" width="20" height="14" rx="2"/><path d="M16 7V5a2 2 0 00-2-2h-4a2 2 0 00-2 2v2"/><line x1="12" y1="12" x2="12" y2="12" strokeWidth="3"/><path d="M2 13h20"/></Ico>;
|
|
export const IconMoney = p => <Ico {...p}><rect x="1" y="4" width="22" height="16" rx="2"/><circle cx="12" cy="12" r="3"/><path d="M1 9h4M19 9h4M1 15h4M19 15h4"/></Ico>;
|
|
export const IconShake = p => <Ico {...p}><path d="M7 12l2-2a2 2 0 012.8 0l.2.2L14 8l1.4 1.4L13 12M15 8l2 2"/><path d="M3 15l4 4 2-2-4-4L3 15zM21 9l-4-4-2 2 4 4 2-2z"/><path d="M9 12l3 3"/></Ico>;
|
|
export const IconGift = p => <Ico {...p}><rect x="3" y="8" width="18" height="13" rx="1.5"/><path d="M3 12h18M12 8v13"/><path d="M8 8C8 5.8 9.8 4 12 4s4 1.8 4 4"/><path d="M8 8c0-2 1-4 4-4s4 2 4 4"/></Ico>;
|
|
|
|
/* ── UI/인터페이스 ── */
|
|
export const IconSearch = p => <Ico {...p}><circle cx="11" cy="11" r="8"/><path d="M21 21l-4.4-4.4"/></Ico>;
|
|
export const IconMenu = p => <Ico {...p}><line x1="3" y1="6" x2="21" y2="6"/><line x1="3" y1="12" x2="21" y2="12"/><line x1="3" y1="18" x2="21" y2="18"/></Ico>;
|
|
export const IconX = p => <Ico {...p}><line x1="18" y1="6" x2="6" y2="18"/><line x1="6" y1="6" x2="18" y2="18"/></Ico>;
|
|
export const IconCheck = p => <Ico {...p}><polyline points="20 6 9 17 4 12"/></Ico>;
|
|
export const IconCheckCircle = p => <Ico {...p}><path d="M22 11.1V12a10 10 0 11-5.9-9.1"/><polyline points="22 4 12 14.1 9 11.1"/></Ico>;
|
|
export const IconArrowRight = p => <Ico {...p}><line x1="5" y1="12" x2="19" y2="12"/><polyline points="12 5 19 12 12 19"/></Ico>;
|
|
export const IconArrowDown = p => <Ico {...p}><line x1="12" y1="5" x2="12" y2="19"/><polyline points="19 12 12 19 5 12"/></Ico>;
|
|
export const IconChevronDown = p => <Ico {...p}><polyline points="6 9 12 15 18 9"/></Ico>;
|
|
export const IconExternal = p => <Ico {...p}><path d="M18 13v6a2 2 0 01-2 2H5a2 2 0 01-2-2V8a2 2 0 012-2h6"/><polyline points="15 3 21 3 21 9"/><line x1="10" y1="14" x2="21" y2="3"/></Ico>;
|
|
export const IconPlus = p => <Ico {...p}><line x1="12" y1="5" x2="12" y2="19"/><line x1="5" y1="12" x2="19" y2="12"/></Ico>;
|
|
export const IconSettings = p => <Ico {...p}><circle cx="12" cy="12" r="3"/><path d="M20 12a8 8 0 01-.5 2.8l1.8 1a10 10 0 010-7.6l-1.8 1A8 8 0 0120 12zM4 12a8 8 0 01.5-2.8l-1.8-1a10 10 0 000 7.6l1.8-1A8 8 0 014 12z"/><path d="M12 4a8 8 0 012.8.5l1-1.8a10 10 0 00-7.6 0l1 1.8A8 8 0 0112 4zM12 20a8 8 0 01-2.8-.5l-1 1.8a10 10 0 007.6 0l-1-1.8A8 8 0 0112 20z"/></Ico>;
|
|
|
|
/* ── 채용/복리후생 ── */
|
|
export const IconHome = p => <Ico {...p}><path d="M3 9.5L12 3l9 6.5V20a1 1 0 01-1 1H4a1 1 0 01-1-1V9.5z"/><path d="M9 21V12h6v9"/></Ico>;
|
|
export const IconGradCap = p => <Ico {...p}><path d="M22 10L12 5 2 10l10 5 10-5v5"/><path d="M6 12v5c0 2 2.7 3 6 3s6-1 6-3v-5"/></Ico>;
|
|
export const IconHospital = p => <Ico {...p}><rect x="3" y="3" width="18" height="18" rx="2"/><path d="M12 8v8M8 12h8"/></Ico>;
|
|
export const IconUtensils = p => <Ico {...p}><path d="M3 11l4-9M7 11V22"/><path d="M3 11h8M11 11V2"/><path d="M17 3v19M14 7c0-2.2 1.3-4 3-4s3 1.8 3 4v4h-6V7z"/></Ico>;
|
|
export const IconParty = p => <Ico {...p}><path d="M5.8 11.3L2 22l10.7-3.8"/><path d="M4 3h.01M22 8h.01M15 2h.01M22 20h.01M2 14h.01"/><path d="M11 3c3 2.5 5 6 5 10M16 7c2 1.5 3.5 3.5 3.5 7"/><path d="M10 14c-2 3.5-3 7-3 8"/></Ico>;
|
|
export const IconCelebrate= p => <Ico {...p}><path d="M3 21l7-7M17.5 3.5a3 3 0 014.2 4.2L7.5 21.7a4 4 0 01-2.5 1.3l-2.8.2.2-2.8a4 4 0 011.3-2.5L17.5 3.5z"/></Ico>;
|
|
export const IconLaptop = p => <Ico {...p}><rect x="2" y="4" width="20" height="14" rx="2"/><path d="M2 20h20"/><path d="M9 16h6"/></Ico>;
|
|
|
|
/* ── 솔루션/제품 ── */
|
|
export const IconPuzzle = p => <Ico {...p}><path d="M20.5 11V9a2 2 0 00-2-2h-2.5V5a2 2 0 00-2-2H5a2 2 0 00-2 2v9a2 2 0 002 2h2v2.5a2 2 0 002 2H19a2 2 0 002-2v-4.5a2 2 0 00-2-2h-1V11h2.5z"/></Ico>;
|
|
export const IconLayers = p => <Ico {...p}><polygon points="12 2 2 7 12 12 22 7 12 2"/><polyline points="2 17 12 22 22 17"/><polyline points="2 12 12 17 22 12"/></Ico>;
|
|
export const IconGovt = p => <Ico {...p}><path d="M3 21h18M3 10h18M5 10V21M19 10V21M12 3L3 10h18L12 3z"/><rect x="8" y="13" width="3" height="5"/><rect x="13" y="13" width="3" height="5"/></Ico>;
|
|
export const IconMobile = p => <Ico {...p}><rect x="5" y="2" width="14" height="20" rx="2"/><line x1="12" y1="18" x2="12.01" y2="18" strokeWidth="3"/></Ico>;
|
|
export const IconPalette = p => <Ico {...p}><circle cx="12" cy="12" r="10"/><circle cx="8" cy="10" r="1.5" fill="currentColor" stroke="none"/><circle cx="13" cy="8" r="1.5" fill="currentColor" stroke="none"/><circle cx="16" cy="12" r="1.5" fill="currentColor" stroke="none"/><path d="M12 22c0-2.5-2-4-4-4h-2a2 2 0 010-4"/></Ico>;
|
|
export const IconWrench = p => <Ico {...p}><path d="M14.7 6.3a1 1 0 000 1.4l1.6 1.6a1 1 0 001.4 0l3.77-3.77a6 6 0 01-7.94 7.94L5.37 18.6a2.12 2.12 0 01-3-3L7.5 12a6 6 0 017.2-5.7z"/></Ico>;
|
|
export const IconLink = p => <Ico {...p}><path d="M10 13a5 5 0 007.5.5l3-3a5 5 0 00-7-7l-1.5 1.5"/><path d="M14 11a5 5 0 00-7.5-.5l-3 3a5 5 0 007 7l1.5-1.5"/></Ico>;
|
|
export const IconShuffle = p => <Ico {...p}><polyline points="16 3 21 3 21 8"/><line x1="4" y1="20" x2="21" y2="3"/><polyline points="21 16 21 21 16 21"/><line x1="15" y1="15" x2="21" y2="21"/><line x1="4" y1="4" x2="9" y2="9"/></Ico>;
|
|
|
|
/* ── 채팅/메시지 ── */
|
|
export const IconMessage = p => <Ico {...p}><path d="M21 15a2 2 0 01-2 2H7l-4 4V5a2 2 0 012-2h14a2 2 0 012 2z"/></Ico>;
|
|
export const IconMic = p => <Ico {...p}><rect x="9" y="2" width="6" height="11" rx="3"/><path d="M19 10a7 7 0 01-14 0"/><line x1="12" y1="17" x2="12" y2="22"/><line x1="8" y1="22" x2="16" y2="22"/></Ico>;
|
|
export const IconSend = p => <Ico {...p}><line x1="22" y1="2" x2="11" y2="13"/><polygon points="22 2 15 22 11 13 2 9 22 2"/></Ico>;
|
|
|
|
/* ── 기타 ── */
|
|
export const IconBulb = p => <Ico {...p}><path d="M9 18h6M10 22h4M12 2a7 7 0 017 7c0 2.4-1.1 4.5-2.8 6H7.8A7 7 0 0112 2z"/></Ico>;
|
|
export const IconFlag = p => <Ico {...p}><path d="M4 15s1-1 4-1 5 2 8 2 4-1 4-1V3s-1 1-4 1-5-2-8-2-4 1-4 1z"/><line x1="4" y1="22" x2="4" y2="15"/></Ico>;
|
|
export const IconBolt = p => <Ico {...p}><path d="M13 2L3 14h9l-1 8 10-12h-9l1-8z"/></Ico>;
|
|
export const IconFire = p => <Ico {...p}><path d="M12 22C6.5 22 2 17.5 2 12c0-2 .8-4 2.3-5.6C5.6 5 6 4.3 6 3c2 0 3 1.5 4 3 .7-1.2 2-2.5 4-3 0 1.5.7 2.5 1.7 3.5C17.2 8 18 9.8 18 12c0 5.5-4.5 10-6 10z"/></Ico>;
|
|
export const IconGithub = p => <Ico {...p}><path d="M9 19c-5 1.5-5-2.5-7-3m14 6v-3.9a3.4 3.4 0 00-.9-2.3c3.1-.3 6.4-1.5 6.4-7A5.4 5.4 0 0020 4.8 4.8 4.8 0 0019.9 1S18.7.7 16 2.5a13.4 13.4 0 00-7 0C6.3.7 5.1 1 5.1 1A4.8 4.8 0 005 4.8a5.4 5.4 0 00-1.5 3.8c0 5.4 3.3 6.6 6.4 7a3.4 3.4 0 00-.9 2.3V22"/></Ico>;
|
|
export const IconCopyright= p => <Ico {...p}><circle cx="12" cy="12" r="10"/><path d="M14.8 9.5A4.5 4.5 0 1014.8 14.5"/></Ico>;
|