Skip to content

[UX Icons] lucide:chevron-right (and left) render incorrectly #2629

Open
@eokic

Description

@eokic

symfony/ux-icons v2.23.0


<twig:ux:icon name="lucide:chevron-right" />

produces:
Image

instead of:
Image

The only difference between these two screenshots is whether I've manually added fill="none" to the svg path. There is no external CSS interfering. The issue is present on left and right chevrons but not on up & down.


On the demo site, the SVG code does in fact include fill="none":

<svg xmlns="http://www.w3.org/2000/svg" width="1em" height="1em" viewBox="0 0 24 24">
  <path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m9 18l6-6l-6-6"/>
</svg>

What I actually get:

<svg width="24" height="24" viewBox="0 0 24 24" fill="currentColor" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="lucide lucide-chevron-right" aria-hidden="true">
  <path d="m9 18 6-6-6-6"></path>
</svg>

For comparison, using "lucide:chevron-top" (which has no visual issues) produces code that's more similar to the demo site:

<svg viewBox="0 0 24 24" fill="currentColor" aria-hidden="true">
  <path fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="m18 15l-6-6l-6 6"></path>
</svg>

Sidenote: while not an issue for me, the width and height attributes are also somehow only present on the left & right chevrons.

Metadata

Metadata

Assignees

No one assigned

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions