feat(icons): Add `ethernet-port` and `wired-connection` icons

ericfennis commented 2 weeks ago

Closes #1816

What is the purpose of this pull request?

[x] New Icon
[ ] Bug fix
[ ] New Feature
[ ] Documentation update
[ ] Other:

Icon use case

To indicate a network connection in a router, network switch, or similar interfaces. Can also be used as a system icon, next to the existing system icons (wifi, Bluetooth, battery and audio etc)

Alternative icon designs

See #1816

Icon Design Checklist

Concept

[x] I have provided valid use cases for each icon.
[x] I have not added any a brand or logo icon.
[x] I have not used any hate symbols.
[x] I have not included any religious or political imagery.

Author, credits & license

[x] The icons are solely my own creation.
[x] The icons were originally created in # by @
[x] I've based them on the following Lucide icons:
[x] I've based them on the following design:

Naming

x ] I've read and followed the naming conventions
[x] I've named icons by what they are rather than their use case.
[x] I've provided meta JSON files in icons/[iconName].json.

Design

[x] I've read and followed the icon design guidelines
[x] I've made sure that the icons look sharp on low DPI displays.
[x] I've made sure that the icons look consistent with the icon set in size, optical volume and density.
[x] I've made sure that the icons are visually centered.
[x] I've correctly optimized all icons to three points of precision.

Before Submitting

[x] I've read the Contribution Guidelines.
[x] I've checked if there was an existing PR that solves the same issue.

github-actions[bot] commented 2 weeks ago

Added or changed icons

Preview cohesion

Preview stroke widths

DPI Preview (24px)

Icon X-rays

Icons as code

Works for: lucide-react, lucide-react-native, lucide-preact, lucide-vue-next

const EthernetPortIcon = createLucideIcon('EthernetPort', [
  ["path",{"d":"M20.2 4H3.8C2.8 4 2 4.7 2 5.6v9.8c0 .9.8 1.6 1.8 1.6H6l3 3h6l3-3h2.2c1 0 1.8-.7 1.8-1.6V5.6c0-.9-.8-1.6-1.8-1.6"}],
  ["path",{"d":"M6 8v1"}],
  ["path",{"d":"M10 8v1"}],
  ["path",{"d":"M14 8v1"}],
  ["path",{"d":"M18 8v1"}]
])

const WiredConnectionIcon = createLucideIcon('WiredConnection', [
  ["path",{"d":"m18 8 4 4-4 4"}],
  ["path",{"d":"m6 8-4 4 4 4"}],
  ["path",{"d":"M8 12h.01"}],
  ["path",{"d":"M12 12h.01"}],
  ["path",{"d":"M16 12h.01"}]
])

jguddas commented 2 weeks ago

What about arcifying the eathernet-port icon?

Open lucide studio

karsa-mistmere commented 2 weeks ago

wired-connection feels an oddly specific name for an abstract symbol that to my best knowledge is not a standard representation of said concept, so maybe arrow-double(-headed)-horizontal-dashed or something similar would be better?

ericfennis commented 2 weeks ago

@karsa-mistmere Kinda true. It's more common than you might think.

Wiki: https://en.wikipedia.org/wiki/Ethernet So not sure if we should choose a generic name since it is possibly recognized as a symbol for ethernet. But I get you, I still have some doubts about the name. 🤔

jguddas commented 2 weeks ago

@karsa-mistmere Kinda true. It's more common than you might think.

Wiki: https://en.wikipedia.org/wiki/Ethernet So not sure if we should choose a generic name since it is possibly recognized as a symbol for ethernet. But I get you, I still have some doubts about the name. 🤔

Still feel like it is describing the use case rather than what is actually depicting.

lucide-icons / lucide