소스 검색

Add color names.

Mateusz Samsel 6 년 전
부모
커밋
e671a663b7

+ 44 - 15
packages/ckeditor5-font/src/fontbackgroundcolor/fontbackgroundcolorediting.js

@@ -22,24 +22,53 @@ export default class FontBackgroundColorEditing extends Plugin {
 
 		editor.config.define( FONT_BACKGROUND_COLOR, {
 			colors: [
-				'hsl(0, 0%, 0%)',
-				'hsl(0, 0%, 30%)',
-				'hsl(0, 0%, 60%)',
-				'hsl(0, 0%, 90%)',
 				{
+					color: 'hsl(0, 0%, 0%)',
+					label: 'Black'
+				}, {
+					color: 'hsl(0, 0%, 30%)',
+					label: 'Dim grey'
+				}, {
+					color: 'hsl(0, 0%, 60%)',
+					label: 'Grey'
+				}, {
+					color: 'hsl(0, 0%, 90%)',
+					label: 'Light grey'
+				}, {
 					color: 'hsl(0, 0%, 100%)',
+					label: 'White',
 					hasBorder: true
-				},
-				'hsl(360, 75%, 60%)',
-				'hsl(30, 75%, 60%)',
-				'hsl(60, 75%, 60%)',
-				'hsl(90, 75%, 60%)',
-				'hsl(120, 75%, 60%)',
-				'hsl(150, 75%, 60%)',
-				'hsl(180, 75%, 60%)',
-				'hsl(210, 75%, 60%)',
-				'hsl(240, 75%, 60%)',
-				'hsl(270, 75%, 60%)'
+				}, {
+					color: 'hsl(0, 75%, 60%)',
+					label: 'Red'
+				}, {
+					color: 'hsl(30, 75%, 60%)',
+					label: 'Orange'
+				}, {
+					color: 'hsl(60, 75%, 60%)',
+					label: 'Yellow'
+				}, {
+					color: 'hsl(90, 75%, 60%)',
+					label: 'Light green'
+				}, {
+					color: 'hsl(120, 75%, 60%)',
+					label: 'Green'
+				}, {
+					color: 'hsl(150, 75%, 60%)',
+					label: 'Aquamarine'
+				}, {
+					color: 'hsl(180, 75%, 60%)',
+					label: 'Turquoise'
+				}, {
+					color: 'hsl(210, 75%, 60%)',
+					label: 'Light blue'
+				}, {
+					color: 'hsl(240, 75%, 60%)',
+					label: 'Blue'
+				}, {
+					color: 'hsl(270, 75%, 60%)',
+					label: 'Purple'
+				}
 			]
 		} );
 

+ 44 - 15
packages/ckeditor5-font/src/fontcolor/fontcolorediting.js

@@ -22,24 +22,53 @@ export default class FontColorEditing extends Plugin {
 
 		editor.config.define( FONT_COLOR, {
 			colors: [
-				'hsl(0, 0%, 0%)',
-				'hsl(0, 0%, 30%)',
-				'hsl(0, 0%, 60%)',
-				'hsl(0, 0%, 90%)',
 				{
+					color: 'hsl(0, 0%, 0%)',
+					label: 'Black'
+				}, {
+					color: 'hsl(0, 0%, 30%)',
+					label: 'Dim grey'
+				}, {
+					color: 'hsl(0, 0%, 60%)',
+					label: 'Grey'
+				}, {
+					color: 'hsl(0, 0%, 90%)',
+					label: 'Light grey'
+				}, {
 					color: 'hsl(0, 0%, 100%)',
+					label: 'White',
 					hasBorder: true
-				},
-				'hsl(360, 75%, 60%)',
-				'hsl(30, 75%, 60%)',
-				'hsl(60, 75%, 60%)',
-				'hsl(90, 75%, 60%)',
-				'hsl(120, 75%, 60%)',
-				'hsl(150, 75%, 60%)',
-				'hsl(180, 75%, 60%)',
-				'hsl(210, 75%, 60%)',
-				'hsl(240, 75%, 60%)',
-				'hsl(270, 75%, 60%)'
+				}, {
+					color: 'hsl(0, 75%, 60%)',
+					label: 'Red'
+				}, {
+					color: 'hsl(30, 75%, 60%)',
+					label: 'Orange'
+				}, {
+					color: 'hsl(60, 75%, 60%)',
+					label: 'Yellow'
+				}, {
+					color: 'hsl(90, 75%, 60%)',
+					label: 'Light green'
+				}, {
+					color: 'hsl(120, 75%, 60%)',
+					label: 'Green'
+				}, {
+					color: 'hsl(150, 75%, 60%)',
+					label: 'Aquamarine'
+				}, {
+					color: 'hsl(180, 75%, 60%)',
+					label: 'Turquoise'
+				}, {
+					color: 'hsl(210, 75%, 60%)',
+					label: 'Light blue'
+				}, {
+					color: 'hsl(240, 75%, 60%)',
+					label: 'Blue'
+				}, {
+					color: 'hsl(270, 75%, 60%)',
+					label: 'Purple'
+				}
 			]
 		} );