JavaScript HTML CSS
Switch branches/tags
Nothing to show
Clone or download
Latest commit 8a205a4 Jun 13, 2018
Permalink
Failed to load latest commit information.
example Update react to v16 Feb 21, 2018
src Update react to v16 Feb 21, 2018
.babelrc Make responsive Jun 2, 2016
.gitignore Add bundle.js for gh-pages Jun 4, 2016
README.md Update README.md Jun 13, 2018
default.css Move default.css Jun 4, 2016
package-lock.json Update react to v16 Feb 21, 2018
package.json Bump up version v1.0.0 Feb 21, 2018

README.md

react-github-contribution-calendar

npm version

A responsive react component for GitHub-like heatmap calendar

Demo

Demo and documents

Usage

<html>
  <head>
    <!-- load styles! -->
    <link rel="stylesheet" href="node_modules/react-github-contribution-calendar/default.css" type="text/css" />
  </head>
  <body>
    <div id="calendar"></div>
  </body>
  <script src="main.js"></script>
</html>
// main.jsx
import React from 'react';
import ReactDOM from 'react-dom';
import Calendar from 'react-github-contribution-calendar';

var values = {
  '2016-06-23': 1,
  '2016-06-26': 2,
  '2016-06-27': 3,
  '2016-06-28': 4,
  '2016-06-29': 4
}
var until = '2016-06-30';

var elem = document.getElementById('app');
ReactDOM.render(<Calendar values={values} until={until} />, elem);

Install

npm i react-github-contribution-calendar --save

Licence

MIT

Author

haripo