Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/tossnet/Blazor-Color-Picker

Opens a palette with the Material colors for Blazor application
https://github.com/tossnet/Blazor-Color-Picker

blazor blazor-application blazor-client blazor-color-picker blazor-component blazor-server blazor-webassembly color-picker material-colors nuget palette

Last synced: 3 months ago
JSON representation

Opens a palette with the Material colors for Blazor application

Awesome Lists containing this project

README

        

# Blazor-Color-Picker
[![NuGet](https://img.shields.io/nuget/v/BlazorColorPicker.svg)](https://www.nuget.org/packages/BlazorColorPicker/) ![BlazorColorPicker Nuget Package](https://img.shields.io/nuget/dt/BlazorColorPicker)

Sometimes HTML5 colorpicker doesn't suit me for an application. I prefer to offer the user a predefined color palette

DEMO : https://tossnet.github.io/Blazor-Color-Picker/

Opens a palette with the Material colors

![Blazor Color Picker](https://github.com/tossnet/Blazor-Color-Picker/blob/master/BlazorColorPicker.gif)

# Installation
Latest version in here: [![NuGet](https://img.shields.io/nuget/v/BlazorColorPicker.svg)](https://www.nuget.org/packages/BlazorColorPicker/)

To Install

```
Install-Package BlazorColorPicker
```
or
```
dotnet add package BlazorColorPicker
```
For client-side and server-side Blazor - add script section to index.html or _Host.cshtml (head section)

```html

```

## Usage

```html
@page "/"
@using BlazorColorPicker

Hello, world!

Select a Color

@code {
bool isOpened = false;
string color = "#F1F7E9";

void OpenModal()
{
isOpened = true;
}

void ClosedEvent(string value)
{
color = value;
isOpened = false;
}
}
```

## Release Notes

Version 3.1.0

>- you can customise the size of the palette using your CSS styles
>- A red colour of the first column was not correct
>- Re-addition of .NET7 compatibility

Version 2.2.0

>- Remove the internal use of IJSRuntime

## ⚠️ Breaking changes ⚠️

Version 2.1.0

>- no need to declare the _content/BlazorColorPicker/colorpicker.js file