annotate onlypaths/theme/css/form.css @ 75:874a6a2c28cf laserkard

session with nick. redisigned faq page
author Robert McIntyre <rlm@mit.edu>
date Tue, 29 Jun 2010 15:36:30 -0400
parents 26c2b3ad21c7
children
rev   line source
rlm@46 1 /*
rlm@46 2 * Ext JS Library 2.1
rlm@46 3 * Copyright(c) 2006-2008, Ext JS, LLC.
rlm@46 4 * licensing@extjs.com
rlm@46 5 *
rlm@46 6 * http://extjs.com/license
rlm@46 7 */
rlm@46 8
rlm@46 9 /* all fields */
rlm@46 10 .x-form-field{
rlm@46 11 margin: 0 0 0 0;
rlm@46 12 font:normal 12px tahoma, arial, helvetica, sans-serif;
rlm@46 13 }
rlm@46 14
rlm@46 15 /* ---- text fields ---- */
rlm@46 16 .x-form-text, textarea.x-form-field{
rlm@46 17 padding:1px 3px;
rlm@46 18 background:#fff url(../images/default/form/text-bg.gif) repeat-x 0 0;
rlm@46 19 border:1px solid #B5B8C8;
rlm@46 20 }
rlm@46 21 textarea.x-form-field {
rlm@46 22 padding:2px 3px;
rlm@46 23 }
rlm@46 24 .x-form-text {
rlm@46 25 height:22px;
rlm@46 26 line-height:18px;
rlm@46 27 vertical-align:middle;
rlm@46 28 }
rlm@46 29 .ext-ie .x-form-text {
rlm@46 30 margin:-1px 0; /* ie bogus margin bug */
rlm@46 31 height:22px; /* ie quirks */
rlm@46 32 line-height:18px;
rlm@46 33 }
rlm@46 34 .ext-ie textarea.x-form-field {
rlm@46 35 margin:-1px 0; /* ie bogus margin bug */
rlm@46 36 }
rlm@46 37 .ext-strict .x-form-text {
rlm@46 38 height:18px;
rlm@46 39 }
rlm@46 40 .ext-safari .x-form-text {
rlm@46 41 height:20px; /* safari always same size */
rlm@46 42 padding:0 3px; /* remove extra top/bottom padding */
rlm@46 43 }
rlm@46 44 .ext-safari.ext-mac textarea.x-form-field {
rlm@46 45 margin-bottom:-2px; /* another bogus margin bug, safari/mac only */
rlm@46 46 }
rlm@46 47 .ext-gecko .x-form-text {
rlm@46 48 padding-top:2px; /* FF won't center the text vertically */
rlm@46 49 padding-bottom:0;
rlm@46 50 }
rlm@46 51 textarea {
rlm@46 52 resize: none; /* Disable browser resizable textarea */
rlm@46 53 }
rlm@46 54
rlm@46 55 /* select boxes */
rlm@46 56
rlm@46 57 .x-form-select-one {
rlm@46 58 height:20px;
rlm@46 59 line-height:18px;
rlm@46 60 vertical-align:middle;
rlm@46 61 background-color:#fff; /* opera */
rlm@46 62 border: 1px solid #B5B8C8;
rlm@46 63 }
rlm@46 64
rlm@46 65 /* multi select boxes */
rlm@46 66
rlm@46 67 /* --- TODO --- */
rlm@46 68
rlm@46 69 /* checkboxes */
rlm@46 70
rlm@46 71 /* --- TODO --- */
rlm@46 72
rlm@46 73 /* radios */
rlm@46 74
rlm@46 75 /* --- TODO --- */
rlm@46 76
rlm@46 77
rlm@46 78 /* wrapped fields and triggers */
rlm@46 79
rlm@46 80 .x-form-field-wrap {
rlm@46 81 position:relative;
rlm@46 82 zoom:1;
rlm@46 83 white-space: nowrap;
rlm@46 84 }
rlm@46 85
rlm@46 86 .x-editor .x-form-check-wrap {
rlm@46 87 background:#fff;
rlm@46 88 }
rlm@46 89 .x-form-field-wrap .x-form-trigger{
rlm@46 90 width:17px;
rlm@46 91 height:21px;
rlm@46 92 border:0;
rlm@46 93 background:transparent url(../images/default/form/trigger.gif) no-repeat 0 0;
rlm@46 94 cursor:pointer;
rlm@46 95 border-bottom: 1px solid #B5B8C8;
rlm@46 96 position:absolute;
rlm@46 97 top:0;
rlm@46 98 }
rlm@46 99 .ext-safari .x-form-field-wrap .x-form-trigger{
rlm@46 100 height:21px; /* safari doesn't allow height adjustments to the fields, so adjust trigger */
rlm@46 101 }
rlm@46 102
rlm@46 103 .x-form-field-wrap .x-form-date-trigger{
rlm@46 104 background-image: url(../images/default/form/date-trigger.gif);
rlm@46 105 cursor:pointer;
rlm@46 106 }
rlm@46 107 .x-form-field-wrap .x-form-clear-trigger{
rlm@46 108 background-image: url(../images/default/form/clear-trigger.gif);
rlm@46 109 cursor:pointer;
rlm@46 110 }
rlm@46 111 .x-form-field-wrap .x-form-search-trigger{
rlm@46 112 background-image: url(../images/default/form/search-trigger.gif);
rlm@46 113 cursor:pointer;
rlm@46 114 }
rlm@46 115 .ext-safari .x-form-field-wrap .x-form-trigger{
rlm@46 116 right:0;
rlm@46 117 }
rlm@46 118 .x-form-field-wrap .x-form-twin-triggers{
rlm@46 119
rlm@46 120 }
rlm@46 121 .x-form-field-wrap .x-form-twin-triggers .x-form-trigger{
rlm@46 122 position:static;
rlm@46 123 top:auto;
rlm@46 124 vertical-align:top;
rlm@46 125 }
rlm@46 126
rlm@46 127
rlm@46 128 .x-form-field-wrap .x-form-trigger-over{
rlm@46 129 background-position:-17px 0;
rlm@46 130 }
rlm@46 131 .x-form-field-wrap .x-form-trigger-click{
rlm@46 132 background-position:-34px 0;
rlm@46 133 }
rlm@46 134
rlm@46 135 .x-trigger-wrap-focus .x-form-trigger{
rlm@46 136 background-position:-51px 0;
rlm@46 137 }
rlm@46 138 .x-trigger-wrap-focus .x-form-trigger-over{
rlm@46 139 background-position:-68px 0;
rlm@46 140 }
rlm@46 141 .x-trigger-wrap-focus .x-form-trigger-click{
rlm@46 142 background-position:-85px 0;
rlm@46 143 }
rlm@46 144 .x-trigger-wrap-focus .x-form-trigger{
rlm@46 145 border-bottom: 1px solid #7eadd9;
rlm@46 146 }
rlm@46 147
rlm@46 148 .x-item-disabled .x-form-trigger-over{
rlm@46 149 background-position:0 0 !important;
rlm@46 150 border-bottom: 1px solid #B5B8C8;
rlm@46 151 }
rlm@46 152 .x-item-disabled .x-form-trigger-click{
rlm@46 153 background-position:0 0 !important;
rlm@46 154 border-bottom: 1px solid #B5B8C8;
rlm@46 155 }
rlm@46 156
rlm@46 157 /* field focus style */
rlm@46 158 .x-form-focus, textarea.x-form-focus{
rlm@46 159 border: 1px solid #7eadd9;
rlm@46 160 }
rlm@46 161
rlm@46 162 /* invalid fields */
rlm@46 163 .x-form-invalid, textarea.x-form-invalid{
rlm@46 164 background:#fff url(../images/default/grid/invalid_line.gif) repeat-x bottom;
rlm@46 165 border: 1px solid #dd7870;
rlm@46 166 }
rlm@46 167 .ext-safari .x-form-invalid{
rlm@46 168 background-color:#ffeeee;
rlm@46 169 border: 1px solid #ff7870;
rlm@46 170 }
rlm@46 171
rlm@46 172 /* editors */
rlm@46 173
rlm@46 174 .x-editor {
rlm@46 175 visibility:hidden;
rlm@46 176 padding:0;
rlm@46 177 margin:0;
rlm@46 178 }
rlm@46 179 .x-form-check-wrap {
rlm@46 180 line-height:18px;
rlm@46 181 }
rlm@46 182 .ext-ie .x-form-check-wrap input {
rlm@46 183 width:15px;
rlm@46 184 height:15px;
rlm@46 185 }
rlm@46 186 .x-editor .x-form-check-wrap {
rlm@46 187 padding:3px;
rlm@46 188 }
rlm@46 189 .x-editor .x-form-checkbox {
rlm@46 190 height:13px;
rlm@46 191 }
rlm@46 192 /* If you override the default field font above, you would need to change this font as well */
rlm@46 193 .x-form-grow-sizer {
rlm@46 194 font:normal 12px tahoma, arial, helvetica, sans-serif;
rlm@46 195 left: -10000px;
rlm@46 196 padding: 8px 3px;
rlm@46 197 position: absolute;
rlm@46 198 visibility:hidden;
rlm@46 199 top: -10000px;
rlm@46 200 white-space: pre-wrap;
rlm@46 201 white-space: -moz-pre-wrap;
rlm@46 202 white-space: -pre-wrap;
rlm@46 203 white-space: -o-pre-wrap;
rlm@46 204 word-wrap: break-word;
rlm@46 205 zoom:1;
rlm@46 206 }
rlm@46 207 .x-form-grow-sizer p {
rlm@46 208 margin:0 !important;
rlm@46 209 border:0 none !important;
rlm@46 210 padding:0 !important;
rlm@46 211 }
rlm@46 212 /* Form Items CSS */
rlm@46 213
rlm@46 214 .x-form-item {
rlm@46 215 font:normal 12px tahoma, arial, helvetica, sans-serif;
rlm@46 216 display:block;
rlm@46 217 margin-bottom:4px;
rlm@46 218 zoom:1;
rlm@46 219 }
rlm@46 220
rlm@46 221 .x-form-item label {
rlm@46 222 display:block;
rlm@46 223 float:left;
rlm@46 224 width:100px;
rlm@46 225 padding:3px;
rlm@46 226 padding-left:0;
rlm@46 227 clear:left;
rlm@46 228 z-index:2;
rlm@46 229 position:relative;
rlm@46 230 }
rlm@46 231
rlm@46 232 .x-form-element {
rlm@46 233 padding-left:105px;
rlm@46 234 position:relative;
rlm@46 235 }
rlm@46 236
rlm@46 237 .x-form-invalid-msg {
rlm@46 238 color:#ee0000;
rlm@46 239 padding:2px;
rlm@46 240 padding-left:18px;
rlm@46 241 font:normal 11px tahoma, arial, helvetica, sans-serif;
rlm@46 242 background: transparent url(../images/default/shared/warning.gif) no-repeat 0 2px;
rlm@46 243 line-height:16px;
rlm@46 244 width:200px;
rlm@46 245 }
rlm@46 246
rlm@46 247
rlm@46 248 .x-form-label-right label {
rlm@46 249 text-align:right;
rlm@46 250 }
rlm@46 251
rlm@46 252 .x-form-label-top .x-form-item label {
rlm@46 253 width:auto;
rlm@46 254 float:none;
rlm@46 255 clear:none;
rlm@46 256 display:inline;
rlm@46 257 margin-bottom:4px;
rlm@46 258 position:static;
rlm@46 259 }
rlm@46 260
rlm@46 261 .x-form-label-top .x-form-element {
rlm@46 262 padding-left:0;
rlm@46 263 padding-top:4px;
rlm@46 264 }
rlm@46 265
rlm@46 266 .x-form-label-top .x-form-item {
rlm@46 267 padding-bottom:4px;
rlm@46 268 }
rlm@46 269
rlm@46 270 .x-form-empty-field {
rlm@46 271 color:gray;
rlm@46 272 }
rlm@46 273 /* Editor small font for grid, toolbar and tree */
rlm@46 274 .x-small-editor .x-form-field {
rlm@46 275 font:normal 11px arial, tahoma, helvetica, sans-serif;
rlm@46 276 }
rlm@46 277 .x-small-editor .x-form-text {
rlm@46 278 height:20px;
rlm@46 279 line-height:16px;
rlm@46 280 vertical-align:middle;
rlm@46 281 }
rlm@46 282 .ext-ie .x-small-editor .x-form-text {
rlm@46 283 margin-top:-1px !important; /* ie bogus margin bug */
rlm@46 284 margin-bottom:-1px !important;
rlm@46 285 height:20px !important; /* ie quirks */
rlm@46 286 line-height:16px !important;
rlm@46 287 }
rlm@46 288 .ext-strict .x-small-editor .x-form-text {
rlm@46 289 height:16px !important;
rlm@46 290 }
rlm@46 291
rlm@46 292 .ext-safari .x-small-editor .x-form-field {
rlm@46 293 /* safari text field will not size so needs bigger font */
rlm@46 294 font:normal 12px arial, tahoma, helvetica, sans-serif;
rlm@46 295 }
rlm@46 296 .ext-ie .x-small-editor .x-form-text {
rlm@46 297 height:20px;
rlm@46 298 line-height:16px;
rlm@46 299 }
rlm@46 300 .ext-border-box .x-small-editor .x-form-text {
rlm@46 301 height:20px;
rlm@46 302 }
rlm@46 303
rlm@46 304 .x-small-editor .x-form-select-one {
rlm@46 305 height:20px;
rlm@46 306 line-height:16px;
rlm@46 307 vertical-align:middle;
rlm@46 308 }
rlm@46 309 .x-small-editor .x-form-num-field {
rlm@46 310 text-align:right;
rlm@46 311 }
rlm@46 312 .x-small-editor .x-form-field-wrap .x-form-trigger{
rlm@46 313 height:19px;
rlm@46 314 }
rlm@46 315
rlm@46 316
rlm@46 317 .x-form-clear {
rlm@46 318 clear:both;
rlm@46 319 height:0;
rlm@46 320 overflow:hidden;
rlm@46 321 line-height:0;
rlm@46 322 font-size:0;
rlm@46 323 }
rlm@46 324 .x-form-clear-left {
rlm@46 325 clear:left;
rlm@46 326 height:0;
rlm@46 327 overflow:hidden;
rlm@46 328 line-height:0;
rlm@46 329 font-size:0;
rlm@46 330 }
rlm@46 331
rlm@46 332 .x-form-cb-label {
rlm@46 333 width:'auto' !important;
rlm@46 334 float:none !important;
rlm@46 335 clear:none !important;
rlm@46 336 display:inline !important;
rlm@46 337 margin-left:4px;
rlm@46 338 }
rlm@46 339
rlm@46 340 .x-form-column {
rlm@46 341 float:left;
rlm@46 342 padding:0;
rlm@46 343 margin:0;
rlm@46 344 width:48%;
rlm@46 345 overflow:hidden;
rlm@46 346 zoom:1;
rlm@46 347 }
rlm@46 348
rlm@46 349 /* buttons */
rlm@46 350 .x-form .x-form-btns-ct .x-btn{
rlm@46 351 float:right;
rlm@46 352 clear:none;
rlm@46 353 }
rlm@46 354 .x-form .x-form-btns-ct .x-form-btns td {
rlm@46 355 border:0;
rlm@46 356 padding:0;
rlm@46 357 }
rlm@46 358 .x-form .x-form-btns-ct .x-form-btns-right table{
rlm@46 359 float:right;
rlm@46 360 clear:none;
rlm@46 361 }
rlm@46 362 .x-form .x-form-btns-ct .x-form-btns-left table{
rlm@46 363 float:left;
rlm@46 364 clear:none;
rlm@46 365 }
rlm@46 366 .x-form .x-form-btns-ct .x-form-btns-center{
rlm@46 367 text-align:center; /*ie*/
rlm@46 368 }
rlm@46 369 .x-form .x-form-btns-ct .x-form-btns-center table{
rlm@46 370 margin:0 auto; /*everyone else*/
rlm@46 371 }
rlm@46 372 .x-form .x-form-btns-ct table td.x-form-btn-td{
rlm@46 373 padding:3px;
rlm@46 374 }
rlm@46 375
rlm@46 376 .x-form .x-form-btns-ct .x-btn-focus .x-btn-left{
rlm@46 377 background-position:0 -147px;
rlm@46 378 }
rlm@46 379 .x-form .x-form-btns-ct .x-btn-focus .x-btn-right{
rlm@46 380 background-position:0 -168px;
rlm@46 381 }
rlm@46 382 .x-form .x-form-btns-ct .x-btn-focus .x-btn-center{
rlm@46 383 background-position:0 -189px;
rlm@46 384 }
rlm@46 385
rlm@46 386 .x-form .x-form-btns-ct .x-btn-click .x-btn-center{
rlm@46 387 background-position:0 -126px;
rlm@46 388 }
rlm@46 389 .x-form .x-form-btns-ct .x-btn-click .x-btn-right{
rlm@46 390 background-position:0 -84px;
rlm@46 391 }
rlm@46 392 .x-form .x-form-btns-ct .x-btn-click .x-btn-left{
rlm@46 393 background-position:0 -63px;
rlm@46 394 }
rlm@46 395 .x-form-invalid-icon {
rlm@46 396 width:16px;
rlm@46 397 height:18px;
rlm@46 398 visibility:hidden;
rlm@46 399 position:absolute;
rlm@46 400 left:0;
rlm@46 401 top:0;
rlm@46 402 display:block;
rlm@46 403 background:transparent url(../images/default/form/exclamation.gif) no-repeat 0 2px;
rlm@46 404 }
rlm@46 405
rlm@46 406 /* fieldsets */
rlm@46 407 .x-fieldset {
rlm@46 408 border:1px solid #B5B8C8;
rlm@46 409 padding:10px;
rlm@46 410 margin-bottom:10px;
rlm@46 411 display:block; /* preserve margins in IE */
rlm@46 412 }
rlm@46 413 .x-fieldset legend {
rlm@46 414 font:bold 11px tahoma, arial, helvetica, sans-serif;
rlm@46 415 color:#15428b;
rlm@46 416 }
rlm@46 417 .ext-ie .x-fieldset legend {
rlm@46 418 margin-bottom:10px;
rlm@46 419 }
rlm@46 420 .ext-ie .x-fieldset {
rlm@46 421 padding-top: 0;
rlm@46 422 padding-bottom:10px;
rlm@46 423 }
rlm@46 424 .x-fieldset legend .x-tool-toggle {
rlm@46 425 margin-right:3px;
rlm@46 426 margin-left:0;
rlm@46 427 float:left !important;
rlm@46 428 }
rlm@46 429 .x-fieldset legend input {
rlm@46 430 margin-right:3px;
rlm@46 431 float:left !important;
rlm@46 432 height:13px;
rlm@46 433 width:13px;
rlm@46 434 }
rlm@46 435 fieldset.x-panel-collapsed {
rlm@46 436 padding-bottom:0 !important;
rlm@46 437 border-width: 1px 0 0 0 !important;
rlm@46 438 }
rlm@46 439 fieldset.x-panel-collapsed .x-fieldset-bwrap {
rlm@46 440 visibility:hidden;
rlm@46 441 position:absolute;
rlm@46 442 left:-1000px;
rlm@46 443 top:-1000px;
rlm@46 444 }
rlm@46 445 .ext-ie .x-fieldset-bwrap {
rlm@46 446 zoom:1;
rlm@46 447 }
rlm@46 448 .ext-ie td .x-form-text {
rlm@46 449 position:relative;
rlm@46 450 top:-1px;
rlm@46 451 }
rlm@46 452 .x-fieldset-noborder {
rlm@46 453 border:0px none transparent;
rlm@46 454 }
rlm@46 455 .x-fieldset-noborder legend {
rlm@46 456 margin-left:-3px;
rlm@46 457 }
rlm@46 458 /* IE legend positioing bug */
rlm@46 459 .ext-ie .x-fieldset-noborder legend {
rlm@46 460 position: relative;
rlm@46 461 margin-bottom:23px;
rlm@46 462 }
rlm@46 463 .ext-ie .x-fieldset-noborder legend span {
rlm@46 464 position: absolute;
rlm@46 465 left:-5px;
rlm@46 466 }
rlm@46 467
rlm@46 468 .ext-gecko .x-window-body .x-form-item {
rlm@46 469 -moz-outline: none;
rlm@46 470 overflow: auto;
rlm@46 471 }
rlm@46 472
rlm@46 473 .ext-gecko .x-form-item {
rlm@46 474 -moz-outline: none;
rlm@46 475 }
rlm@46 476
rlm@46 477 .x-hide-label label.x-form-item-label {
rlm@46 478 display:none;
rlm@46 479 }
rlm@46 480 .x-hide-label .x-form-element {
rlm@46 481 padding-left: 0 !important;
rlm@46 482 }
rlm@46 483
rlm@46 484 .x-fieldset {
rlm@46 485 overflow:hidden;
rlm@46 486 }
rlm@46 487
rlm@46 488 .x-fieldset-bwrap {
rlm@46 489 overflow:hidden;
rlm@46 490 zoom:1;
rlm@46 491 }
rlm@46 492
rlm@46 493 .x-fieldset-body {
rlm@46 494 overflow:hidden;
rlm@46 495 }