feathericons / feathericons/feather

Globe icon / Missing segment when overriding fill color

Open
#995 0 comments 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
26k
Forks
1.3k
PR merge metrics
No merged PRs in 30d

Description

## Prerequisites

Version: react-feather-2.0.8
Running from: Import using webpack
Operating system: Mac OSX
Bits: 64 bits

## Step to reproduce

- Import `` react component
- override fill with css style in stylesheet, e.g. `fill: #CDD`
- Add to a React component/view
- Run the react app

### Expected Behaviour:

- all segments in globe icon are displayed above the selected fill color

### Actual behavior:

- the central segment in globe icon disappears

## Any message or error

No console output

## Resources

- unstyled icon ![Screenshot 2020-10-30 at 10 57 12](https://user-images.githubusercontent.com/6105462/97693375-60bd2f00-1aa1-11eb-8a9a-042dde4012d0.png)
- fill-styled icon ![Screenshot 2020-10-30 at 10 57 19](https://user-images.githubusercontent.com/6105462/97693388-63b81f80-1aa1-11eb-9eab-2b5b4c552aea.png)

Contributor guide

Open the contributing guide

Research direction

The issue identifies the imported React component as the entry point; start by locating its SVG definition and reproducing the CSS fill override in a webpack app. Done means every globe segment remains visible when the component receives the stylesheet fill, with the existing unstyled appearance preserved.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react
Domain
frontend
Issue type
Bug
Difficulty
2/5
Estimated time
1-3 hours
Activity status
Stale
Clarity
Clearly specified
Newbie friendliness
50/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.