IconViewer: Fix Filling Icons

This commit is contained in:
thororen1234 2025-12-20 21:55:26 -05:00
parent 7eb5602623
commit 819d43e059
No known key found for this signature in database
4 changed files with 10 additions and 6 deletions

View file

@ -46,11 +46,13 @@ function searchMatch(search: string, name: string, Icon: Icon, searchByFunction:
}
function IconItem({ iconName, Icon }: { iconName: string; Icon: Icon; }) {
const fill = iconName === "CircleShield" ? "var(--background-base-low)" : "var(--interactive-icon-default)";
console.log(iconName);
return (
<div className="vc-icon-box">
<Clickable onClick={() => openIconModal(iconName, Icon, IconsFinds[iconName])}>
<div className="vc-icon-container">
<Icon className="vc-icon-icon" size="lg" width={32} height={32} color="var(--interactive-icon-default)" />
<Icon className="vc-icon-icon" size="lg" width={32} height={32} color="var(--interactive-icon-default)" fill={fill} />
</div>
</Clickable>
<Heading className="vc-icon-title" tag="h3">{iconName}</Heading>

View file

@ -229,6 +229,7 @@ function IconModal({ iconName, Icon, findPattern, onClose, transitionState }: {
const colorData = cssColors[color];
const colorKeys = useMemo(() => getCssColorKeys(), []);
const fill = iconName === "CircleShield" ? "var(--background-base-low)" : colorData?.css;
const findCode = findPattern
? `const ${iconName}Icon = findComponentByCode(${JSON.stringify(findPattern)})`
: null;
@ -270,13 +271,13 @@ function IconModal({ iconName, Icon, findPattern, onClose, transitionState }: {
onContextMenu={openColorMenu}
onWheel={onWheel}
>
<Icon className="vc-ic-icon-large" color={colorData?.css} />
<Icon className="vc-ic-icon-large" color={colorData?.css} fill={fill} />
</div>
<Flex flexDirection="column" className="vc-ic-icon-info">
<Flex className="vc-ic-icon-sizes">
{iconSizes.map(size => (
<TooltipContainer text={size} key={size}>
<Icon size={size} color={colorData?.css} />
<Icon size={size} color={colorData?.css} fill={fill} />
</TooltipContainer>
))}
</Flex>

View file

@ -132,7 +132,8 @@ export const IconsFinds: Record<string, string> = {
Key: "23-.24ZM10 16a2",
InBox: "3H5ZM4 5.5C4",
BookmarkOutline: "0-1-1ZM7 2a3",
Food: "7.58V8a1 1"
Food: "7.58V8a1 1",
CircleShield: "8 10.9999V17.9999C8"
};
// 13l4.91-8.05a1.8

View file

@ -48,7 +48,7 @@
margin-bottom: 16px;
}
.vc-icon-tab-search-bar-grid>div:first-child {
.vc-icon-tab-search-bar-grid > div:first-child {
flex: 1;
}
@ -137,4 +137,4 @@
.vc-ic-modal-title {
user-select: none;
padding-right: 32px;
}
}