1 <!-- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> -->
\r
2 <html xmlns="http://www.w3.org/1999/xhtml">
\r
4 <title>Template for dialogs</title>
\r
5 <link rel="stylesheet" type="text/css" href="skins/clearlooks2/window.css" />
\r
9 <div class="mceEditor">
\r
10 <div class="clearlooks2" style="width:400px; height:100px; left:10px;">
\r
11 <div class="mceWrapper">
\r
12 <div class="mceTop">
\r
13 <div class="mceLeft"></div>
\r
14 <div class="mceCenter"></div>
\r
15 <div class="mceRight"></div>
\r
19 <div class="mceMiddle">
\r
20 <div class="mceLeft"></div>
\r
21 <span>Content</span>
\r
22 <div class="mceRight"></div>
\r
25 <div class="mceBottom">
\r
26 <div class="mceLeft"></div>
\r
27 <div class="mceCenter"></div>
\r
28 <div class="mceRight"></div>
\r
29 <span>Statusbar text.</span>
\r
32 <a class="mceMove" href="#"></a>
\r
33 <a class="mceMin" href="#"></a>
\r
34 <a class="mceMax" href="#"></a>
\r
35 <a class="mceMed" href="#"></a>
\r
36 <a class="mceClose" href="#"></a>
\r
37 <a class="mceResize mceResizeN" href="#"></a>
\r
38 <a class="mceResize mceResizeS" href="#"></a>
\r
39 <a class="mceResize mceResizeW" href="#"></a>
\r
40 <a class="mceResize mceResizeE" href="#"></a>
\r
41 <a class="mceResize mceResizeNW" href="#"></a>
\r
42 <a class="mceResize mceResizeNE" href="#"></a>
\r
43 <a class="mceResize mceResizeSW" href="#"></a>
\r
44 <a class="mceResize mceResizeSE" href="#"></a>
\r
48 <div class="clearlooks2" style="width:400px; height:100px; left:420px;">
\r
49 <div class="mceWrapper mceMovable mceFocus">
\r
50 <div class="mceTop">
\r
51 <div class="mceLeft"></div>
\r
52 <div class="mceCenter"></div>
\r
53 <div class="mceRight"></div>
\r
54 <span>Focused</span>
\r
57 <div class="mceMiddle">
\r
58 <div class="mceLeft"></div>
\r
59 <span>Content</span>
\r
60 <div class="mceRight"></div>
\r
63 <div class="mceBottom">
\r
64 <div class="mceLeft"></div>
\r
65 <div class="mceCenter"></div>
\r
66 <div class="mceRight"></div>
\r
67 <span>Statusbar text.</span>
\r
70 <a class="mceMove" href="#"></a>
\r
71 <a class="mceMin" href="#"></a>
\r
72 <a class="mceMax" href="#"></a>
\r
73 <a class="mceMed" href="#"></a>
\r
74 <a class="mceClose" href="#"></a>
\r
75 <a class="mceResize mceResizeN" href="#"></a>
\r
76 <a class="mceResize mceResizeS" href="#"></a>
\r
77 <a class="mceResize mceResizeW" href="#"></a>
\r
78 <a class="mceResize mceResizeE" href="#"></a>
\r
79 <a class="mceResize mceResizeNW" href="#"></a>
\r
80 <a class="mceResize mceResizeNE" href="#"></a>
\r
81 <a class="mceResize mceResizeSW" href="#"></a>
\r
82 <a class="mceResize mceResizeSE" href="#"></a>
\r
86 <div class="clearlooks2" style="width:400px; height:100px; left:10px; top:120px;">
\r
87 <div class="mceWrapper mceMovable mceFocus mceStatusbar">
\r
88 <div class="mceTop">
\r
89 <div class="mceLeft"></div>
\r
90 <div class="mceCenter"></div>
\r
91 <div class="mceRight"></div>
\r
92 <span>Statusbar</span>
\r
95 <div class="mceMiddle">
\r
96 <div class="mceLeft"></div>
\r
97 <span>Content</span>
\r
98 <div class="mceRight"></div>
\r
101 <div class="mceBottom">
\r
102 <div class="mceLeft"></div>
\r
103 <div class="mceCenter"></div>
\r
104 <div class="mceRight"></div>
\r
105 <span>Statusbar text.</span>
\r
108 <a class="mceMove" href="#"></a>
\r
109 <a class="mceMin" href="#"></a>
\r
110 <a class="mceMax" href="#"></a>
\r
111 <a class="mceMed" href="#"></a>
\r
112 <a class="mceClose" href="#"></a>
\r
113 <a class="mceResize mceResizeN" href="#"></a>
\r
114 <a class="mceResize mceResizeS" href="#"></a>
\r
115 <a class="mceResize mceResizeW" href="#"></a>
\r
116 <a class="mceResize mceResizeE" href="#"></a>
\r
117 <a class="mceResize mceResizeNW" href="#"></a>
\r
118 <a class="mceResize mceResizeNE" href="#"></a>
\r
119 <a class="mceResize mceResizeSW" href="#"></a>
\r
120 <a class="mceResize mceResizeSE" href="#"></a>
\r
124 <div class="clearlooks2" style="width:400px; height:100px; left:420px; top:120px;">
\r
125 <div class="mceWrapper mceMovable mceFocus mceStatusbar mceResizable">
\r
126 <div class="mceTop">
\r
127 <div class="mceLeft"></div>
\r
128 <div class="mceCenter"></div>
\r
129 <div class="mceRight"></div>
\r
130 <span>Statusbar, Resizable</span>
\r
133 <div class="mceMiddle">
\r
134 <div class="mceLeft"></div>
\r
135 <span>Content</span>
\r
136 <div class="mceRight"></div>
\r
139 <div class="mceBottom">
\r
140 <div class="mceLeft"></div>
\r
141 <div class="mceCenter"></div>
\r
142 <div class="mceRight"></div>
\r
143 <span>Statusbar text.</span>
\r
146 <a class="mceMove" href="#"></a>
\r
147 <a class="mceMin" href="#"></a>
\r
148 <a class="mceMax" href="#"></a>
\r
149 <a class="mceMed" href="#"></a>
\r
150 <a class="mceClose" href="#"></a>
\r
151 <a class="mceResize mceResizeN" href="#"></a>
\r
152 <a class="mceResize mceResizeS" href="#"></a>
\r
153 <a class="mceResize mceResizeW" href="#"></a>
\r
154 <a class="mceResize mceResizeE" href="#"></a>
\r
155 <a class="mceResize mceResizeNW" href="#"></a>
\r
156 <a class="mceResize mceResizeNE" href="#"></a>
\r
157 <a class="mceResize mceResizeSW" href="#"></a>
\r
158 <a class="mceResize mceResizeSE" href="#"></a>
\r
162 <div class="clearlooks2" style="width:400px; height:100px; left:10px; top:230px;">
\r
163 <div class="mceWrapper mceMovable mceFocus mceResizable mceMaximizable">
\r
164 <div class="mceTop">
\r
165 <div class="mceLeft"></div>
\r
166 <div class="mceCenter"></div>
\r
167 <div class="mceRight"></div>
\r
168 <span>Resizable, Maximizable</span>
\r
171 <div class="mceMiddle">
\r
172 <div class="mceLeft"></div>
\r
173 <span>Content</span>
\r
174 <div class="mceRight"></div>
\r
177 <div class="mceBottom">
\r
178 <div class="mceLeft"></div>
\r
179 <div class="mceCenter"></div>
\r
180 <div class="mceRight"></div>
\r
181 <span>Statusbar text.</span>
\r
184 <a class="mceMove" href="#"></a>
\r
185 <a class="mceMin" href="#"></a>
\r
186 <a class="mceMax" href="#"></a>
\r
187 <a class="mceMed" href="#"></a>
\r
188 <a class="mceClose" href="#"></a>
\r
189 <a class="mceResize mceResizeN" href="#"></a>
\r
190 <a class="mceResize mceResizeS" href="#"></a>
\r
191 <a class="mceResize mceResizeW" href="#"></a>
\r
192 <a class="mceResize mceResizeE" href="#"></a>
\r
193 <a class="mceResize mceResizeNW" href="#"></a>
\r
194 <a class="mceResize mceResizeNE" href="#"></a>
\r
195 <a class="mceResize mceResizeSW" href="#"></a>
\r
196 <a class="mceResize mceResizeSE" href="#"></a>
\r
200 <div class="clearlooks2" style="width:400px; height:100px; left:420px; top:230px;">
\r
201 <div class="mceWrapper mceMovable mceStatusbar mceResizable mceMaximizable">
\r
202 <div class="mceTop">
\r
203 <div class="mceLeft"></div>
\r
204 <div class="mceCenter"></div>
\r
205 <div class="mceRight"></div>
\r
206 <span>Blurred, Maximizable, Statusbar, Resizable</span>
\r
209 <div class="mceMiddle">
\r
210 <div class="mceLeft"></div>
\r
211 <span>Content</span>
\r
212 <div class="mceRight"></div>
\r
215 <div class="mceBottom">
\r
216 <div class="mceLeft"></div>
\r
217 <div class="mceCenter"></div>
\r
218 <div class="mceRight"></div>
\r
219 <span>Statusbar text.</span>
\r
222 <a class="mceMove" href="#"></a>
\r
223 <a class="mceMin" href="#"></a>
\r
224 <a class="mceMax" href="#"></a>
\r
225 <a class="mceMed" href="#"></a>
\r
226 <a class="mceClose" href="#"></a>
\r
227 <a class="mceResize mceResizeN" href="#"></a>
\r
228 <a class="mceResize mceResizeS" href="#"></a>
\r
229 <a class="mceResize mceResizeW" href="#"></a>
\r
230 <a class="mceResize mceResizeE" href="#"></a>
\r
231 <a class="mceResize mceResizeNW" href="#"></a>
\r
232 <a class="mceResize mceResizeNE" href="#"></a>
\r
233 <a class="mceResize mceResizeSW" href="#"></a>
\r
234 <a class="mceResize mceResizeSE" href="#"></a>
\r
238 <div class="clearlooks2" style="width:400px; height:100px; left:10px; top:340px;">
\r
239 <div class="mceWrapper mceMovable mceFocus mceResizable mceMaximized mceMinimizable mceMaximizable">
\r
240 <div class="mceTop">
\r
241 <div class="mceLeft"></div>
\r
242 <div class="mceCenter"></div>
\r
243 <div class="mceRight"></div>
\r
244 <span>Maximized, Maximizable, Minimizable</span>
\r
247 <div class="mceMiddle">
\r
248 <div class="mceLeft"></div>
\r
249 <span>Content</span>
\r
250 <div class="mceRight"></div>
\r
253 <div class="mceBottom">
\r
254 <div class="mceLeft"></div>
\r
255 <div class="mceCenter"></div>
\r
256 <div class="mceRight"></div>
\r
257 <span>Statusbar text.</span>
\r
260 <a class="mceMove" href="#"></a>
\r
261 <a class="mceMin" href="#"></a>
\r
262 <a class="mceMax" href="#"></a>
\r
263 <a class="mceMed" href="#"></a>
\r
264 <a class="mceClose" href="#"></a>
\r
265 <a class="mceResize mceResizeN" href="#"></a>
\r
266 <a class="mceResize mceResizeS" href="#"></a>
\r
267 <a class="mceResize mceResizeW" href="#"></a>
\r
268 <a class="mceResize mceResizeE" href="#"></a>
\r
269 <a class="mceResize mceResizeNW" href="#"></a>
\r
270 <a class="mceResize mceResizeNE" href="#"></a>
\r
271 <a class="mceResize mceResizeSW" href="#"></a>
\r
272 <a class="mceResize mceResizeSE" href="#"></a>
\r
276 <div class="clearlooks2" style="width:400px; height:100px; left:420px; top:340px;">
\r
277 <div class="mceWrapper mceMovable mceStatusbar mceResizable mceMaximized mceMinimizable mceMaximizable">
\r
278 <div class="mceTop">
\r
279 <div class="mceLeft"></div>
\r
280 <div class="mceCenter"></div>
\r
281 <div class="mceRight"></div>
\r
282 <span>Blured</span>
\r
285 <div class="mceMiddle">
\r
286 <div class="mceLeft"></div>
\r
287 <span>Content</span>
\r
288 <div class="mceRight"></div>
\r
291 <div class="mceBottom">
\r
292 <div class="mceLeft"></div>
\r
293 <div class="mceCenter"></div>
\r
294 <div class="mceRight"></div>
\r
295 <span>Statusbar text.</span>
\r
298 <a class="mceMove" href="#"></a>
\r
299 <a class="mceMin" href="#"></a>
\r
300 <a class="mceMax" href="#"></a>
\r
301 <a class="mceMed" href="#"></a>
\r
302 <a class="mceClose" href="#"></a>
\r
303 <a class="mceResize mceResizeN" href="#"></a>
\r
304 <a class="mceResize mceResizeS" href="#"></a>
\r
305 <a class="mceResize mceResizeW" href="#"></a>
\r
306 <a class="mceResize mceResizeE" href="#"></a>
\r
307 <a class="mceResize mceResizeNW" href="#"></a>
\r
308 <a class="mceResize mceResizeNE" href="#"></a>
\r
309 <a class="mceResize mceResizeSW" href="#"></a>
\r
310 <a class="mceResize mceResizeSE" href="#"></a>
\r
314 <div class="clearlooks2" style="width:400px; height:130px; left:10px; top:450px;">
\r
315 <div class="mceWrapper mceMovable mceFocus mceModal mceAlert">
\r
316 <div class="mceTop">
\r
317 <div class="mceLeft"></div>
\r
318 <div class="mceCenter"></div>
\r
319 <div class="mceRight"></div>
\r
323 <div class="mceMiddle">
\r
324 <div class="mceLeft"></div>
\r
326 This is a very long error message. This is a very long error message.
\r
327 This is a very long error message. This is a very long error message.
\r
328 This is a very long error message. This is a very long error message.
\r
329 This is a very long error message. This is a very long error message.
\r
330 This is a very long error message. This is a very long error message.
\r
331 This is a very long error message. This is a very long error message.
\r
333 <div class="mceRight"></div>
\r
334 <div class="mceIcon"></div>
\r
337 <div class="mceBottom">
\r
338 <div class="mceLeft"></div>
\r
339 <div class="mceCenter"></div>
\r
340 <div class="mceRight"></div>
\r
343 <a class="mceMove" href="#"></a>
\r
344 <a class="mceButton mceOk" href="#">Ok</a>
\r
345 <a class="mceClose" href="#"></a>
\r
349 <div class="clearlooks2" style="width:400px; height:130px; left:420px; top:450px;">
\r
350 <div class="mceWrapper mceMovable mceFocus mceModal mceConfirm">
\r
351 <div class="mceTop">
\r
352 <div class="mceLeft"></div>
\r
353 <div class="mceCenter"></div>
\r
354 <div class="mceRight"></div>
\r
355 <span>Confirm</span>
\r
358 <div class="mceMiddle">
\r
359 <div class="mceLeft"></div>
\r
361 This is a very long error message. This is a very long error message.
\r
362 This is a very long error message. This is a very long error message.
\r
363 This is a very long error message. This is a very long error message.
\r
364 This is a very long error message. This is a very long error message.
\r
365 This is a very long error message. This is a very long error message.
\r
366 This is a very long error message. This is a very long error message.
\r
368 <div class="mceRight"></div>
\r
369 <div class="mceIcon"></div>
\r
372 <div class="mceBottom">
\r
373 <div class="mceLeft"></div>
\r
374 <div class="mceCenter"></div>
\r
375 <div class="mceRight"></div>
\r
378 <a class="mceMove" href="#"></a>
\r
379 <a class="mceButton mceOk" href="#">Ok</a>
\r
380 <a class="mceButton mceCancel" href="#">Cancel</a>
\r
381 <a class="mceClose" href="#"></a>
\r