Skip to content

Commit

Permalink
update readme
Browse files Browse the repository at this point in the history
  • Loading branch information
kremalicious committed Dec 21, 2018
1 parent 1eb66eb commit a8baea9
Showing 1 changed file with 19 additions and 4 deletions.
23 changes: 19 additions & 4 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,12 +8,23 @@

All assets in this repo can also be viewed and downloaded from [oceanprotocol.com/art](https://oceanprotocol.com/art). You'll find a living styleguide there too.

- [Repository Contents](#repository-contents)
- [Typography](#typography)
- [Usage](#usage)
- [Use as npm package](#use-as-npm-package)
- [Use as a submodule](#use-as-a-submodule)
- [Usage in JavaScript/React](#usage-in-javascriptreact)
- [License](#license)

---

## Repository Contents

- [Logo](logo/)
- [Banner](banner/)
- [Jellyfish](jellyfish/)
- [Mantaray](mantaray/)
- [Manta ray](mantaray/)
- [Squid](squid/)
- [GitHub](github/)

## Typography
Expand All @@ -26,7 +37,11 @@ If you only need them for use on the web, you can grab them from inside the priv

## Usage

It's encouraged to use this repo as a dependency within your projects to keep the assets in sync. The whole repo is published as a npm module so just run for installation:
It's encouraged to use this repo as a dependency within your projects to keep the assets in sync.

### Use as npm package

The whole repo is published as a npm module so just run for installation:

```bash
npm i @oceanprotocol/art
Expand Down Expand Up @@ -59,15 +74,15 @@ git submodule foreach git pull origin master
Import the required assets into your project, which will return the file source path:

```js
import Logo from './lib/art/logo/logo.svg'
import Logo from '@oceanprotocol/art/logo/logo.svg'

<img src={Logo} />
```

But you usually want SVG assets to be inlined for full control over styling with CSS. To achieve that, you can incorporate [svgr](https://github.com/smooth-code/svgr) into your build process to import SVG assets as actual React components:

```js
import Logo from './lib/art/logo/logo.svg'
import Logo from '@oceanprotocol/art/logo/logo.svg'

<Logo className="logo" />
```
Expand Down

0 comments on commit a8baea9

Please sign in to comment.