Nascent Political Miscreant

    This package has been deprecated

    Author message:

    Package no longer supported. Contact Support at https://www.npmjs.com/support for more info.

    ng-github-contributions
    TypeScript icon, indicating that this package has built-in type declarations

    0.0.4 • Public • Published

    Angular Github Contribuions

    An angular component to reproduce the appearence and behaviour of the Github contributions board. So far, the component supports custom color themes and time span, but more options will be added in the future.

    Overview

    Default appearence Example image

    Custom colors Example image

    Custom time span Example image

    Hiding labels Example image

    Usage

    Basic usage

    <github-board
        [profile]="'luizppa'"
        [onCellClick]="onCellClickHandler"
        [options]="boardOptions">
    </github-board>

    Options

    Optionally, you can specify an options object to configure the appearence fo the board. The available options are shown on the table bellow:

    Option Type Default value Description
    cellSize number 10 Defines the size of each individual board cell in pixels.
    weeksNumber number 53 Defines the time span shwon on the board in number of weeks.
    colorPalette GithubBoardColorPalette Defines the color palette for the board cells.
    labels GithubBoardLabelOptions Defines the properties of the labels indicating day and month around the board.

    GithubColorPalette Type

    Object that defines the color scheme to use on the board. The colors must be specified as strings in any HTML suported format (HEX, rgb, rgba...).

    Option Type Default value Description
    none string #EBEDF0 Defines the color for cells with no contributions.
    low string #9BE9A8 Defines the color for cells with 1 - 3 contributions.
    medium string #40C463 Defines the color for cells with 4 - 8 contributions.
    high string #30A14E Defines the color for cells with 9 - 10 contributions.
    higher string #216E39 Defines the color for cells with more than 10 contributions.

    GithubBoardLabelOptions Type

    Option Type Default value Description
    showMonth boolean true Defines whether or not to show month labels.
    showDay boolean true Defines whether or not to show day labels.
    size number 9 Defines the font size of the labels in pixels.

    Install

    npm i ng-github-contributions

    DownloadsWeekly Downloads

    1

    Version

    0.0.4

    License

    GPL

    Unpacked Size

    228 kB

    Total Files

    33

    Last publish

    Collaborators

    • luizppa