carbon/colorvalues

A plugin for Neos CMS which provides an editor with color values

Installs: 6 927

Dependents: 0

Suggesters: 0

Security: 0

Stars: 5

Watchers: 2

Forks: 0

Open Issues: 0

Language:JavaScript

Type:neos-carbon

1.2.1 2024-03-21 15:23 UTC

This package is auto-updated.

Last update: 2024-04-21 15:31:57 UTC


README

Latest stable version Total downloads License GitHub forks GitHub stars GitHub watchers

Introduction

This package provides a Color Value Editor which can be used in Neos CMS.

It was inspired by Shel.Neos.ColorPicker, but with the difference that not the color values get saved, but the given key. And it just provides a list of colors, nothing more.

Example

example

Installation

Run this in your site package

composer require --no-update carbon/colorvalues

Then run composer update in your project directory.

How to use

Add a property of type string and configure the editor as seen in this example:

Foo.Bar:Content.Text:
  properties:
    color:
      type: string
      ui:
        label: Color
        reloadIfChanged: true
        inspector:
          editor: Carbon.ColorValues/Editor
          editorOptions:
            disabled: false
            # If set, this color gets displayed if no value is set
            placeholder: gold
            # Hides the reset button if set to false
            allowEmpty: true
            # Set a custom label for the reset button
            resetLabel: Custom label
            values:
              main:
                label: Primary
                color: '#95c11f'
              gray:
                label: Gray
                color: gray
              transparent:
                label: Transparent
                color: transparent
              disabledColor:
                label: Disabled color
                color: red
                disabled: true

A special treatment gets the color preview and select field if the color is set to transparent; in this case, a checkerboard gets rendered.

Contributions

Contributions are very welcome!

Please create detailed issues and PRs.