microsoft / fluentui-system-icons

Fluent System Icons are a collection of familiar, friendly and modern icons from Microsoft.
https://aka.ms/fluentui-system-icons
MIT License
5.65k stars 498 forks source link

Font version of MoreHorizontalFilled/MoreHorizontalRegular has incorrect icons #601

Open fpintos opened 12 months ago

fpintos commented 12 months ago

In OWA we're using the font version of @fluentui/react-icons. We're seeing incorrect versions of MoreHorizontalFilled/MoreHorizontalRegular: image image

We have code similar to the sample from Components / TabList - Default ⋅ Storybook (fluentui.dev), the one about “with overflow”.

import { bundleIcon, MoreHorizontalFilled, MoreHorizontalRegular } from '@fluentui/react-icons';

const MoreHorizontal = bundleIcon(MoreHorizontalFilled, MoreHorizontalRegular);
const MoreHorizontalElement = <MoreHorizontal />;

...

                    <Button
                        ref={ref}
                        role="tab"
                        appearance="transparent"
                        icon={MoreHorizontalElement}
                        aria-label={tooltip}
                        id="OverflowToggleButton"
                    />

And the "..." menu shows up as above. The version in the sample site looks correct, but that ones has the icon rendering as SVG element.

ColeStansbury commented 5 months ago

any update on this? I'm seeing the same icon regression in many different places. It looks like some of the shapes in the icon have a border or ring around them just as shown above.