Upgrade to ExtJS 3.2.2 - Released 06/02/2010
[extjs.git] / resources / css / structure / form.css
index 20bfa43..a923b20 100644 (file)
@@ -1,6 +1,6 @@
 /*!
- * Ext JS Library 3.0.0
- * Copyright(c) 2006-2009 Ext JS, LLC
+ * Ext JS Library 3.2.2
+ * Copyright(c) 2006-2010 Ext JS, Inc.
  * licensing@extjs.com
  * http://www.extjs.com/license
  */
@@ -48,15 +48,21 @@ textarea.x-form-field {
     margin-bottom:-2px; /* another bogus margin bug, safari/mac only */
 }
 
+/*
 .ext-strict .ext-ie8 .x-form-text, .ext-strict .ext-ie8 textarea.x-form-field {
-       margin-bottom: 1px;
+    margin-bottom: 1px;
 }
+*/
 
 .ext-gecko .x-form-text , .ext-ie8 .x-form-text {
     padding-top:2px; /* FF won't center the text vertically */
     padding-bottom:0;
 }
 
+.ext-ie6 .x-form-composite .x-form-text.x-box-item, .ext-ie7 .x-form-composite .x-form-text.x-box-item {
+    margin: 0 !important; /* clear ie bogus margin bug fix */
+}
+
 textarea {
     resize: none;  /* Disable browser resizable textarea */
 }
@@ -76,6 +82,7 @@ textarea {
 /* 2.0.2 style */
 .x-form-check-wrap {
     line-height:18px;
+    height: auto;
 }
 
 .ext-ie .x-form-check-wrap input {
@@ -83,6 +90,10 @@ textarea {
     height:15px;
 }
 
+.x-form-check-wrap input{
+    vertical-align: bottom;
+}
+
 .x-editor .x-form-check-wrap {
     padding:3px;
 }
@@ -114,10 +125,6 @@ textarea {
     cursor:pointer;
 }
 
-.ext-safari .x-form-field-wrap .x-form-trigger{
-    right:0;
-}
-
 .x-form-field-wrap .x-form-twin-triggers .x-form-trigger{
     position:static;
     top:auto;
@@ -127,10 +134,15 @@ textarea {
 .x-form-field-wrap {
     position:relative;
     left:0;top:0;
+    text-align: left;
     zoom:1;
     white-space: nowrap;
 }
 
+.ext-strict .ext-ie8 .x-toolbar-cell .x-form-field-trigger-wrap .x-form-trigger {
+    right: 0; /* IE8 Strict mode trigger bug */
+}
+
 .x-form-field-wrap .x-form-trigger-over{
     background-position:-17px 0;
 }
@@ -171,21 +183,17 @@ textarea {
 
 /* field focus style */
 .x-form-focus, textarea.x-form-focus{
-       border: 1px solid;
+    border: 1px solid;
 }
 
 /* invalid fields */
 .x-form-invalid, textarea.x-form-invalid{
-       background:repeat-x bottom;
-       border: 1px solid;
-}
-
-.ext-safari .x-form-invalid{
-       border: 1px solid;
+    background:repeat-x bottom;
+    border: 1px solid;
 }
 
 .x-form-inner-invalid, textarea.x-form-inner-invalid{
-       background:repeat-x bottom;
+    background:repeat-x bottom;
 }
 
 /* editors */
@@ -194,31 +202,14 @@ textarea {
     padding:0;
     margin:0;
 }
-.x-form-check-wrap {
-    height: 22px;
-    line-height:18px;
-}
-
-.ext-ie .x-form-check-wrap input {
-    width:15px;
-    height:15px;
-}
-
-.x-editor .x-form-check-wrap {
-    padding:3px;
-}
-
-.x-editor .x-form-checkbox {
-    height:13px;
-}
 
 .x-form-grow-sizer {
     left: -10000px;
-       padding: 8px 3px;
+    padding: 8px 3px;
     position: absolute;
     visibility:hidden;
     top: -10000px;
-       white-space: pre-wrap;
+    white-space: pre-wrap;
     white-space: -moz-pre-wrap;
     white-space: -pre-wrap;
     white-space: -o-pre-wrap;
@@ -240,7 +231,7 @@ textarea {
     zoom:1;
 }
 
-.x-form-item label {
+.x-form-item label.x-form-item-label {
     display:block;
     float:left;
     width:100px;
@@ -264,15 +255,15 @@ textarea {
     width:200px;
 }
 
-.x-form-label-left label {
+.x-form-label-left label.x-form-item-label {
    text-align:left;
 }
 
-.x-form-label-right label {
+.x-form-label-right label.x-form-item-label {
    text-align:right;
 }
 
-.x-form-label-top .x-form-item label {
+.x-form-label-top .x-form-item label.x-form-item-label {
     width:auto;
     float:none;
     clear:none;
@@ -331,6 +322,10 @@ textarea {
     height:19px;
 }
 
+.ext-webkit .x-small-editor .x-form-field-wrap .x-form-trigger{
+    height:21px;
+}
+
 .ext-webkit .x-small-editor .x-form-text{padding-top:3px;font-size:100%;}
 
 .x-form-clear {
@@ -348,30 +343,38 @@ textarea {
     font-size:0;
 }
 
+.ext-ie6 .x-form-check-wrap input, .ext-border-box .x-form-check-wrap input{
+   margin-top: 3px;
+}
+
 .x-form-cb-label {
-    width:auto !important;
-    float:none !important;
-    clear:none !important;
-    display:inline !important;
+    position: relative;
     margin-left:4px;
-    top: -2px;
+    top: 2px;
 }
 
-.ext-gecko2 .x-form-cb-label{
-    top: -1px;
+.ext-ie .x-form-cb-label{
+    top: 1px;
 }
 
-.ext-ie8 .x-form-cb-label{
-    position: static;
+.ext-ie6 .x-form-cb-label, .ext-border-box .x-form-cb-label{
+    top: 3px;
 }
 
-.ext-strict .ext-ie8 .x-form-cb-label {
-    top: -3px;
-    position: relative;
+.x-form-display-field{
+    padding-top: 2px;
+}
+
+.ext-gecko .x-form-display-field, .ext-strict .ext-ie7 .x-form-display-field{
+    padding-top: 1px;
 }
 
-.ext-opera .x-form-cb-label, .ext-safari3 .x-form-cb-label, .ext-ie7 .x-form-cb-label, .ext-ie6 .x-form-cb-label {
-    top: 0;
+.ext-ie .x-form-display-field{
+    padding-top: 3px;
+}
+
+.ext-strict .ext-ie8 .x-form-display-field{
+    padding-top: 0;
 }
 
 .x-form-column {
@@ -385,59 +388,59 @@ textarea {
 
 /* buttons */
 .x-form .x-form-btns-ct .x-btn{
-       float:right;
-       clear:none;
+    float:right;
+    clear:none;
 }
 
 .x-form .x-form-btns-ct .x-form-btns td {
-       border:0;
-       padding:0;
+    border:0;
+    padding:0;
 }
 
 .x-form .x-form-btns-ct .x-form-btns-right table{
-       float:right;
-       clear:none;
+    float:right;
+    clear:none;
 }
 
 .x-form .x-form-btns-ct .x-form-btns-left table{
-       float:left;
-       clear:none;
+    float:left;
+    clear:none;
 }
 
 .x-form .x-form-btns-ct .x-form-btns-center{
-       text-align:center; /*ie*/
+    text-align:center; /*ie*/
 }
 
 .x-form .x-form-btns-ct .x-form-btns-center table{
-       margin:0 auto; /*everyone else*/
+    margin:0 auto; /*everyone else*/
 }
 
 .x-form .x-form-btns-ct table td.x-form-btn-td{
-       padding:3px;
+    padding:3px;
 }
 
 .x-form .x-form-btns-ct .x-btn-focus .x-btn-left{
-       background-position:0 -147px;
+    background-position:0 -147px;
 }
 
 .x-form .x-form-btns-ct .x-btn-focus .x-btn-right{
-       background-position:0 -168px;
+    background-position:0 -168px;
 }
 
 .x-form .x-form-btns-ct .x-btn-focus .x-btn-center{
-       background-position:0 -189px;
+    background-position:0 -189px;
 }
 
 .x-form .x-form-btns-ct .x-btn-click .x-btn-center{
-       background-position:0 -126px;
+    background-position:0 -126px;
 }
 
 .x-form .x-form-btns-ct .x-btn-click  .x-btn-right{
-       background-position:0 -84px;
+    background-position:0 -84px;
 }
 
 .x-form .x-form-btns-ct .x-btn-click .x-btn-left{
-       background-position:0 -63px;
+    background-position:0 -63px;
 }
 
 .x-form-invalid-icon {
@@ -462,7 +465,7 @@ textarea {
 /* make top of checkbox/tools visible in webkit */
 .ext-webkit .x-fieldset-header {
     padding-top: 1px;
-}        
+}
 
 .ext-ie .x-fieldset legend {
     margin-bottom:10px;
@@ -491,8 +494,8 @@ fieldset.x-panel-collapsed {
     border-width: 1px 1px 0 1px !important;
     border-left-color: transparent;
     border-right-color: transparent;
-}      
-  
+}
+
 .ext-ie6 fieldset.x-panel-collapsed{
     padding-bottom:0 !important;
     border-width: 1px 0 0 0 !important;
@@ -519,7 +522,7 @@ fieldset.x-panel-collapsed .x-fieldset-bwrap {
     margin-left:-3px;
 }
 
-/* IE legend positioing bug */
+/* IE legend positioning bug */
 .ext-ie .x-fieldset-noborder legend {
     position: relative;
     margin-bottom:23px;
@@ -528,14 +531,20 @@ fieldset.x-panel-collapsed .x-fieldset-bwrap {
     position: absolute;
     left:16px;
 }
-        
+
 .ext-gecko .x-window-body .x-form-item {
     -moz-outline: none;
+    outline: none;
     overflow: auto;
 }
 
+.ext-mac.ext-gecko .x-window-body .x-form-item {
+    overflow:hidden;
+}
+
 .ext-gecko .x-form-item {
     -moz-outline: none;
+    outline: none;
 }
 
 .x-hide-label label.x-form-item-label {
@@ -546,6 +555,10 @@ fieldset.x-panel-collapsed .x-fieldset-bwrap {
      padding-left: 0 !important;
 }
 
+.x-form-label-top .x-hide-label label.x-form-item-label{
+    display: none;
+}
+
 .x-fieldset {
     overflow:hidden;
 }
@@ -558,5 +571,3 @@ fieldset.x-panel-collapsed .x-fieldset-bwrap {
 .x-fieldset-body {
     overflow:hidden;
 }
-
-