https://github.com/skratchdot/react-github-corner

Add a Github banner to your project page. A React version of: https://github.com/tholman/github-corners / See also: http://projects.skratchdot.com/react-github-corner/
https://github.com/skratchdot/react-github-corner

Last synced: 21 days ago
JSON representation

Add a Github banner to your project page. A React version of: https://github.com/tholman/github-corners / See also: http://projects.skratchdot.com/react-github-corner/

• Host: GitHub
• URL: https://github.com/skratchdot/react-github-corner
• Owner: skratchdot
• License: mit
• Created: 2015-12-09T22:45:02.000Z (about 9 years ago)
• Default Branch: master
• Last Pushed: 2022-12-07T23:05:02.000Z (about 2 years ago)
• Last Synced: 2024-11-12T04:37:46.942Z (about 1 month ago)
• Language: JavaScript
• Homepage:
• Size: 3.34 MB
• Stars: 178
• Watchers: 4
• Forks: 13
• Open Issues: 19
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# react-github-corner

[![NPM version](https://badge.fury.io/js/react-github-corner.svg)](http://badge.fury.io/js/react-github-corner)

[![Dependency Status](https://david-dm.org/skratchdot/react-github-corner.svg)](https://david-dm.org/skratchdot/react-github-corner)

[![devDependency Status](https://david-dm.org/skratchdot/react-github-corner/dev-status.svg)](https://david-dm.org/skratchdot/react-github-corner#info=devDependencies)

[![NPM](https://nodei.co/npm/react-github-corner.png)](https://npmjs.org/package/react-github-corner)

## Description

Add a Github banner to your project page. A React version of:

- [https://github.com/tholman/github-corners](https://github.com/tholman/github-corners)

## Getting Started

Install the module with: `npm install --save react-github-corner`

## Usage

```javascript

import React, { Component } from 'react';

import GithubCorner from 'react-github-corner';

export default class MyApp extends Component {

  render() {

    return (

      


        Wow

        
Cool

        Neat

        

      

    );

  }

}

```


## 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 `` tag that is rendered.

For instance, you can do:

```

```

and the `style` attribute will be rendered (which will hide the element).

## Links

- [Source Code](https://github.com/skratchdot/react-github-corner/)

- [Project Page](http://projects.skratchdot.com/react-github-corner/)

- [Project Page Source](https://github.com/skratchdot/react-github-corner/tree/gh-pages)

## License

Copyright (c) 2015 [skratchdot](http://skratchdot.com/)  

Licensed under the [MIT license](LICENSE-MIT).