1 /** |
1 /** |
2 * Copyright (c) 2003-2015, CKSource - Frederico Knabben. All rights reserved. |
2 * Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved. |
3 * For licensing, see LICENSE.md or http://ckeditor.com/license |
3 * For licensing, see LICENSE.md or http://ckeditor.com/license |
4 */ |
4 */ |
5 |
5 |
6 // This file contains style definitions that can be used by CKEditor plugins. |
6 // This file contains style definitions that can be used by CKEditor plugins. |
7 // |
7 // |
8 // The most common use for it is the "stylescombo" plugin, which shows a combo |
8 // The most common use for it is the "stylescombo" plugin which shows the Styles drop-down |
9 // in the editor toolbar, containing all styles. Other plugins instead, like |
9 // list containing all styles in the editor toolbar. Other plugins, like |
10 // the div plugin, use a subset of the styles on their feature. |
10 // the "div" plugin, use a subset of the styles for their features. |
11 // |
11 // |
12 // If you don't have plugins that depend on this file, you can simply ignore it. |
12 // If you do not have plugins that depend on this file in your editor build, you can simply |
13 // Otherwise it is strongly recommended to customize this file to match your |
13 // ignore it. Otherwise it is strongly recommended to customize this file to match your |
14 // website requirements and design properly. |
14 // website requirements and design properly. |
|
15 // |
|
16 // For more information refer to: http://docs.ckeditor.com/#!/guide/dev_styles-section-style-rules |
15 |
17 |
16 CKEDITOR.stylesSet.add( 'default', [ |
18 CKEDITOR.stylesSet.add( 'default', [ |
17 /* Block Styles */ |
19 /* Block styles */ |
18 |
20 |
19 // These styles are already available in the "Format" combo ("format" plugin), |
21 // These styles are already available in the "Format" drop-down list ("format" plugin), |
20 // so they are not needed here by default. You may enable them to avoid |
22 // so they are not needed here by default. You may enable them to avoid |
21 // placing the "Format" combo in the toolbar, maintaining the same features. |
23 // placing the "Format" combo in the toolbar, maintaining the same features. |
22 /* |
24 /* |
23 { name: 'Paragraph', element: 'p' }, |
25 { name: 'Paragraph', element: 'p' }, |
24 { name: 'Heading 1', element: 'h1' }, |
26 { name: 'Heading 1', element: 'h1' }, |
41 background: '#eee', |
43 background: '#eee', |
42 border: '1px solid #ccc' |
44 border: '1px solid #ccc' |
43 } |
45 } |
44 }, |
46 }, |
45 |
47 |
46 /* Inline Styles */ |
48 /* Inline styles */ |
47 |
49 |
48 // These are core styles available as toolbar buttons. You may opt enabling |
50 // These are core styles available as toolbar buttons. You may opt enabling |
49 // some of them in the Styles combo, removing them from the toolbar. |
51 // some of them in the Styles drop-down list, removing them from the toolbar. |
50 // (This requires the "stylescombo" plugin) |
52 // (This requires the "stylescombo" plugin.) |
51 /* |
53 /* |
52 { name: 'Strong', element: 'strong', overrides: 'b' }, |
54 { name: 'Strong', element: 'strong', overrides: 'b' }, |
53 { name: 'Emphasis', element: 'em' , overrides: 'i' }, |
55 { name: 'Emphasis', element: 'em' , overrides: 'i' }, |
54 { name: 'Underline', element: 'u' }, |
56 { name: 'Underline', element: 'u' }, |
55 { name: 'Strikethrough', element: 'strike' }, |
57 { name: 'Strikethrough', element: 'strike' }, |
75 { name: 'Inline Quotation', element: 'q' }, |
77 { name: 'Inline Quotation', element: 'q' }, |
76 |
78 |
77 { name: 'Language: RTL', element: 'span', attributes: { 'dir': 'rtl' } }, |
79 { name: 'Language: RTL', element: 'span', attributes: { 'dir': 'rtl' } }, |
78 { name: 'Language: LTR', element: 'span', attributes: { 'dir': 'ltr' } }, |
80 { name: 'Language: LTR', element: 'span', attributes: { 'dir': 'ltr' } }, |
79 |
81 |
80 /* Object Styles */ |
82 /* Object styles */ |
81 |
83 |
82 { |
84 { |
83 name: 'Styled image (left)', |
85 name: 'Styled Image (left)', |
84 element: 'img', |
86 element: 'img', |
85 attributes: { 'class': 'left' } |
87 attributes: { 'class': 'left' } |
86 }, |
88 }, |
87 |
89 |
88 { |
90 { |
89 name: 'Styled image (right)', |
91 name: 'Styled Image (right)', |
90 element: 'img', |
92 element: 'img', |
91 attributes: { 'class': 'right' } |
93 attributes: { 'class': 'right' } |
92 }, |
94 }, |
93 |
95 |
94 { |
96 { |
95 name: 'Compact table', |
97 name: 'Compact Table', |
96 element: 'table', |
98 element: 'table', |
97 attributes: { |
99 attributes: { |
98 cellpadding: '5', |
100 cellpadding: '5', |
99 cellspacing: '0', |
101 cellspacing: '0', |
100 border: '1', |
102 border: '1', |
104 'border-collapse': 'collapse' |
106 'border-collapse': 'collapse' |
105 } |
107 } |
106 }, |
108 }, |
107 |
109 |
108 { name: 'Borderless Table', element: 'table', styles: { 'border-style': 'hidden', 'background-color': '#E6E6FA' } }, |
110 { name: 'Borderless Table', element: 'table', styles: { 'border-style': 'hidden', 'background-color': '#E6E6FA' } }, |
109 { name: 'Square Bulleted List', element: 'ul', styles: { 'list-style-type': 'square' } } |
111 { name: 'Square Bulleted List', element: 'ul', styles: { 'list-style-type': 'square' } }, |
|
112 |
|
113 /* Widget styles */ |
|
114 |
|
115 { name: 'Clean Image', type: 'widget', widget: 'image', attributes: { 'class': 'image-clean' } }, |
|
116 { name: 'Grayscale Image', type: 'widget', widget: 'image', attributes: { 'class': 'image-grayscale' } }, |
|
117 |
|
118 { name: 'Featured Snippet', type: 'widget', widget: 'codeSnippet', attributes: { 'class': 'code-featured' } }, |
|
119 |
|
120 { name: 'Featured Formula', type: 'widget', widget: 'mathjax', attributes: { 'class': 'math-featured' } }, |
|
121 |
|
122 { name: '240p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-240p' } }, |
|
123 { name: '360p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-360p' } }, |
|
124 { name: '480p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-480p' } }, |
|
125 { name: '720p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-720p' } }, |
|
126 { name: '1080p', type: 'widget', widget: 'embedSemantic', attributes: { 'class': 'embed-1080p' } }, |
|
127 |
|
128 // Adding space after the style name is an intended workaround. For now, there |
|
129 // is no option to create two styles with the same name for different widget types. See #16664. |
|
130 { name: '240p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-240p' } }, |
|
131 { name: '360p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-360p' } }, |
|
132 { name: '480p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-480p' } }, |
|
133 { name: '720p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-720p' } }, |
|
134 { name: '1080p ', type: 'widget', widget: 'embed', attributes: { 'class': 'embed-1080p' } } |
|
135 |
110 ] ); |
136 ] ); |
111 |
137 |