search

inspheric / nova-indicator-field

A colour-coded indicator field for Laravel Nova
129 stars 10 forks source link

Add custom colors #3

Closed bigperson closed 5 years ago

bigperson commented 6 years ago

How to i can add custom colors?

Indicator::make('Status')
    ->colors([
        'banned' => '#a466bd',
        'active' => '#a2c617',
        'invited' => '#e92919',
        'inactive' => '#000000',
    ])
kitbs commented 6 years ago

You aren't able to do this in the way you have described yet, but I might look at it if I get time. I'd be happy to review a pull request too.

What you could do for now is serve your own CSS file (using Nova's Asset functionality) and add your own classes with the background colours defined.

The classes must be named e.g. indicator-*yourcolourname* so your CSS would be:

.indicator-yourcolourname {
    background: #000000;
}

and your Field definition would be:

Indicator::make('Status')
    ->colors([
        'yourstatus' => 'yourcolourname',
    ])
ppisecky commented 5 years ago

Wouldn't this be pretty easy to implement just by using a regex to check for # followed by 3 or 6 alphanumerical characters?

This would make this package synergize very nicely with https://novapackages.com/packages/timothyasp/nova-color-field

kitbs commented 5 years ago

I am implementing this now. If the colour string starts with # it will be interpreted as a background-color, otherwise as a class.