Origami Frontend Components & Services

SassDoc: o-icons

oIconsGetIcon(...)

Get an SVG icon with PNG fallback for ie6-8

parameter type default description
icon-name This should be a reference to an icon included in o-icons eg arrow-down
color This should be a hex colour value. Used to color the icon. We suggest using an o-colors an o-colors function.
container-width This is the width to set the icon containing element to. Defaults to 20px. This value is also used to request a PNG fallback of the right size from the image service.
container-height This is the height to set the icon containing element to. Defaults to null, and will use the value of $container-width
apply-base-styles (optional) true If true, will output style rules for the container. If false will only output the background-image property
apply-width-height (optional) true If true, will output the styles for the container width and height.
iconset-version (optional) 1 At present only 1 version of the icon set is available.
high-contrast-fallback (optional) true To output Microsoft High Contrast fallback for accessibility reasons or not.

Links

oIconsBaseStyles

Base styles for all icons

Links

o-icons-is-silent

Silent mode

Links

o-icons-use-local-assets

Whether SVG icon mixin should use the image service or serve local assets

Links

o-icons-service-base-url

Option to change the base of the image service url

Links

o-icons-service-version

Option to change the version of the image service url

Links

Switch component view

GitHub Repository

Install o-icons

If using the Build Service, add o-icons@^5.7.1 to your link tag.

If running a Manual Build, run bower install --save "o-icons@^5.7.1".

Help & Support

o-icons is maintained directly by the Origami team. If you have any questions about o-icons or Origami in general, we are happy to help. 😊

Slack: #ft-origami
Email: origami.support@ft.com

Feedback / Issues

To report a bug or request features please create an issue on Github. For support or general feedback please get in touch 😊

Slack: #ft-origami
Email: origami.support@ft.com