Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

DOC-2498: Added support for using raw CSS in the list of possible colours, using the color_map_raw property. #3501

Merged
merged 2 commits into from
Nov 4, 2024
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
13 changes: 13 additions & 0 deletions modules/ROOT/pages/7.5-release-notes.adoc
Original file line number Diff line number Diff line change
Expand Up @@ -190,6 +190,19 @@ In previous versions of {productname}, an issue was identified where screen read

{productname} {release-version} also includes the following addition<s>:

=== Added support for using raw CSS in the list of possible colours, using the `color_map_raw` property.
// #TINY-11385

In previous versions of {productname}, the `color_map` property allowed users to define a list of colors for the color picker dropdown. However, this property only supported predefined color names or hex values, limiting the customization options for users who wanted to include custom colors using raw CSS.

{productname} {release-version} addresses this limitation by introducing the `color_map_raw` property. This new property allows users to define a list of colors using raw CSS values, providing greater flexibility and customization options for the color picker dropdown.

As a result, users can now include custom colors, or other CSS properties in the color map.

For more information on customizing the color picker, see xref:user-formatting-options.adoc#color_map_raw[`+color_map_raw+` option].

NOTE: {companyname} Technologies would like to thank link:https://github.com/andrewnicols[Andrew Nicols] for contributing to this feature.

=== Added new default `li` element styles to the content CSS to prevent child list elements from inheriting certain parent list item styles.
// #TINY-11217

Expand Down
26 changes: 26 additions & 0 deletions modules/ROOT/partials/configuration/text_color.adoc
Original file line number Diff line number Diff line change
Expand Up @@ -145,6 +145,32 @@ tinymce.init({
});
----

[[color_map_raw]]
=== `+color_map_raw+`

The `color_map_raw` option specifies a map of text colors that appear in the color picker grid. This configuration provides detailed control over the colors available for the `forecolor` and `backcolor` toolbar options. The following example shows how to set the color map using CSS variables, color functions, and hex codes.

*Type:* `+Array+`

==== Example: using `+color_map_raw+`

[source,js]
----
tinymce.init({
selector: 'textarea', // Adjust this value according to your HTML
toolbar: 'forecolor backcolor',
color_map_raw: [
'var(--black)', 'Black', // CSS variable-based colors
'var(--red)', 'Red',
'hsb(0, 100%, 100%)', 'White hsb', // Color functions like hsb() and hsl()
'hsl(0, 100%, 50%)', 'Red hsl',
'#ff00ff', 'Pink', // Hex code-based colors
'#00ffff', 'Cyan',
'var(--purple)', 'Purple', // User-friendly labels for easy identification such as 'Purple'.
'#00FF7F', 'Spring Green'
],
});
----

[[color_map_background]]
=== `color_map_background`
Expand Down
Loading