js/jquery-te/jquery-te-1.4.0.css

   1 /*!\r
   2  *\r
   3  * jQuery TE 1.4.0 , http://jqueryte.com/\r
   4  * Copyright (C) 2013, Fatih Koca (fattih@fattih.com), (http://jqueryte.com/about)\r
   5 \r
   6  * jQuery TE is provided under the MIT LICENSE.\r
   7  *\r
   8 */\r
   9 \r
  10 /* editor's general field */\r
  11 .jqte {\r
  12         margin:30px 0;\r
  13         border:#000 1px solid;\r
  14         border-radius:5px; -webkit-border-radius:5px; -moz-border-radius:5px;\r
  15         box-shadow:0 0 3px #999; -webkit-box-shadow:0 0 3px #999; -moz-box-shadow:0 0 3px #999;\r
  16         overflow:hidden;\r
  17         transition:box-shadow 0.4s, border 0.4s; -webkit-transition:-webkit-box-shadow 0.4s, border 0.4s; -moz-transition:-moz-box-shadow 0.4s, border 0.4s; -o-transition:-o-box-shadow 0.4s, border 0.4s;\r
  18 }\r
  19 .jqte * {\r
  20         color:#333;\r
  21         font-family:Arial, Helvetica, sans-serif;\r
  22         font-size:14px;\r
  23 }\r
  24 .jqte_focused {\r
  25         border-color:#00AAE7;\r
  26         box-shadow:0 0 10px #00BDFF; -webkit-box-shadow:0 0 10px #00BDFF; -moz-box-shadow:0 0 10px #00BDFF;\r
  27 }\r
  28 /* toolbar */\r
  29 .jqte_toolbar {\r
  30         overflow:auto;\r
  31         padding:3px 4px;\r
  32         background:#EEE;\r
  33         border-bottom:#BBB 1px solid;\r
  34 }\r
  35 .jqte_tool {\r
  36         float:left;\r
  37         margin:0;\r
  38         padding:0;\r
  39         cursor:pointer;\r
  40 }\r
  41 .jqte_tool, .jqte_tool_icon, .jqte_tool_label {\r
  42         border:#EEE 1px solid;\r
  43         border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px\r
  44 }\r
  45 .jqte_hiddenField {\r
  46         display:none\r
  47 }\r
  48 .jqte_tool_icon {\r
  49         display:block;\r
  50         width:22px;\r
  51         height:22px;\r
  52         background:url(jquery-te.png) no-repeat\r
  53 }\r
  54 .jqte_tool.jqte_tool_1 .jqte_tool_label {\r
  55         position:relative;\r
  56         display:block;\r
  57         padding:3px;\r
  58         width:70px;\r
  59         height:16px;\r
  60         overflow:hidden;\r
  61 }\r
  62 .jqte_tool.jqte_tool_1 .jqte_tool_text {\r
  63         font:bold 13px Arial,sans-serif;\r
  64         color:#222;\r
  65 }\r
  66 .jqte_tool.jqte_tool_1 .jqte_tool_icon {\r
  67         position:absolute;\r
  68         top:10px;\r
  69         right:2px;\r
  70         width:6px;\r
  71         height:4px;\r
  72         background-position:-19px -23px;\r
  73         border:none;\r
  74         border-radius:none; -webkit-border-radius:none; -moz-border-radius:none\r
  75 }\r
  76 .jqte_tool.jqte_tool_2 .jqte_tool_icon {\r
  77         background-position:0 0\r
  78 }\r
  79 .jqte_tool.jqte_tool_3 .jqte_tool_icon {\r
  80         background-position:-22px 0\r
  81 }\r
  82 .jqte_tool.jqte_tool_4 .jqte_tool_icon {\r
  83         background-position:-44px 0\r
  84 }\r
  85 .jqte_tool.jqte_tool_5 .jqte_tool_icon {\r
  86         background-position:-66px 0\r
  87 }\r
  88 .jqte_tool.jqte_tool_6 .jqte_tool_icon {\r
  89         background-position:-88px 0\r
  90 }\r
  91 .jqte_tool.jqte_tool_7 .jqte_tool_icon {\r
  92         background-position:-110px 0\r
  93 }\r
  94 .jqte_tool.jqte_tool_8 .jqte_tool_icon {\r
  95         background-position:-132px 0\r
  96 }\r
  97 .jqte_tool.jqte_tool_9 .jqte_tool_icon {\r
  98         background-position:-154px 0\r
  99 }\r
 100 .jqte_tool.jqte_tool_10 .jqte_tool_icon {\r
 101         background-position:-176px 0\r
 102 }\r
 103 .jqte_tool.jqte_tool_11 .jqte_tool_icon {\r
 104         background-position:-198px 0\r
 105 }\r
 106 .jqte_tool.jqte_tool_12 .jqte_tool_icon {\r
 107         background-position:-220px 0\r
 108 }\r
 109 .jqte_tool.jqte_tool_13 .jqte_tool_icon {\r
 110         background-position:-242px 0\r
 111 }\r
 112 .jqte_tool.jqte_tool_14 .jqte_tool_icon {\r
 113         background-position:-264px 0\r
 114 }\r
 115 .jqte_tool.jqte_tool_15 .jqte_tool_icon {\r
 116         background-position:-286px 0\r
 117 }\r
 118 .jqte_tool.jqte_tool_16 .jqte_tool_icon {\r
 119         background-position:-308px 0\r
 120 }\r
 121 .jqte_tool.jqte_tool_17 .jqte_tool_icon {\r
 122         background-position:-330px 0\r
 123 }\r
 124 .jqte_tool.jqte_tool_18 .jqte_tool_icon {\r
 125         background-position:-352px 0\r
 126 }\r
 127 .jqte_tool.jqte_tool_19 .jqte_tool_icon {\r
 128         background-position:-374px 0\r
 129 }\r
 130 .jqte_tool.jqte_tool_20 .jqte_tool_icon {\r
 131         background-position:-396px 0\r
 132 }\r
 133 .jqte_tool.jqte_tool_21 .jqte_tool_icon {\r
 134         background-position:-418px 0\r
 135 }\r
 136 .jqte_tool:hover {\r
 137         background-color:#FFF;\r
 138         border-color:#FFF\r
 139 }\r
 140 .jqte_tool:hover .jqte_tool_icon, .jqte_tool:hover .jqte_tool_label {\r
 141         border:#AAA 1px solid\r
 142 }\r
 143 .jqte_tool:active .jqte_tool_icon, .jqte_tool:active .jqte_tool_label {\r
 144         border:#777 1px solid\r
 145 }\r
 146 .jqte_tool.jqte_tool_1:hover .jqte_tool_icon, .jqte_tool.jqte_tool_1:active .jqte_tool_icon {\r
 147         border:none\r
 148 }\r
 149 .jqte_tool_depressed {\r
 150         background-color:#DDD;\r
 151         border-color:#CCC\r
 152 }\r
 153 .jqte_tool_depressed .jqte_tool_icon {\r
 154         border-color:#AAA\r
 155 }\r
 156 .jqte_tool_depressed:hover {\r
 157         background-color:#EEE\r
 158 }\r
 159 /* link form area */\r
 160 .jqte_linkform {\r
 161         padding:5px 10px;\r
 162         background:#DDD;\r
 163         border-bottom:#BBB 1px solid;\r
 164 }\r
 165 .jqte_linktypeselect {\r
 166         position:relative;\r
 167         float:left;\r
 168         width:130px;\r
 169         background:#EEE;\r
 170         cursor:pointer\r
 171 }\r
 172 .jqte_linktypeselect:Active {\r
 173         background:#FFF\r
 174 }\r
 175 .jqte_linktypeview {\r
 176         padding:3px 5px;\r
 177         border:#333 1px solid;\r
 178         color:#777;\r
 179         border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px;\r
 180         outline:none\r
 181 }\r
 182 .jqte_linktypetext {\r
 183         font-size:12px;\r
 184 }\r
 185 .jqte_linktypearrow {\r
 186         position:absolute;\r
 187         bottom:8px; right:6px;\r
 188         width:7px;\r
 189         height:6px;\r
 190         margin:0 auto;\r
 191         background:url(jquery-te.png) -7px -23px no-repeat;\r
 192 }\r
 193 .jqte_linktypes {\r
 194         display:none;\r
 195         position:absolute;\r
 196         top:22px; left:1px;\r
 197         width:125px;\r
 198         background:#FFF;\r
 199         border:#333 1px solid;\r
 200         box-shadow:0 1px 4px #AAA; -webkit-box-shadow:0 1px 4px #AAA; -moz-box-shadow:0 1px 4px #AAA\r
 201 }\r
 202 .jqte_linktypes a {\r
 203         display:block;\r
 204         padding:4px 5px;\r
 205         font-size:12px;\r
 206 }\r
 207 .jqte_linktypes a:hover {\r
 208         background:#DDD\r
 209 }\r
 210 .jqte_linkinput {\r
 211         float:left;\r
 212         margin:0 5px;\r
 213         padding:3px 5px;\r
 214         width:300px;\r
 215         background:#EEE;\r
 216         border:#333 1px solid;\r
 217         color:#777;\r
 218         font-size:12px;\r
 219         border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px;\r
 220         outline:none;\r
 221 }\r
 222 .jqte_linkinput:focus, .jqte_linkinput:hover {\r
 223         background:#FFF;\r
 224         border-color:#000;\r
 225 }\r
 226 .jqte_linkbutton {\r
 227         float:left;\r
 228         padding:3px 12px;\r
 229         background:#AAA;\r
 230         border:#333 1px solid;\r
 231         color:#FFF;\r
 232         font-size:12px;\r
 233         font-weight:bold;\r
 234         cursor:pointer;\r
 235         border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px;\r
 236         box-shadow:inset 0 1px #EEE; -webkit-box-shadow:inset 0 1px #EEE; -moz-box-shadow:inset 0 1px #EEE;\r
 237 }\r
 238 .jqte_linkbutton:hover {\r
 239         background:#A1A1A1\r
 240 }\r
 241 .jqte_linkbutton:active {\r
 242         box-shadow:inset 0 1px #CCC; -webkit-box-shadow:inset 0 1px #CCC; -moz-box-shadow:inset 0 1px #CCC;\r
 243         background:#888;\r
 244 }\r
 245 \r
 246 /* text format menu */\r
 247 .jqte_formats {\r
 248         display:none;\r
 249         position:absolute;\r
 250         width:180px;\r
 251         oveflow-x:hidden;\r
 252         overflow-y:auto;\r
 253         background:#FFF;\r
 254         border:#AAA 1px solid;\r
 255         box-shadow:0 0 5px #AAA; -webkit-box-shadow:0 0 5px #AAA; -moz-box-shadow:0 0 5px #AAA;\r
 256         z-index:100;\r
 257 }\r
 258 .jqte_format {\r
 259         display:block;\r
 260         padding:4px 7px;\r
 261         font-size:13px\r
 262 }\r
 263 .jqte_format:hover {\r
 264         background:#DDD\r
 265 }\r
 266 .jqte_format_1, .jqte_format_2, .jqte_format_3, .jqte_format_4, .jqte_format_5, .jqte_format_6 {\r
 267         font-weight:bold\r
 268 }\r
 269 .jqte_format_1 {\r
 270         font-size:22px\r
 271 }\r
 272 .jqte_format_2 {\r
 273         font-size:20px\r
 274 }\r
 275 .jqte_format_3 {\r
 276         font-size:18px\r
 277 }\r
 278 .jqte_format_4 {\r
 279         font-size:16px\r
 280 }\r
 281 .jqte_format_5 {\r
 282         font-size:14px\r
 283 }\r
 284 .jqte_format_6 {\r
 285         font-size:12px\r
 286 }\r
 287 .jqte_format_7 {\r
 288         font-family:"Courier New", Courier, monospace\r
 289 }\r
 290 \r
 291 /* font size menu */\r
 292 .jqte_fontsizes {\r
 293         display:none;\r
 294         position:absolute;\r
 295         width:180px;\r
 296         height:198px;\r
 297         oveflow-x:hidden;\r
 298         overflow-y:auto;\r
 299         background:#FFF;\r
 300         border:#AAA 1px solid;\r
 301         box-shadow:0 0 5px #AAA; -webkit-box-shadow:0 0 5px #AAA; -moz-box-shadow:0 0 5px #AAA\r
 302 }\r
 303 .jqte_fontsize {\r
 304         display:block;\r
 305         padding:3px 7px;\r
 306 }\r
 307 .jqte_fontsize:hover {\r
 308         background:#DDD\r
 309 }\r
 310 \r
 311 /* color pallette */\r
 312 .jqte_cpalette {\r
 313         display:none;\r
 314         position:absolute;\r
 315         padding:6px;\r
 316         width:144px;\r
 317         background:#FFF;\r
 318         border:#AAA 1px solid;\r
 319         box-shadow:0 0 5px #AAA; -webkit-box-shadow:0 0 5px #AAA; -moz-box-shadow:0 0 5px #AAA\r
 320 }\r
 321 .jqte_color {\r
 322         display:block;\r
 323         float:left;\r
 324         width:16px;\r
 325         height:16px;\r
 326         border:#FFF 1px solid;\r
 327 }\r
 328 .jqte_color:hover {\r
 329         border-color:#000\r
 330 }\r
 331 .jqte_colorSeperator {\r
 332     float:none;\r
 333     clear:both;\r
 334     height:7px;\r
 335 }\r
 336 \r
 337 /* editor area */\r
 338 .jqte_editor, .jqte_source {\r
 339         padding:10px;\r
 340         background:#FFF;\r
 341         min-height:100px;\r
 342         max-height:900px;\r
 343         overflow:auto;\r
 344         outline:none;\r
 345         word-wrap:break-word; -ms-word-wrap:break-word;\r
 346         resize:vertical\r
 347 }\r
 348 .jqte_editor div, .jqte_editor p {\r
 349         margin:0 0 7px\r
 350 }\r
 351 .jqte_editor a:link, .jqte_editor a:link * {\r
 352         color:#0066FF !important;\r
 353         text-decoration:underline;\r
 354 }\r
 355 .jqte_editor blockquote {\r
 356         margin-top:0;\r
 357         margin-bottom:7px\r
 358 }\r
 359 .jqte_editor img {\r
 360     float:left;\r
 361         margin:0 10px 5px 0\r
 362 }\r
 363 .jqte_editor a[jqte-setlink], .jqte_editor a[jqte-setlink] * {\r
 364         background:#3297FD !important;\r
 365         color:#FFF !important\r
 366 }\r
 367 .jqte_editor h1, .jqte_editor h2, .jqte_editor h3, .jqte_editor h4, .jqte_editor h5, .jqte_editor h6, .jqte_editor pre {\r
 368         display:block;\r
 369         margin:0 0 3px;\r
 370 }\r
 371 .jqte_editor h1, .jqte_editor h1 * {\r
 372         font-size:26px\r
 373 }\r
 374 .jqte_editor h2, .jqte_editor h2 * {\r
 375         font-size:24px\r
 376 }\r
 377 .jqte_editor h3, .jqte_editor h3 * {\r
 378         font-size:22px\r
 379 }\r
 380 .jqte_editor h4, .jqte_editor h4 * {\r
 381         font-size:20px\r
 382 }\r
 383 .jqte_editor h5, .jqte_editor h5 * {\r
 384         font-size:18px\r
 385 }\r
 386 .jqte_editor h6, .jqte_editor h6 * {\r
 387         font-size:15px\r
 388 }\r
 389 .jqte_editor pre, .jqte_editor pre * {\r
 390         font-family:"Courier New", Courier, monospace\r
 391 }\r
 392 \r
 393 /* source area */\r
 394 .jqte_source, .jqte_source textarea {\r
 395         background:#FFF1E8\r
 396 }\r
 397 .jqte_source textarea {\r
 398         margin:0 !important;\r
 399         padding:0 !important;\r
 400         display:block !important;\r
 401         width:100% !important;\r
 402         min-height:100px;\r
 403         font-family:Courier, Arial, sans-serif !important;\r
 404         font-weight:normal;\r
 405         font-size:15px;\r
 406         overflow:hidden !important;\r
 407         outline:none;\r
 408         resize:none;\r
 409 }\r
 410 .jqte_source textarea, .jqte_source textarea:focus {\r
 411         css_shadow:none !important;\r
 412         background:none !important;\r
 413         border:none !important;\r
 414 }\r
 415 \r
 416 /* title box */\r
 417 .jqte_title {\r
 418         display:none;\r
 419         position:absolute;\r
 420         z-index:9999;\r
 421 }\r
 422 .jqte_titleArrow {\r
 423         position:relative;\r
 424 }\r
 425 .jqte_titleArrowIcon {\r
 426         width:7px;\r
 427         height:6px;\r
 428         margin:0 auto;\r
 429         background:url(jquery-te.png) 0 -23px no-repeat;\r
 430 }\r
 431 .jqte_titleText {\r
 432         padding:5px 7px;\r
 433         margin-top:0;\r
 434         min-width:5px;\r
 435         min-height:1px;\r
 436         max-width:400px;\r
 437         background:#000;\r
 438         border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px;\r
 439         word-wrap:break-word; -ms-word-wrap:break-word\r
 440 }\r
 441 .jqte_titleText, .jqte_titleText * {\r
 442         color:#FFF;\r
 443         font-size:11px\r
 444 }\r
 445 \r
 446 /* placeholder */\r
 447 .jqte_placeholder {\r
 448         position:relative;\r
 449         display:none;\r
 450 }\r
 451 .jqte_placeholder_text {\r
 452         position:absolute;\r
 453         top:43px;\r
 454         left:10px;\r
 455         font-size:14px;\r
 456         color:#CCC;\r
 457 }