95b6c93d6d863276f344c2c12768a014d743f7c0
[Packages/TYPO3.CMS.git] / typo3 / sysext / frontend / Resources / Public / Css / adminpanel.css
1 /*!
2 * This file is part of the TYPO3 CMS project.
3 *
4 * It is free software; you can redistribute it and/or modify it under
5 * the terms of the GNU General Public License, either version 2
6 * of the License, or any later version.
7 *
8 * For the full copyright and license information, please read the
9 * LICENSE.txt file that was distributed with this source code.
10 *
11 * The TYPO3 project - inspiring people to share!
12 */
13 /*!
14 * Font Awesome 4.6.3 by @davegandy - http://fontawesome.io - @fontawesome
15 * License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
16 */
17 /* FONT PATH
18 * -------------------------- */
19 @font-face {
20 font-family: 'TYPO3FontAwesome';
21 src: url('../../../../backend/Resources/Public/Fonts/FontAwesome/fontawesome-webfont.eot?v=4.6.3');
22 src: url('../../../../backend/Resources/Public/Fonts/FontAwesome/fontawesome-webfont.eot?#iefix&v=4.6.3') format('embedded-opentype'), url('../../../../backend/Resources/Public/Fonts/FontAwesome/fontawesome-webfont.woff2?v=4.6.3') format('woff2'), url('../../../../backend/Resources/Public/Fonts/FontAwesome/fontawesome-webfont.woff?v=4.6.3') format('woff'), url('../../../../backend/Resources/Public/Fonts/FontAwesome/fontawesome-webfont.ttf?v=4.6.3') format('truetype'), url('../../../../backend/Resources/Public/Fonts/FontAwesome/fontawesome-webfont.svg?v=4.6.3#fontawesomeregular') format('svg');
23 font-weight: normal;
24 font-style: normal;
25 }
26 /*!
27 * Font Awesome icons are prefixed with #TSFE_ADMIN_PANEL_FORM to prevent issues with
28 * CSS from the website that uses Font Awesome too.
29 */
30 #TSFE_ADMIN_PANEL_FORM .fa:before,
31 .frontEndEditIconLinks .fa:before,
32 .typo3-editPanel .fa:before {
33 display: inline-block;
34 font: normal normal normal 14px/1 TYPO3FontAwesome;
35 font-size: 15px;
36 text-rendering: auto;
37 -webkit-font-smoothing: antialiased;
38 -moz-osx-font-smoothing: grayscale;
39 transform: translate(0, 0);
40 }
41 #TSFE_ADMIN_PANEL_FORM .fa-pencil:before,
42 .typo3-feedit-element .fa-pencil:before {
43 content: "\f040";
44 }
45 #TSFE_ADMIN_PANEL_FORM .fa-angle-up:before,
46 .typo3-editPanel .fa-angle-up:before {
47 content: "\f106";
48 }
49 #TSFE_ADMIN_PANEL_FORM .fa-angle-down:before,
50 .typo3-editPanel .fa-angle-down:before {
51 content: "\f107";
52 }
53 #TSFE_ADMIN_PANEL_FORM .fa-toggle-off:before,
54 .typo3-editPanel .fa-toggle-off:before {
55 content: "\f204";
56 }
57 #TSFE_ADMIN_PANEL_FORM .fa-toggle-on:before,
58 .typo3-editPanel .fa-toggle-on:before {
59 content: "\f205";
60 }
61 #TSFE_ADMIN_PANEL_FORM .fa-google-plus-square:before,
62 .typo3-editPanel .fa-google-plus-square:before {
63 content: "\f0d4";
64 }
65 #TSFE_ADMIN_PANEL_FORM .fa-trash:before,
66 .typo3-editPanel .fa-trash:before {
67 content: "\f1f8";
68 }
69 #TSFE_ADMIN_PANEL_FORM .fa-history:before,
70 .typo3-editPanel .fa-history:before {
71 content: "\f1da";
72 }
73 #TSFE_ADMIN_PANEL_FORM .fa-list-alt:before,
74 .typo3-editPanel .fa-list-alt:before {
75 content: "\f022";
76 }
77 #TSFE_ADMIN_PANEL_FORM .fa-plus-square:before,
78 .typo3-feedit-element .fa-plus-square:before {
79 content: "\f0fe";
80 }
81 #TSFE_ADMIN_PANEL_FORM .fa-arrows:before,
82 .typo3-editPanel .fa-arrows:before {
83 content: "\f047";
84 }
85 #TSFE_ADMIN_PANEL_FORM .fa-exclamation-circle:before {
86 content: "\f06a";
87 }
88 #TSFE_ADMIN_PANEL_FORM .fa-exclamation-triangle:before {
89 content: "\f071";
90 }
91 #TSFE_ADMIN_PANEL_FORM .fa-info-circle:before {
92 content: "\f05a";
93 }
94 #TSFE_ADMIN_PANEL_FORM .fa-caret-down:before {
95 content: "\f0d7";
96 }
97 #TSFE_ADMIN_PANEL_FORM .fa-caret-up:before {
98 content: "\f0d8";
99 }
100 #TSFE_ADMIN_PANEL_FORM .fa-bolt:before {
101 content: "\f0e7";
102 }
103 /**
104 * General Styles
105 **/
106 #TSFE_ADMIN_PANEL_FORM *:before,
107 #TSFE_ADMIN_PANEL_FORM *:after {
108 box-sizing: border-box;
109 }
110 /**
111 * Frontend Editing Styles
112 **/
113 .typo3-editPanel {
114 background: #ccc;
115 padding: 5px 10px;
116 }
117 .typo3-editPanel a {
118 text-decoration: none;
119 }
120 .typo3-editPanel-label {
121 display: inline;
122 margin: 0 10px;
123 }
124 .typo3-editPanel .t3-icon {
125 display: inline-block;
126 position: relative;
127 overflow: hidden;
128 }
129 .typo3-feedit-element .btn-default.content-link {
130 background-color: #eee;
131 margin: 3px;
132 }
133 .typo3-feedit-element-hidden {
134 filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=20);
135 opacity: 0.2;
136 }
137 /**
138 * Admin Panel Styles
139 **/
140 #TSFE_ADMIN_PANEL_FORM {
141 display: block;
142 max-width: 50%;
143 }
144 #TSFE_ADMIN_PANEL_FORM {
145 background-color: #fff;
146 box-shadow: 0 3px 15px #808080;
147 margin: 0;
148 padding: 0;
149 z-index: 10002;
150 border-top-right-radius: 4px;
151 border-top-left-radius: 4px;
152 }
153 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel {
154 border: 1px solid #ccc;
155 border-spacing: 0;
156 border-collapse: separate;
157 border-top-right-radius: 4px;
158 border-top-left-radius: 4px;
159 margin: 0;
160 min-width: 315px;
161 padding: 0;
162 line-height: 0.8;
163 }
164 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel * {
165 line-height: 1;
166 }
167 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel .typo3-adminPanel-table * {
168 line-height: 1.55;
169 }
170 #TSFE_ADMIN_PANEL_FORM,
171 #TSFE_ADMIN_PANEL_FORM table,
172 #TSFE_ADMIN_PANEL_FORM a {
173 color: black;
174 font-family: Verdana, Arial, sans-serif;
175 font-size: 12px;
176 text-decoration: none;
177 }
178 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-header {
179 line-height: 0.5;
180 }
181 #TSFE_ADMIN_PANEL_FORM #typo3-adminPanel-header {
182 border-top-right-radius: 4px;
183 border-top-left-radius: 4px;
184 cursor: move;
185 }
186 #TSFE_ADMIN_PANEL_FORM #typo3-adminPanel-header {
187 display: inline-block;
188 width: 100%;
189 background-color: #222;
190 color: white;
191 }
192 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-header a {
193 color: #fff;
194 }
195 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-header-title {
196 float: left;
197 padding-top: 11px;
198 padding-left: 15px;
199 }
200 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-header-buttonWrapper {
201 display: inline-block;
202 float: right;
203 margin-left: 10px;
204 }
205 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-panel-open .typo3-adminPanel-header-button:before,
206 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-panel-closed .typo3-adminPanel-header-button:before {
207 display: inline-block;
208 float: right;
209 padding: 10px 15px;
210 font-size: 16px;
211 content: "\f106";
212 }
213 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-panel-closed .typo3-adminPanel-header-button:before {
214 content: "\f107";
215 }
216 #TSFE_ADMIN_PANEL_FORM .updatebutton {
217 text-align: right;
218 background-color: #222;
219 width: 100%;
220 }
221 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-section-title .wrapper {
222 clear: left;
223 margin: 0;
224 padding: 0;
225 border-top: 1px solid #888;
226 border-bottom: 1px solid #888;
227 background-color: #ddd;
228 }
229 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-section-title a {
230 display: block;
231 padding-top: 5px;
232 padding-bottom: 5px;
233 line-height: 25px;
234 }
235 #TSFE_ADMIN_PANEL_FORM label {
236 display: inline;
237 line-height: 16px;
238 font-weight: 500;
239 }
240 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-section-title a .typo3-adminPanel-label {
241 padding-top: 4px;
242 white-space: nowrap;
243 }
244 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-section-title .wrapper:hover {
245 color: #fff;
246 background-color: #7e7e7e;
247 }
248 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-section-title .wrapper:hover a {
249 color: #fff;
250 }
251 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-section-title .typo3-adminPanel-section-open,
252 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-section-title .typo3-adminPanel-section-closed {
253 display: inline-block;
254 width: 100%;
255 padding-left: 26px;
256 }
257 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-section-title .typo3-adminPanel-section-open:before,
258 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-section-title .typo3-adminPanel-section-closed:before {
259 margin-left: -13px;
260 padding-right: 13px;
261 font-size: 14px;
262 content: "\f0d8";
263 }
264 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-section-title .typo3-adminPanel-section-closed:before {
265 content: "\f0d7";
266 }
267 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-itemRow .typo3-adminPanel-section-content {
268 padding: 7px 15px;
269 line-height: 16px;
270 }
271 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-section-content {
272 padding-right: 11px;
273 }
274 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-section-content .toolbar span {
275 padding: 1px;
276 }
277 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-section-content label {
278 padding-right: 5px;
279 }
280 #TSFE_ADMIN_PANEL_FORM #typo3-adminPanel-tsLog {
281 border: 1px solid #7e7e7e;
282 border-spacing: 0;
283 }
284 #TSFE_ADMIN_PANEL_FORM .clear-cache-icon:before {
285 position: absolute;
286 left: 26px;
287 top: -11px;
288 }
289 #TSFE_ADMIN_PANEL_FORM .btn.clear-cache {
290 margin-left: 15px;
291 padding-left: 25px;
292 }
293 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-table {
294 width: 100%;
295 border-collapse: collapse;
296 border-spacing: 0;
297 border: 1px solid #ccc;
298 }
299 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-table tr {
300 margin: 0;
301 padding: 0;
302 vertical-align: inherit;
303 border-color: inherit;
304 }
305 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-table td {
306 margin: 0;
307 vertical-align: inherit;
308 border-color: inherit;
309 padding: 0 15px;
310 text-align: left;
311 white-space: nowrap;
312 }
313 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-table th {
314 padding: 10px 10px 10px 15px;
315 border-bottom: 1px solid #aaa;
316 text-align: left;
317 background-color: #ededed;
318 }
319 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-table th span[style] {
320 color: #fff !important;
321 }
322 #TSFE_ADMIN_PANEL_FORM #typo3-adminPanel-tsLog .typo3-adminPanel-logRow-highlight {
323 background-color: #fcd3cf;
324 }
325 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-table-wrapper {
326 padding: 10px 0;
327 }
328 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-table-wrapper.scroll-table {
329 overflow-x: scroll;
330 }
331 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-table .line-odd,
332 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-table .line-even {
333 background-color: #f0f0f0;
334 text-align: left;
335 vertical-align: top;
336 }
337 #TSFE_ADMIN_PANEL_FORM .typo3-adminPanel-table .line-even {
338 background-color: #dedede;
339 }
340 #TSFE_ADMIN_PANEL_FORM #typo3-adminPanel-tsLog .stackPointer {
341 color: maroon;
342 vertical-align: top;
343 }
344 /**
345 * General Form and Button Styles
346 **/
347 .t3-icon {
348 display: inline-block;
349 position: relative;
350 vertical-align: middle;
351 text-align: center;
352 }
353 .btn .t3-icon {
354 margin: 0;
355 }
356 #TSFE_ADMIN_PANEL_FORM input,
357 #TSFE_ADMIN_PANEL_FORM select {
358 position: static;
359 padding: 0;
360 }
361 #TSFE_ADMIN_PANEL_FORM input[type="checkbox"] {
362 display: block;
363 float: left;
364 margin-top: 1px;
365 margin-left: 0;
366 margin-right: 5px;
367 }
368 #TSFE_ADMIN_PANEL_FORM input[type="text"],
369 #TSFE_ADMIN_PANEL_FORM select {
370 display: block;
371 width: 100%;
372 margin-top: 5px;
373 padding: 6px;
374 box-sizing: border-box;
375 }
376 #TSFE_ADMIN_PANEL_FORM input {
377 font-family: inherit;
378 font-size: inherit;
379 line-height: inherit;
380 color: inherit;
381 margin: 0;
382 }
383 #TSFE_ADMIN_PANEL_FORM .btn {
384 display: inline-block;
385 margin-bottom: 0;
386 padding: 6px 8px;
387 border: 1px solid transparent;
388 border-radius: 2px;
389 font-weight: normal;
390 font-size: 12px;
391 line-height: 1.5;
392 text-align: center;
393 vertical-align: middle;
394 -ms-touch-action: manipulation;
395 touch-action: manipulation;
396 cursor: pointer;
397 background-image: none;
398 white-space: nowrap;
399 -webkit-user-select: none;
400 -moz-user-select: none;
401 -ms-user-select: none;
402 user-select: none;
403 }
404 #TSFE_ADMIN_PANEL_FORM .btn:hover {
405 background-color: #c4c4c4;
406 }
407 #TSFE_ADMIN_PANEL_FORM .btn-default {
408 color: #333333;
409 background-color: #eeeeee;
410 border-color: #bbbbbb;
411 cursor: pointer;
412 }
413 #TSFE_ADMIN_PANEL_FORM .btn-group {
414 position: relative;
415 display: inline-block;
416 vertical-align: middle;
417 }
418 #TSFE_ADMIN_PANEL_FORM .btn-group > .btn:not(:first-child):not(:last-child):not(.dropdown-toggle) {
419 border-radius: 0;
420 }
421 #TSFE_ADMIN_PANEL_FORM .btn-group > .btn:first-child {
422 margin-left: 0;
423 }
424 #TSFE_ADMIN_PANEL_FORM input[type="text"] {
425 font-size: 12px;
426 line-height: 1.5;
427 color: #333333;
428 background-color: #fefefe;
429 background-image: none;
430 border: 1px solid #bbbbbb;
431 border-radius: 2px;
432 box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
433 transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
434 }
435 #TSFE_ADMIN_PANEL_FORM .treeline-icon {
436 position: relative;
437 display: inline-block;
438 margin-right: 2px;
439 padding: 0;
440 height: 18px;
441 width: 16px;
442 white-space: nowrap;
443 overflow: hidden;
444 vertical-align: middle;
445 }
446 #TSFE_ADMIN_PANEL_FORM .treeline-icon:after,
447 #TSFE_ADMIN_PANEL_FORM .treeline-icon:before {
448 position: absolute;
449 content: '';
450 left: 50%;
451 }
452 #TSFE_ADMIN_PANEL_FORM .treeline-icon:before {
453 top: 0;
454 height: 100%;
455 width: 2px;
456 margin-left: -1px;
457 border-left: 1px dotted #666666;
458 }
459 #TSFE_ADMIN_PANEL_FORM .treeline-icon:after {
460 border-top: 1px dotted #666666;
461 height: 2px;
462 width: 100%;
463 top: 50%;
464 margin-top: -1px;
465 }
466 #TSFE_ADMIN_PANEL_FORM .treeline-icon-jointop:before {
467 top: 50%;
468 }
469 #TSFE_ADMIN_PANEL_FORM .treeline-icon-joinbottom:before {
470 top: -50%;
471 }
472 #TSFE_ADMIN_PANEL_FORM .treeline-icon-line:after {
473 display: none;
474 }
475 #TSFE_ADMIN_PANEL_FORM .treeline-icon-blank {
476 display: none;
477 }
478 #TSFE_ADMIN_PANEL_FORM .treeline-icon-clear:before,
479 #TSFE_ADMIN_PANEL_FORM .treeline-icon-clear:after {
480 display: none;
481 }