signifly/nova-progressbar-card

A Laravel Nova card with a progress bar

v0.2.1 2019-09-30 08:57 UTC

Requires

• php: >=7.1.0

MIT

• Ro Kleine Sonne

• nova
• progressbar
• laravel
• card

README

This package allows you to add progressbar cards to your resources and dashboards in Nova.

DISCLAIMER:

This package is still work in progress. Feel free to help improve it.

• Requirements
• Installation
• Basic Usage
• Advanced Options

Requirements

• Laravel v5.8.*
• Laravel Nova v2.*

Installation

Just run:

composer require signifly/nova-progressbar-card

After this the setup will be complete and you can use the components listed here.

Basic Usage

// in App\Nova\Product
...
use Signifly\Nova\Cards\ProgressBar\ProgressBar;
...

/**
 * Get the cards available for the request.
 *
 * @param  \Illuminate\Http\Request  $request
 * @return array
 */
public function cards(Request $request)
{
    return [
        (new ProgressBar)->options(['title' => 'Translations', 'percentage' => 0.5]);
    ];
}

Advanced Options

Custom color

public function cards(Request $request)
{
    return [
        (new ProgressBar)->options([
            'title' => 'Translations',
            'percentage' => 0.5,
            'color' => '#123456',
        ]);
    ];
}

Animate Bar Color A -> B

public function cards(Request $request)
{
    return [
        (new ProgressBar)->options([
            'title' => 'Translations',
            'percentage' => 0.5,
            'colorFrom' => '#aaa',
            'colorTo' => '#bbb',
            'animateColor' => true,
        ]);
    ];
}

Stroke Width

public function cards(Request $request)
{
    return [
        (new ProgressBar)->options([
            'title' => 'Translations',
            'percentage' => 0.5,
            'strokeWidth' => 8,
        ]);
    ];
}

Semi Circle Type Progress Bar

public function cards(Request $request)
{
    return [
        (new ProgressBar)->options([
            'title' => 'Translations',
            'percentage' => 0.5,
            'type' => 'semi-circle',
        ]);
    ];
}

Feel free to come with suggestions for improvements.