83 lines
2.2 KiB
TypeScript
83 lines
2.2 KiB
TypeScript
import React from 'react';
|
|
import type { Service } from '../data/site';
|
|
|
|
type ServiceIconProps = {
|
|
name: Service['icon'];
|
|
className?: string;
|
|
};
|
|
|
|
const stroke = {
|
|
fill: 'none',
|
|
stroke: 'currentColor',
|
|
strokeWidth: 1.2,
|
|
strokeLinecap: 'round' as const,
|
|
strokeLinejoin: 'round' as const
|
|
};
|
|
|
|
export function ServiceIcon({ name, className = 'h-12 w-12' }: ServiceIconProps) {
|
|
return (
|
|
<svg viewBox="0 0 48 48" className={className} aria-hidden="true" role="presentation">
|
|
{name === 'draft' &&
|
|
<g {...stroke}>
|
|
<path d="M6 40h36" />
|
|
<path d="M10 40V14l14-8 14 8v26" />
|
|
<path d="M10 22h28M24 6v34" />
|
|
<circle cx="24" cy="22" r="3" />
|
|
</g>
|
|
}
|
|
{name === 'tower' &&
|
|
<g {...stroke}>
|
|
<path d="M8 42h32" />
|
|
<path d="M15 42V10l9-5 9 5v32" />
|
|
<path d="M19 15h10M19 21h10M19 27h10M19 33h10" />
|
|
</g>
|
|
}
|
|
{name === 'mall' &&
|
|
<g {...stroke}>
|
|
<path d="M6 42h36" />
|
|
<path d="M9 42V20h30v22" />
|
|
<path d="M9 20l6-10h18l6 10" />
|
|
<path d="M19 42V30h10v12" />
|
|
</g>
|
|
}
|
|
{name === 'villa' &&
|
|
<g {...stroke}>
|
|
<path d="M5 42h38" />
|
|
<path d="M9 42V22l15-10 15 10v20" />
|
|
<path d="M18 42V30h12v12" />
|
|
<path d="M9 26h30" />
|
|
</g>
|
|
}
|
|
{name === 'renew' &&
|
|
<g {...stroke}>
|
|
<path d="M10 42h28V20L24 10 10 20z" />
|
|
<path d="M31 6a9 9 0 1 0 6 15" />
|
|
<path d="M38 5v7h-7" />
|
|
</g>
|
|
}
|
|
{name === 'manage' &&
|
|
<g {...stroke}>
|
|
<rect x="8" y="8" width="32" height="32" rx="2" />
|
|
<path d="M8 17h32" />
|
|
<path d="M14 25h8M14 32h14M27 24l4 4 7-8" />
|
|
</g>
|
|
}
|
|
{name === 'invest' &&
|
|
<g {...stroke}>
|
|
<path d="M7 40h34" />
|
|
<path d="M12 40V26M22 40V18M32 40V30" />
|
|
<path d="M9 16l10-6 8 5 12-9" />
|
|
<path d="M39 6h-7M39 6v7" />
|
|
</g>
|
|
}
|
|
{name === 'landscape' &&
|
|
<g {...stroke}>
|
|
<path d="M5 40h38" />
|
|
<path d="M14 40V24M14 24c-4 0-7-3-7-6s3-5 7-5 7 2 7 5-3 6-7 6z" />
|
|
<path d="M31 40V22l7-7 4 5v20" />
|
|
<path d="M24 40c2-4 5-6 9-6" />
|
|
</g>
|
|
}
|
|
</svg>);
|
|
|
|
} |