~azzar1/unity/add-show-desktop-key

« back to all changes in this revision

Viewing changes to www/media/common/edit_area/edit_area.css

  • Committer: mattgiuca
  • Date: 2008-01-15 06:17:23 UTC
  • Revision ID: svn-v3-trunk0:2b9c9e99-6f39-0410-b283-7f802c844ae2:trunk:233
Added a shaky implementation of EditArea as the text editor.
Installed the EditArea files in media/common.
FileBrowser app includes EditArea.
editor.js calls the appropriate methods to set up an EditArea and the Save
button saves its contents.

Show diffs side-by-side

added added

removed removed

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