Skip to content

Commit

Permalink
Merge branch 'master' into js-edits
Browse files Browse the repository at this point in the history
  • Loading branch information
colebemis authored Sep 28, 2020
2 parents b747825 + 74b2495 commit 4ec4065
Showing 1 changed file with 4 additions and 4 deletions.
8 changes: 4 additions & 4 deletions docs/content/packages/styled-system.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ source: 'https://github.com/primer/octicons/tree/master/lib/octicons_styled'

[![npm version](https://img.shields.io/npm/v/@primer/styled-octicons.svg)](https://www.npmjs.org/package/@primer/styled-octicons)

The `@primer/styled-octicons` package wraps icon components from [`@primer/octicons-react`](/packages/react) with [system props](https://primer.style/components/system-props), making them easier to style in projects that use [styled system](https://styled-system.com/)—like [Primer Components](https://primer.style/components).
The `@primer/styled-octicons` package wraps icon components from [`@primer/octicons-react`](/packages/react) with [system props](https://primer.style/components/system-props), making them easier to style in projects that use [styled system](https://styled-system.com/)—like [Primer React](https://primer.style/components).

## Install

Expand All @@ -28,7 +28,7 @@ export () => (

## System props

All icon components in `@primer/styled-octicons` get `color` and `space` system props as well as the `sx` prop. Read our [System Props](https://primer.style/components/system-props) documentation for a full list of available props.
All icon components in `@primer/styled-octicons` get `color` and `space` system props as well as the `sx` prop. Read the Primer React [System Props](https://primer.style/components/system-props) documentation for a full list of available props.


## Props
Expand All @@ -38,7 +38,7 @@ In addition to system props, icon components in `@primer/styled-octicons` accept
| Name | Type | Default | Description |
| :- | :- | :-: | :- |
| aria-label | String | | Sets the [`aria-label`](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_aria-label_attribute) attribute of the `<svg>`. If no `aria-label` is defined, `aria-hidden` will be set to `true`. |
| className | String | | Sets the `class` attribute on the `<svg>` |
| className | String | | Sets the `class` attribute on the `<svg>`. |
| size | Number \| `"small"` \| `"medium"` \| `"large"` | `16` | The height of the icon. Width will be scaled proportionally. |
| verticalAlign | `"middle"` \| `"text-bottom"` \| `"text-top"` \| `"top"` \| `"unset"` | `"text-bottom"` | The vertical alignment of the `<svg>` |
| verticalAlign | `"middle"` \| `"text-bottom"` \| `"text-top"` \| `"top"` \| `"unset"` | `"text-bottom"` | The vertical alignment of the `<svg>`. |

0 comments on commit 4ec4065

Please sign in to comment.