woocommerce/plugins/woocommerce-blocks/assets/js/icons
Seghir Nadir 5299d7267b Update ⚛️ ‎‎‏‏‎ Product Title (https://github.com/woocommerce/woocommerce-blocks/pull/2860)
* rename heading-toolbar to heading-switcher

* update icon

* add controls to title block

* fix typos in css rules

* feature gate changes in Product Title

* fix jsdoc types

* fix onChange param

* fix missing textDomain

* fix modifier prefix

* move styling to util

* hardcode line height

* move settings near color
2020-07-21 14:27:41 +01:00
..
icon Prevent wp.components loading on frontend (https://github.com/woocommerce/woocommerce-blocks/pull/1918) 2020-03-10 11:20:40 +00:00
library Update ⚛️ ‎‎‏‏‎ Product Title (https://github.com/woocommerce/woocommerce-blocks/pull/2860) 2020-07-21 14:27:41 +01:00
stories Add storybook story for icon library (https://github.com/woocommerce/woocommerce-blocks/pull/2787) 2020-06-26 10:22:41 -04:00
README.md add new icons and remove old ones (https://github.com/woocommerce/woocommerce-blocks/pull/1644) 2020-01-31 19:20:33 +01:00
index.js Update ⚛️ ‎‎‏‏‎ Product Title (https://github.com/woocommerce/woocommerce-blocks/pull/2860) 2020-07-21 14:27:41 +01:00

README.md

Icons

WooCommerce Blocks Icons Library.

Usage

import { Icon, bill, woo } from '@woocommerce/icons';

<Icon srcElement={ bill } />

<Icon srcElement={ bill } size={ 16 } />

<Icon srcElement={ woo } width={ 20 } height={ Math.floor( 20 * 1.67 ) } />

Props

Name Type Default Description
size integer 24 Size of icon in pixels.

Adding Icons

  1. Add the icon file to ./library folder.
  2. Make sure to use SVG primitive from @wordpress/components and not a native svg. SVG offers more accessibility features.
  3. Remove width and height since they're handled by Icon.
  4. Remove any hardcoded colors on the svg. If necessary, use CurrentColor.
  5. Export the Icon in ./library/index.js.