@ausbom/icon
Advanced tools
Comparing version 0.16.2 to 0.16.3
{ | ||
"name": "@ausbom/icon", | ||
"version": "0.16.2", | ||
"version": "0.16.3", | ||
"description": "The icon component provides a refined set of functional icons to use in services and products. The icons are broken into three categories to help users navigate the service, identify important information and understand the forecast story.", | ||
@@ -40,3 +40,3 @@ "keywords": [], | ||
"dependencies": { | ||
"@ausbom/styles": "^0.9.2" | ||
"@ausbom/styles": "^0.10.0" | ||
}, | ||
@@ -47,3 +47,3 @@ "peerDependencies": { | ||
}, | ||
"gitHead": "0bf333c15b131c52eb8c63b1ee2f89ffe01c7ff4" | ||
"gitHead": "d87405ddb170ded80d71979b6f9e5d628ba07dc5" | ||
} |
@@ -15,7 +15,8 @@ # @ausbom/icon | ||
``` | ||
### Available system icons | ||
There a number of system icons available as React components. You can find them in `@ausbom/icon/lib/icons/system`. | ||
There are a number of system icons available as React components. You'll find them in `@ausbom/icon/lib/icons/system`. | ||
Each of these icon components can take a primaryColor and secondaryColor. While it's recommended to use them with the `SystemIcon` component, it is possible to just render them by themselves | ||
Each of these icon components can take a `primaryColor` and `secondaryColor`. While it's recommended to use them with the `SystemIcon` component, it is possible to render them by themselves. | ||
@@ -40,9 +41,7 @@ Example: | ||
Each icon provided by the design system is intended to be used at a certain size, ensure that you are using an icon that is designed to be displayed at the size you need. | ||
Each icon provided by the design system is intended to be used at a certain size. Make sure you're using an icon that is designed to be displayed at the size you need. | ||
### Bring your own icons | ||
If your project needs an icon that isn't provided in the design system, you can still use `SystemIcon` because the `icon` prop can take any React component that renders SVG | ||
If your project needs an icon that isn't provided in the design system, you can still use `SystemIcon`. The `icon` property can take any React component that renders SVG. | ||
In order for your icon to | ||
Example: | ||
@@ -71,7 +70,7 @@ | ||
### Colorising provided system icons with CSS | ||
### Colourising system icons | ||
Classes (`.__primary` and `.__secondary`) are applied to elements inside the provided system icon SVGs so that dual-colored icons can be colorised by css if needed. This can be useful for things like hover states. | ||
Elements inside system icon SVG's use the classes `.__primary` and `.__secondary`. This allows dual-coloured icons to be colourised by CSS if needed. This can be useful for things like hover states. | ||
For dual-colored icon components that you provide yourself, you'll need to add these classes to the correct elements. | ||
Add these classes to the correct elements for any dual-coloured icon components that you provide. | ||
@@ -78,0 +77,0 @@ ```scss |
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
533538
85
+ Added@ausbom/styles@0.10.0(transitive)
- Removed@ausbom/styles@0.9.2(transitive)
Updated@ausbom/styles@^0.10.0