/trunk/Kona.Web/Scripts/edit_area/edit_area.css

  1body, html{
  2	margin: 0; 
  3	padding: 0;
  4	height: 100%;
  5	border: none;
  6	overflow: hidden;
  7	background-color: #FFF;
  8}
  9
 10body, html, table, form, textarea{
 11	font: 12px monospace, sans-serif;
 12}
 13
 14#editor{
 15	border: solid #888 1px;
 16	overflow: visible;
 17}
 18
 19#result{
 20	z-index: 4; 
 21	overflow-x: auto;
 22	overflow-y: scroll;
 23	border-top: solid #888 1px;
 24	border-bottom: solid #888 1px;
 25	position: relative;
 26	clear: both;
 27}
 28
 29#result.empty{
 30	overflow: hidden;
 31}
 32
 33#container{
 34	overflow: hidden;
 35	border: solid blue 0;
 36	position: relative; 
 37	z-index: 10;
 38	padding: 0 5px 0 45px;
 39	/*padding-right: 5px;*/ 
 40}
 41
 42#textarea{
 43	position: relative; 
 44	top: 0; 
 45	left: 0;
 46	margin: 0;
 47	padding: 0;
 48	width: 100%;
 49	height: 100%; 
 50	overflow: hidden;  
 51	z-index: 7; 
 52	border-width: 0;
 53	background-color: transparent;
 54}
 55
 56#textarea, #textarea:hover{
 57	outline: none;	/* safari outline fix */
 58}
 59
 60#content_highlight{
 61	white-space: pre;
 62	margin: 0;
 63	padding: 0;
 64	position : absolute; 
 65	z-index: 4; 
 66	overflow: visible;
 67}
 68
 69
 70#selection_field{
 71	margin: 0; 
 72	background-color: #E1F2F9; 
 73	height: 1px;  
 74	position: absolute;
 75	z-index: 5;
 76	top: -100px;
 77	padding: 0;
 78	white-space: pre;
 79	overflow: hidden;
 80}
 81
 82#selection_field.show_colors{
 83	z-index: 3;
 84	background-color:#EDF9FC;
 85	color:transparent;
 86}
 87
 88#container.wrap_text #content_highlight, #container.wrap_text #selection_field{
 89	white-space: pre-wrap;       /* css-3 */
 90	white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */
 91	white-space: -pre-wrap;      /* Opera 4-6 */
 92	white-space: -o-pre-wrap;    /* Opera 7 */
 93	word-wrap: break-word;       /* Internet Explorer 5.5+ */
 94	width: 99%;
 95}
 96
 97#line_number{
 98	position: absolute;
 99	overflow: hidden;
100	border-right: solid black 1px;
101	z-index:8;
102	width: 38px;
103	padding: 0 5px 0 0;
104	margin: 0 0 0 -45px;
105	text-align: right;
106	color: #AAAAAA;
107}
108
109#test_font_size{
110	padding: 0; 
111	margin: 0; 
112	visibility: hidden;
113	position: absolute;
114	white-space: pre;
115}
116
117pre{
118	margin: 0;
119	padding: 0;
120}
121
122.hidden{
123	opacity: 0.2; 
124	filter:alpha(opacity=20);
125}
126
127#result .edit_area_cursor{
128	position: absolute; 
129	z-index:6; 
130	background-color: #FF6633;
131	top: -100px;
132	margin: 1px 0 0 0;
133}
134
135#result .edit_area_selection_field .overline{
136	background-color: #996600;
137}
138
139
140/* area popup */
141.editarea_popup{
142	border: solid 1px #888888;
143	background-color: #ECE9D8; 
144	width: 250px; 
145	padding: 4px; 
146	position: absolute;
147	visibility: hidden; 
148	z-index: 15;
149	top: -500px;
150}
151
152.editarea_popup, .editarea_popup table{
153	font-family: sans-serif;
154	font-size: 10pt;
155}
156
157.editarea_popup img{
158	border: 0;
159}
160
161.editarea_popup .close_popup{
162	float: right; 
163	line-height: 16px; 
164	border: 0; 
165	padding: 0;
166}
167
168.editarea_popup h1,.editarea_popup h2,.editarea_popup h3,.editarea_popup h4,.editarea_popup h5,.editarea_popup h6{
169	margin: 0;
170	padding: 0;
171}
172
173.editarea_popup .copyright{
174	text-align: right;
175}	
176
177/* Area_search */
178div#area_search_replace{
179	/*width: 250px;*/
180}
181
182div#area_search_replace img{
183	border: 0;
184}
185
186div#area_search_replace div.button{
187	text-align: center;
188	line-height: 1.7em;
189}
190
191div#area_search_replace .button a{
192	cursor: pointer;
193	border: solid 1px #888888;
194	background-color: #DEDEDE;
195	text-decoration: none;
196	padding: 0 2px;
197	color: #000000;	
198	white-space: nowrap;
199}
200
201div#area_search_replace a:hover{	
202	/*border: solid 1px #888888;*/
203	background-color: #EDEDED;
204}
205
206div#area_search_replace  #move_area_search_replace{
207	cursor: move; 
208	border: solid 1px #888;
209}
210
211div#area_search_replace  #close_area_search_replace{
212	text-align: right; 
213	vertical-align: top; 
214	white-space: nowrap;
215}
216
217div#area_search_replace  #area_search_msg{
218	height: 18px; 
219	overflow: hidden; 
220	border-top: solid 1px #888; 
221	margin-top: 3px;
222}
223
224/* area help */
225#edit_area_help{
226	width: 350px;
227}
228
229#edit_area_help div.close_popup{
230	float: right;
231}
232
233/* area_toolbar */
234.area_toolbar{
235	/*font: 11px sans-serif;*/
236	width: 100%; 
237	/*height: 21px; */
238	margin: 0; 
239	padding: 0;
240	background-color: #ECE9D8;
241	text-align: center;
242}
243
244.area_toolbar, .area_toolbar table{
245	font: 11px sans-serif;
246}
247
248.area_toolbar img{
249	border: 0;
250	vertical-align: middle;
251}
252
253.area_toolbar input{
254	margin: 0;
255	padding: 0;
256}
257
258.area_toolbar select{
259    font-family: 'MS Sans Serif',sans-serif,Verdana,Arial;
260    font-size: 7pt;
261    font-weight: normal;
262    margin: 2px 0 0 0 ;
263    padding: 0;
264    vertical-align: top;
265    background-color: #F0F0EE;
266}
267
268table.statusbar{
269	width: 100%;
270}
271
272.area_toolbar td.infos{
273	text-align: center;
274	width: 130px;
275	border-right: solid 1px #888;
276	border-width: 0 1px 0 0;
277	padding: 0;
278}
279
280.area_toolbar td.total{
281	text-align: right;
282	width: 50px;
283	padding: 0;
284}
285
286.area_toolbar td.resize{
287	text-align: right;
288}
289/*
290.area_toolbar span{
291	line-height: 1px;
292	padding: 0;
293	margin: 0;
294}*/
295
296.area_toolbar span#resize_area{
297	cursor: nw-resize;
298	visibility: hidden;
299}
300
301/* toolbar buttons */
302.editAreaButtonNormal, .editAreaButtonOver, .editAreaButtonDown, .editAreaSeparator, .editAreaSeparatorLine, .editAreaButtonDisabled, .editAreaButtonSelected {
303	border: 0; margin: 0; padding: 0; background: transparent;
304	margin-top: 0;
305	margin-left: 1px;
306	padding: 0;
307}
308
309.editAreaButtonNormal {
310	border: 1px solid #ECE9D8 !important;
311	cursor: pointer;
312}
313
314.editAreaButtonOver {
315	border: 1px solid #0A246A !important;
316	cursor: pointer;
317	background-color: #B6BDD2;
318}
319
320.editAreaButtonDown {
321	cursor: pointer;
322	border: 1px solid #0A246A !important;
323	background-color: #8592B5;
324}
325
326.editAreaButtonSelected {
327	border: 1px solid #C0C0BB !important;
328	cursor: pointer;
329	background-color: #F4F2E8;
330}
331
332.editAreaButtonDisabled {
333	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=30);
334	-moz-opacity:0.3;
335	opacity: 0.3;
336	border: 1px solid #F0F0EE !important;
337	cursor: pointer;
338}
339
340.editAreaSeparatorLine {
341	margin: 1px 2px;
342	background-color: #C0C0BB;
343	width: 2px;
344	height: 18px;
345}
346
347/* waiting screen */
348#processing{
349	display: none; 
350	background-color:#ECE9D8; 
351	border: solid #888 1px;
352	position: absolute; 
353	top: 0; 
354	left: 0;
355	width: 100%; 
356	height: 100%; 
357	z-index: 100; 
358	text-align: center;
359}
360
361#processing_text{
362	position:absolute;
363	left: 50%;
364	top: 50%;
365	width: 200px;
366	height: 20px; 
367	margin-left: -100px;
368	margin-top: -10px;
369	text-align: center;
370}
371/* end */
372
373
374/**** tab browsing area ****/
375#tab_browsing_area{
376	display: none;
377	background-color: #CCC9A8;
378	border-top: 1px solid #888;
379	text-align: left;
380	margin: 0;
381}
382
383#tab_browsing_list {
384	padding: 0; 
385	margin: 0; 
386	list-style-type: none;
387	white-space: nowrap;
388}
389#tab_browsing_list li {
390	float: left;
391	margin: -1px;
392}
393#tab_browsing_list a {
394	position: relative;
395	display: block; 
396	text-decoration: none; 
397	float: left; 
398	cursor: pointer;
399	line-height:14px;
400}
401
402#tab_browsing_list a span {
403	display: block; 
404	color: #000; 
405	background: #ECE9D8; 
406	border:	1px solid #888; 
407	border-width: 1px 1px 0; 
408	text-align: center; 
409	padding: 2px 2px 1px 4px; 
410	position: relative;	/*IE 6 hack */
411}
412
413#tab_browsing_list a b {
414	display: block; 
415	border-bottom: 2px solid #617994;
416}
417
418#tab_browsing_list a .edited {
419	display: none;
420}
421
422#tab_browsing_list a.edited .edited {
423	display: inline;
424}
425
426#tab_browsing_list a img{
427	margin-left: 7px;
428}
429
430#tab_browsing_list a.edited img{
431	margin-left: 3px;
432}
433
434#tab_browsing_list a:hover span {
435	background: #F4F2E8;
436	border-color: #0A246A;
437}
438
439#tab_browsing_list .selected a span{
440	background: #046380;
441	color: #FFF;
442}
443
444
445#no_file_selected{
446	height: 100%;
447	width: 150%; /* Opera need more than 100% */
448	background: #CCC;
449	display: none;
450	z-index: 20;
451	position: absolute;
452}
453
454
455/*** Non-editable mode ***/
456.non_editable #editor
457{
458	border-width: 0 1px;
459}
460
461.non_editable .area_toolbar
462{
463	display: none;
464}
465
466/*** Auto completion ***/
467#auto_completion_area
468{
469	background:	#FFF;
470	border:		solid 1px #888;
471	position:	absolute;
472	z-index:	15;
473	width:	280px;
474	height:	180px;
475	overflow: auto;
476	display:none;
477}
478
479#auto_completion_area a, #auto_completion_area a:visited
480{
481	display:	block;
482	padding:	0 2px 1px;
483	color:		#000;
484	text-decoration:none;
485}
486
487#auto_completion_area a:hover, #auto_completion_area a:focus, #auto_completion_area a.focus
488{
489	background:	#D6E1FE;
490	text-decoration:none;
491}
492
493#auto_completion_area ul
494{
495	margin:	0;
496	padding: 0;
497	list-style: none inside;
498}
499#auto_completion_area li
500{
501	padding:	0;
502}
503#auto_completion_area .prefix
504{
505	font-style: italic;
506	padding: 0 3px;
507}