3f5741c104941ad157ff397f57beccf0dd3fc422
[redakcja.git] / project / static / css / master.css
1 body {
2     margin: 0;
3     font: 10pt Helvetica, Verdana, sans-serif;
4     overflow: hidden;
5     background: #AAA;
6 }
7
8 #header { 
9     position: absolute;
10     padding: 0.2em 0.5em;
11     background-color: #CDCDCD;
12         border-bottom: 0.1px solid black;
13         height: 1.8em;
14         line-height: 1.8em;
15         vertical-align: center;
16
17     top: 0px; left: 0px; right: 0px; 
18     z-index: 300;
19 }
20
21 #header #breadcrumbs {
22 }
23
24 #header-right-toolbar {
25         position: absolute;
26         right: 1em;
27 }
28
29 #header button {
30         vertical-align: center;
31 }
32
33 #content {
34     position: absolute;
35     top: 2.4em; left: 0px; right: 0px; bottom: 0px;
36     overflow: auto;    
37     background-color: white;
38 }
39
40 ul {
41     margin: 20px;
42     padding: 0;
43 }
44
45 li {
46     margin: 0;
47     padding: 0;
48     list-style: none;
49 }
50
51 a {
52     text-decoration: none;
53 }
54
55 a:hover {
56     text-decoration: underline;
57 }
58
59 li a {
60     display: block;
61     padding: 5px 20px;
62     width: 480px;
63 }
64
65 li a:hover {
66     background-color: #BCD6E9;
67 }
68
69 #tabs {
70     border-bottom: 1px solid #858585;
71     background-color: #B7B7B7;
72 }
73
74 #tabs a {
75     display: block;
76     border-right: 1px solid #858585;
77     float: left;
78     padding: 5px 10px;
79 }
80
81 #tabs a.active {
82     background-color: #909090;
83 }
84
85 .theme-begin {
86     display: none;
87 }
88
89 label {
90     display: block;
91 }
92
93 #text_id {
94     width: 480px;
95     height: 480px;
96 }
97
98 #file-text {
99     padding: 5px 10px;
100     overflow-x: hidden;
101     overflow-y: scroll;
102 }
103
104 /* ========== */
105 /* = Panels = */
106 /* ========== */
107
108 #panels {
109         position: absolute;
110         bottom: 0px; left: 0px; right: 0px; top: 0px;
111 }
112
113 .panel-wrap {
114     overflow: hidden;
115         position: absolute; /* absolute to relation with #panels */
116         top: 0px;
117         bottom: 0px;
118 }
119
120 #left-panel-wrap {
121         left: 0px;
122         width: 8px; /* initial width */
123 }
124
125 #right-panel-wrap {
126         right: 0px;
127         width: auto;
128         left: 8px; /* initial width of the left panel */
129 }
130
131 /* contents */
132 .panel-content {
133         position: absolute;
134         overflow: auto;
135         overflow-x: hidden;
136         top: 22px; left: 0px; bottom:0px; right: 0px;
137 }
138
139 .panel-overlay {
140         position: absolute;
141         top: 0px; bottom: 0px; left: 0px; right: 0px;
142         z-index: 100;
143         background: gray;
144         opacity: 0.8;
145         text-align: center;
146         overflow: hidden;
147         display: none;
148         cursor: col-resize;
149 }
150
151 .panel-content-overlay {
152 }
153
154 .panel-wrap.last-panel .panel-content {
155         right: 0px;
156 }
157
158 .panel-wrap.last-panel .panel-slider {
159     display: none;
160 }
161
162 /* Toolbars with select box to change panel contents*/
163 .panel-toolbar {
164     position: absolute;
165     top: 0px; left:0px; right: 0px; height: 20px;
166
167     padding: 0 0 2px 0;
168     /* border-top: 1px solid #AAA; */
169     border-bottom: 1px solid #AAA;
170     font-size: 12px;
171     line-height: 20px;
172     background-color: #DDD;
173     white-space: nowrap;
174     overflow: hidden;
175     z-index: 80;
176 }
177
178 .panel-toolbar label {
179     display: block;
180     float: left;
181     margin: 0 10px 0 2px;
182 }
183
184 /* Slider between panels */
185 .panel-wrap .panel-slider {
186     position: absolute;
187         background-color: #DDD;
188
189     top: 0px; bottom: 0px; right: 0px; width: 4px;
190
191     border-left: 1px solid #999;
192     border-right: 1px solid #999;
193     border-top: none;
194     border-bottom: none;
195
196         z-index: 90;
197         cursor: col-resize;
198 }
199
200 .panel-wrap .panel-slider:hover {
201     background-color: #999;
202 }
203
204 .panel-content-overlay.panel-wrap .panel-slider {
205         background-color: #DDD;
206 }
207
208
209 /* ================= */
210 /* = Gallery panel = */
211 /* ================= */
212 .images-wrap {
213     overflow-x: hidden;
214     overflow-y: scroll;
215 }
216
217
218 /* ==================== */
219 /* = XML Editor panel = */
220 /* ==================== */
221
222 .toolbar {
223     overflow: hidden;
224     z-index: 70;
225 }
226
227 .toolbar, .toolbar ol {
228 /*    overflow: hidden;*/
229     display: block;
230     margin: 0;
231     padding: 0;
232     background-color: #CCC;
233     border-top: 1px solid #AAA;
234 }
235
236 .toolbar-tabs li {
237     font-size: 14px;
238     display: block;
239     float: left;
240     margin: 4px 0 -1px 4px;
241     padding: 2px 10px 0 10px;
242     background-color: #CCC;
243     border: 1px solid #AAA;
244     border-radius-topleft: 8px;
245     border-radius-topright: 8px;
246     -moz-border-radius-topleft: 8px;
247     -moz-border-radius-topright: 8px;
248     -webkit-border-top-left-radius: 8px;
249     -webkit-border-top-right-radius: 8px;
250 }
251
252 .toolbar-tabs {
253     height: 21px;
254 }
255
256 .toolbar-tabs li:hover, .toolbar-tabs li.active {
257     cursor: default;
258     background-color: #EEE;
259     border-bottom: 1px solid #EEE;
260 }
261
262 .toolbar-buttons {
263     background-color: #EEE;
264     border-bottom: 1px solid #AAA;
265     z-index: 71;
266 }
267
268 .toolbar-buttons li {
269     display: block;
270     font-size: 12px;
271     padding: 1px 8px;
272     margin: 4px;
273     border-radius: 10px;
274     -moz-border-radius: 10px;
275     -webkit-border-radius: 8px;
276     float: left;
277 }
278
279 .toolbar-buttons li:hover {
280     background-color: #777;
281     color: #FFF;
282     cursor: default;
283 }
284
285 .change-font-size {
286     width: 45px;
287     height: 18px;
288     padding: 3px 0 0;
289     position: absolute;
290     top: 0;
291     right: 0;
292 }
293
294 .change-font-size div {
295     float: left;
296     text-align: center;
297     width: 20px;
298     font-size: 13px;
299     margin: 1px;
300     cursor: default;
301     border-radius: 2px;
302     -moz-border-radius: 2px;
303     -webkit-border-radius: 2px;
304 }
305
306 .change-font-size div:hover {
307     background-color: #EEE;
308     border: 1px solid #AAA;
309     margin: 0;
310 }
311
312 /* =========================== */
313 /* = DublinCore Editor panel = */
314 /* =========================== */
315 .panel-dceditor {
316     padding: 10px;
317 }
318
319 .panel-dceditor label {
320     display: block;
321     font-size: 12px;
322     margin-top: 10px;
323     color: #666;
324     font-weight: bold;
325 }
326
327 .panel-dceditor input, .panel-dceditor textarea {
328     width: 400px;
329     display: block;
330 }
331
332 div.isection {
333         margin: 1em auto;
334         border: 1px solid black;
335         padding: 0.5em 2em;
336         background: #9f9ffa;
337
338         width: 60%;
339 }
340
341 div.isection p {
342         margin: 0.5em 1em;
343 }
344
345 .change-notification {
346     color: red;
347 }
348
349 /*
350  * Popups
351  */
352 #message-box {
353     position: fixed;
354     top: 2px;
355     left: 40%;   
356 }
357
358 .msg-error, .msg-success, .msg-warning {
359     overflow: hidden;
360     padding: 0.1em 0.2em;
361     text-align: center;
362     border: 1px solid;
363     -moz-border-radius: 8px;
364     -webkit-border-radius: 8px;
365     font-size: 10pt;
366     line-height: 11pt;
367     display: none;
368
369     width: 200px;
370 }
371
372
373 .msg-error {
374     background-color: red;
375     border-color: red;
376 }
377
378 .msg-success {
379     background-color: lightgreen;
380     border-color: lightgreen;
381 }
382
383 .msg-warning {
384     background-color: yellow;
385     border-color: yellow;
386     
387 }