react-github-corner
Description
Add a Github banner to your project page. A React version of:
Getting Started
Install the module with: npm install --save react-github-corner
Usage
import React, { Component } from 'react';
import GithubCorner from 'react-github-corner';
export default class MyApp extends Component {
render() {
return (
<div>
<header>Wow</header>
<div>Cool</div>
<footer>Neat</footer>
<GithubCorner href="https://github.com/username/repo" />
</div>
);
}
}Documentation
Here are the props you can pass to the GithubCorner instance:
| Property Name | Type | Default Value | Description |
|---|---|---|---|
| href | String | '/' | The link to your project page |
| size | Number or String | 80 | The width and height of the banner |
| direction | String | 'right' | Whether the banner shows up on the right or left |
| octoColor | String | '#fff' | The CSS color of the Octocat |
| bannerColor | String | '#151513' | The CSS color of the banner |
| ariaLabel | String | 'Open GitHub project' | The aria-label for a11y support |
| className | String | undefined | Additional class names to be merged with the github-corner default |
| svgStyle | Object | undefined | Custom styles to apply to the main svg element |
Any additional props will be added to the <a /> tag that is rendered.
For instance, you can do:
<GithubCorner style="display:none" />
and the style attribute will be rendered (which will hide the element).
Links
License
Copyright (c) 2015 skratchdot
Licensed under the MIT license.