Chris@0
|
1 /**
|
Chris@0
|
2 * @file
|
Chris@0
|
3 * Styles for configuration of CKEditor module.
|
Chris@0
|
4 *
|
Chris@0
|
5 * Many of these styles are adapted directly from the default CKEditor theme
|
Chris@0
|
6 * "moono".
|
Chris@0
|
7 */
|
Chris@0
|
8
|
Chris@0
|
9 .ckeditor-toolbar {
|
Chris@18
|
10 margin: 5px 0;
|
Chris@0
|
11 padding: 0.1667em 0.1667em 0.08em;
|
Chris@0
|
12 /* Disallow any user selections in the drag-and-drop toolbar config UI. */
|
Chris@0
|
13 -webkit-user-select: none;
|
Chris@14
|
14 -moz-user-select: none;
|
Chris@14
|
15 -ms-user-select: none;
|
Chris@14
|
16 user-select: none;
|
Chris@18
|
17 border: 1px solid #b6b6b6;
|
Chris@18
|
18 background: #cfd1cf;
|
Chris@18
|
19 background-image: -webkit-linear-gradient(top, whiteSmoke, #cfd1cf);
|
Chris@18
|
20 background-image: linear-gradient(top, whiteSmoke, #cfd1cf);
|
Chris@18
|
21 box-shadow: 0 1px 0 white inset;
|
Chris@0
|
22 }
|
Chris@0
|
23 .ckeditor-toolbar-active {
|
Chris@0
|
24 margin-top: 0.25em;
|
Chris@0
|
25 }
|
Chris@0
|
26 .ckeditor-toolbar-disabled {
|
Chris@0
|
27 margin-bottom: 0.5em;
|
Chris@0
|
28 }
|
Chris@0
|
29 .ckeditor-toolbar ul,
|
Chris@0
|
30 .ckeditor-toolbar-disabled ul {
|
Chris@0
|
31 margin: 0;
|
Chris@0
|
32 padding: 0;
|
Chris@18
|
33 list-style: none;
|
Chris@0
|
34 }
|
Chris@0
|
35 /* This is required to win over specificity of [dir="rtl"] ul */
|
Chris@0
|
36 [dir="rtl"] .ckeditor-toolbar ul,
|
Chris@0
|
37 [dir="rtl"] .ckeditor-toolbar-disabled ul {
|
Chris@0
|
38 margin-right: 0;
|
Chris@0
|
39 }
|
Chris@0
|
40
|
Chris@0
|
41 .ckeditor-row {
|
Chris@0
|
42 padding: 2px 0 3px;
|
Chris@0
|
43 border-radius: 3px;
|
Chris@0
|
44 }
|
Chris@0
|
45 .ckeditor-group-names-are-visible .ckeditor-row {
|
Chris@0
|
46 border: 1px solid whitesmoke;
|
Chris@0
|
47 }
|
Chris@0
|
48 .ckeditor-row + .ckeditor-row {
|
Chris@0
|
49 margin-top: 0.25em;
|
Chris@0
|
50 }
|
Chris@0
|
51 .ckeditor-toolbar-group,
|
Chris@0
|
52 .ckeditor-toolbar-group-placeholder,
|
Chris@0
|
53 .ckeditor-add-new-group {
|
Chris@0
|
54 float: left; /* LTR */
|
Chris@0
|
55 }
|
Chris@0
|
56 [dir="rtl"] .ckeditor-toolbar-group,
|
Chris@0
|
57 [dir="rtl"] .ckeditor-toolbar-group-placeholder,
|
Chris@0
|
58 [dir="rtl"] .ckeditor-add-new-group {
|
Chris@0
|
59 float: right;
|
Chris@0
|
60 }
|
Chris@0
|
61 .ckeditor-toolbar-groups {
|
Chris@0
|
62 min-height: 2em;
|
Chris@0
|
63 }
|
Chris@0
|
64 .ckeditor-toolbar-group {
|
Chris@0
|
65 margin: 0 0.3333em;
|
Chris@0
|
66 cursor: move;
|
Chris@0
|
67 }
|
Chris@0
|
68 .ckeditor-group-names-are-visible .ckeditor-toolbar-group,
|
Chris@0
|
69 .ckeditor-add-new-group {
|
Chris@18
|
70 padding: 0.2em 0.4em;
|
Chris@0
|
71 border: 1px dotted #a6a6a6;
|
Chris@0
|
72 border-radius: 3px;
|
Chris@0
|
73 }
|
Chris@0
|
74 .ckeditor-toolbar-group.placeholder,
|
Chris@0
|
75 .ckeditor-toolbar-group.placeholder .ckeditor-toolbar-group-name {
|
Chris@0
|
76 cursor: not-allowed;
|
Chris@0
|
77 }
|
Chris@0
|
78 .ckeditor-toolbar-group.placeholder .ckeditor-toolbar-group-name {
|
Chris@0
|
79 font-style: italic;
|
Chris@0
|
80 }
|
Chris@0
|
81 .ckeditor-toolbar-group-name {
|
Chris@0
|
82 display: none;
|
Chris@18
|
83 margin: 0.25em 0;
|
Chris@0
|
84 font-size: 1em;
|
Chris@0
|
85 font-weight: normal;
|
Chris@0
|
86 }
|
Chris@0
|
87 .ckeditor-group-names-are-visible .ckeditor-toolbar-group-name {
|
Chris@0
|
88 display: block;
|
Chris@0
|
89 cursor: pointer;
|
Chris@0
|
90 }
|
Chris@0
|
91 .ckeditor-toolbar-active .placeholder,
|
Chris@0
|
92 .ckeditor-toolbar-active .ckeditor-add-new-group {
|
Chris@0
|
93 display: none;
|
Chris@0
|
94 }
|
Chris@0
|
95 .ckeditor-group-names-are-visible .placeholder,
|
Chris@0
|
96 .ckeditor-group-names-are-visible .ckeditor-add-new-group {
|
Chris@0
|
97 display: block;
|
Chris@0
|
98 }
|
Chris@0
|
99 .ckeditor-toolbar-group-buttons {
|
Chris@0
|
100 float: left; /* LTR */
|
Chris@0
|
101 }
|
Chris@0
|
102 [dir="rtl"] .ckeditor-toolbar-group-buttons {
|
Chris@0
|
103 float: right;
|
Chris@0
|
104 }
|
Chris@0
|
105 .ckeditor-groupnames-toggle {
|
Chris@18
|
106 float: right; /* LTR */
|
Chris@0
|
107 cursor: pointer;
|
Chris@0
|
108 }
|
Chris@0
|
109 [dir="rtl"] .ckeditor-groupnames-toggle {
|
Chris@0
|
110 float: left;
|
Chris@0
|
111 }
|
Chris@0
|
112 .ckeditor-toolbar .ckeditor-toolbar-group > li {
|
Chris@18
|
113 margin: 3px 6px;
|
Chris@18
|
114 padding: 3px;
|
Chris@0
|
115 border: 1px solid white;
|
Chris@0
|
116 border-radius: 5px;
|
Chris@0
|
117 background-image: -webkit-linear-gradient(transparent 60%, rgba(0, 0, 0, 0.1));
|
Chris@0
|
118 background-image: linear-gradient(transparent 60%, rgba(0, 0, 0, 0.1));
|
Chris@0
|
119 }
|
Chris@0
|
120 .ckeditor-toolbar-configuration .fieldset-description {
|
Chris@0
|
121 margin-bottom: 1em;
|
Chris@0
|
122 }
|
Chris@0
|
123 .ckeditor-toolbar-disabled .ckeditor-toolbar-available,
|
Chris@0
|
124 .ckeditor-toolbar-disabled .ckeditor-toolbar-dividers {
|
Chris@0
|
125 box-sizing: border-box;
|
Chris@0
|
126 }
|
Chris@0
|
127 .ckeditor-toolbar-disabled .ckeditor-toolbar-available {
|
Chris@0
|
128 float: left; /* LTR */
|
Chris@0
|
129 width: 80%;
|
Chris@0
|
130 }
|
Chris@0
|
131 [dir="rtl"] .ckeditor-toolbar-disabled .ckeditor-toolbar-available {
|
Chris@0
|
132 float: right;
|
Chris@0
|
133 }
|
Chris@0
|
134 .ckeditor-toolbar-disabled .ckeditor-toolbar-dividers {
|
Chris@0
|
135 float: right; /* LTR */
|
Chris@0
|
136 width: 20%;
|
Chris@0
|
137 }
|
Chris@0
|
138 [dir="rtl"] .ckeditor-toolbar-disabled .ckeditor-toolbar-dividers {
|
Chris@0
|
139 float: left;
|
Chris@0
|
140 }
|
Chris@0
|
141 .ckeditor-toolbar-disabled .ckeditor-buttons li a,
|
Chris@0
|
142 .ckeditor-toolbar .ckeditor-buttons,
|
Chris@0
|
143 .ckeditor-add-new-group button {
|
Chris@0
|
144 border: 1px solid #a6a6a6;
|
Chris@0
|
145 border-bottom-color: #979797;
|
Chris@0
|
146 border-radius: 3px;
|
Chris@0
|
147 box-shadow: 0 1px 0 rgba(255, 255, 255, 0.5), 0 0 2px rgba(255, 255, 255, 0.15) inset, 0 1px 0 rgba(255, 255, 255, 0.15) inset;
|
Chris@0
|
148 }
|
Chris@0
|
149 .ckeditor-toolbar-disabled .ckeditor-buttons {
|
Chris@0
|
150 border: 0;
|
Chris@0
|
151 }
|
Chris@0
|
152 .ckeditor-toolbar-disabled .ckeditor-buttons li {
|
Chris@0
|
153 margin: 2px;
|
Chris@0
|
154 }
|
Chris@0
|
155 .ckeditor-buttons {
|
Chris@18
|
156 min-width: 26px;
|
Chris@0
|
157 min-height: 26px;
|
Chris@0
|
158 }
|
Chris@0
|
159 .ckeditor-buttons li {
|
Chris@18
|
160 float: left; /* LTR */
|
Chris@18
|
161 margin: 0;
|
Chris@0
|
162 padding: 0;
|
Chris@0
|
163 }
|
Chris@0
|
164 [dir="rtl"] .ckeditor-buttons li {
|
Chris@0
|
165 float: right;
|
Chris@0
|
166 }
|
Chris@0
|
167 .ckeditor-buttons li a,
|
Chris@0
|
168 .ckeditor-add-new-group button {
|
Chris@18
|
169 color: #474747;
|
Chris@0
|
170 background: #e4e4e4;
|
Chris@0
|
171 background-image: -webkit-linear-gradient(top, white, #e4e4e4);
|
Chris@0
|
172 background-image: linear-gradient(top, white, #e4e4e4);
|
Chris@0
|
173 }
|
Chris@0
|
174 .ckeditor-buttons li a {
|
Chris@18
|
175 position: relative;
|
Chris@0
|
176 display: block;
|
Chris@0
|
177 min-height: 18px;
|
Chris@18
|
178 padding: 4px 6px;
|
Chris@18
|
179 cursor: move;
|
Chris@18
|
180 white-space: nowrap;
|
Chris@18
|
181 text-decoration: none;
|
Chris@18
|
182 border: 0;
|
Chris@18
|
183 text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
|
Chris@0
|
184 line-height: 1.4;
|
Chris@0
|
185 }
|
Chris@0
|
186 .ckeditor-toolbar-dividers {
|
Chris@0
|
187 float: right; /* LTR */
|
Chris@0
|
188 }
|
Chris@0
|
189 [dir="rtl"] .ckeditor-toolbar-dividers {
|
Chris@0
|
190 float: left;
|
Chris@0
|
191 }
|
Chris@0
|
192 .ckeditor-buttons li .cke-icon-only {
|
Chris@0
|
193 /* Firefox includes the offscreen text in the focus indicator, resulting in a
|
Chris@0
|
194 far too wide focus indicator. This fixes that. */
|
Chris@0
|
195 overflow: hidden;
|
Chris@18
|
196 width: 16px;
|
Chris@18
|
197 text-indent: -9999px;
|
Chris@0
|
198 }
|
Chris@0
|
199 .ckeditor-buttons .cke_button_icon img {
|
Chris@0
|
200 width: 16px;
|
Chris@0
|
201 height: 16px;
|
Chris@0
|
202 }
|
Chris@0
|
203 .ckeditor-buttons li .cke_ltr {
|
Chris@0
|
204 direction: ltr;
|
Chris@0
|
205 }
|
Chris@0
|
206 .ckeditor-buttons li .cke_rtl {
|
Chris@0
|
207 direction: rtl;
|
Chris@0
|
208 }
|
Chris@0
|
209 .ckeditor-buttons li a:focus,
|
Chris@0
|
210 .ckeditor-buttons li a:active,
|
Chris@0
|
211 .ckeditor-multiple-buttons li a:focus {
|
Chris@0
|
212 z-index: 11; /* Ensure focused buttons show their outline on all sides. */
|
Chris@0
|
213 }
|
Chris@0
|
214 .ckeditor-buttons li:first-child a {
|
Chris@0
|
215 border-top-left-radius: 2px; /* LTR */
|
Chris@0
|
216 border-bottom-left-radius: 2px; /* LTR */
|
Chris@0
|
217 }
|
Chris@0
|
218 [dir="rtl"] .ckeditor-buttons li:first-child a {
|
Chris@0
|
219 border-top-right-radius: 2px;
|
Chris@0
|
220 border-bottom-right-radius: 2px;
|
Chris@0
|
221 }
|
Chris@0
|
222 .ckeditor-buttons li:last-child a {
|
Chris@0
|
223 border-top-right-radius: 2px; /* LTR */
|
Chris@0
|
224 border-bottom-right-radius: 2px; /* LTR */
|
Chris@0
|
225 }
|
Chris@0
|
226 [dir="rtl"] .ckeditor-buttons li:last-child a {
|
Chris@0
|
227 border-top-left-radius: 2px;
|
Chris@0
|
228 border-bottom-left-radius: 2px;
|
Chris@0
|
229 }
|
Chris@0
|
230 .ckeditor-button-placeholder,
|
Chris@0
|
231 .ckeditor-toolbar-group-placeholder {
|
Chris@0
|
232 background: #9dcae7;
|
Chris@0
|
233 }
|
Chris@0
|
234 .ckeditor-toolbar-group-placeholder {
|
Chris@0
|
235 border-radius: 4px;
|
Chris@0
|
236 }
|
Chris@0
|
237 .ckeditor-multiple-buttons {
|
Chris@18
|
238 float: left; /* LTR */
|
Chris@18
|
239 margin: 5px;
|
Chris@0
|
240 padding: 1px 2px;
|
Chris@0
|
241 list-style: none;
|
Chris@0
|
242 }
|
Chris@0
|
243 [dir="rtl"] .ckeditor-multiple-buttons {
|
Chris@0
|
244 float: right;
|
Chris@0
|
245 }
|
Chris@0
|
246 .ckeditor-multiple-buttons li {
|
Chris@0
|
247 float: left; /* LTR */
|
Chris@0
|
248 margin: 0;
|
Chris@0
|
249 padding: 0;
|
Chris@0
|
250 }
|
Chris@0
|
251 [dir="rtl"] .ckeditor-multiple-buttons li {
|
Chris@0
|
252 float: right;
|
Chris@0
|
253 }
|
Chris@0
|
254 .ckeditor-multiple-buttons li a {
|
Chris@0
|
255 display: inline-block;
|
Chris@0
|
256 min-height: 18px;
|
Chris@0
|
257 margin: 0;
|
Chris@0
|
258 padding: 2px 0;
|
Chris@18
|
259 cursor: move;
|
Chris@18
|
260 line-height: 1.4;
|
Chris@0
|
261 }
|
Chris@0
|
262 .ckeditor-buttons .ckeditor-group-button-separator,
|
Chris@0
|
263 .ckeditor-multiple-buttons .ckeditor-group-button-separator {
|
Chris@0
|
264 margin: -1px -3px -2px;
|
Chris@0
|
265 }
|
Chris@0
|
266 .ckeditor-buttons .ckeditor-group-button-separator a,
|
Chris@0
|
267 .ckeditor-multiple-buttons .ckeditor-group-button-separator a {
|
Chris@0
|
268 position: relative;
|
Chris@0
|
269 z-index: 10;
|
Chris@18
|
270 width: 13px;
|
Chris@18
|
271 height: 29px;
|
Chris@18
|
272 padding: 0;
|
Chris@18
|
273 background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAAdCAMAAABG4xbVAAAAhFBMVEUAAACmpqampqampqb////l5eX////5+fmmpqatra2urq6vr6+1tbW2tra4uLi6urq8vLzb29ve3t7i4uLl5eXn5+fo6Ojp6enq6urr6+vs7Ozt7e3u7u7v7+/w8PDx8fHy8vLz8/P09PT19fX29vb39/f4+Pj5+fn6+vr7+/v8/Pz+/v7qIQO+AAAACHRSTlMATVmAi8XM29MuWToAAABjSURBVBiVrc5BCoAwDETRMKhtRBduev9LKm1xjItWRBBE6Nt9QkIwOTcUzk0Imi8aoMssxbgoTHMtqsFMLta0vPh2N49HyfdelPg6k9uvX/a+Bmggt1qJRNzQFVgjEnkUZDoBmH57VSypjg4AAAAASUVORK5CYII=) no-repeat center center;
|
Chris@0
|
274 }
|
Chris@0
|
275 ul.ckeditor-buttons li.ckeditor-button-separator a {
|
Chris@18
|
276 position: relative;
|
Chris@18
|
277 z-index: 10;
|
Chris@18
|
278 width: 1px;
|
Chris@18
|
279 height: 24px;
|
Chris@18
|
280 margin: 1px 0 0;
|
Chris@18
|
281 padding: 0;
|
Chris@0
|
282 background: #e4e4e4;
|
Chris@0
|
283 background-image: -webkit-linear-gradient(#e4e4e4, #b4b4b4);
|
Chris@0
|
284 background-image: linear-gradient(#e4e4e4, #b4b4b4);
|
Chris@0
|
285 }
|
Chris@0
|
286 .ckeditor-multiple-buttons .ckeditor-button-separator a {
|
Chris@0
|
287 width: 2px;
|
Chris@0
|
288 height: 26px;
|
Chris@0
|
289 margin: 0 10px;
|
Chris@18
|
290 padding: 0;
|
Chris@0
|
291 }
|
Chris@0
|
292 .ckeditor-separator {
|
Chris@18
|
293 display: block;
|
Chris@18
|
294 width: 1px;
|
Chris@18
|
295 height: 18px;
|
Chris@18
|
296 margin: 5px 0;
|
Chris@0
|
297 background-color: silver;
|
Chris@0
|
298 background-color: rgba(0, 0, 0, 0.2);
|
Chris@14
|
299 box-shadow: 1px 0 1px rgba(255, 255, 255, 0.5);
|
Chris@0
|
300 }
|
Chris@0
|
301 .ckeditor-button-arrow {
|
Chris@18
|
302 display: inline-block;
|
Chris@0
|
303 width: 0;
|
Chris@18
|
304 margin: 0 4px 2px;
|
Chris@0
|
305 text-align: center;
|
Chris@18
|
306 border-top: 3px solid #333;
|
Chris@18
|
307 border-right: 3px solid transparent;
|
Chris@0
|
308 border-left: 3px solid transparent;
|
Chris@0
|
309 }
|
Chris@0
|
310 .ckeditor-row-controls {
|
Chris@0
|
311 float: right; /* LTR */
|
Chris@0
|
312 width: 40px;
|
Chris@0
|
313 text-align: right; /* LTR */
|
Chris@18
|
314 font-size: 18px;
|
Chris@0
|
315 }
|
Chris@0
|
316 [dir="rtl"] .ckeditor-row-controls {
|
Chris@0
|
317 float: left;
|
Chris@0
|
318 text-align: left;
|
Chris@0
|
319 }
|
Chris@0
|
320 .ckeditor-row-controls a {
|
Chris@0
|
321 display: inline-block;
|
Chris@0
|
322 box-sizing: border-box;
|
Chris@18
|
323 width: 20px;
|
Chris@18
|
324 height: 28px;
|
Chris@0
|
325 padding: 6px 2px;
|
Chris@18
|
326 text-decoration: none;
|
Chris@18
|
327 color: #333;
|
Chris@18
|
328 font-weight: bold;
|
Chris@0
|
329 line-height: 0.9;
|
Chris@0
|
330 }
|