Upgrade to ExtJS 4.0.0 - Released 04/26/2011
[extjs.git] / resources / themes / stylesheets / ext4 / default / widgets / form / _field.scss
diff --git a/resources/themes/stylesheets/ext4/default/widgets/form/_field.scss b/resources/themes/stylesheets/ext4/default/widgets/form/_field.scss
new file mode 100644 (file)
index 0000000..b792f03
--- /dev/null
@@ -0,0 +1,143 @@
+@mixin extjs-form-field {
+    .#{$prefix}form-field,
+    .#{$prefix}form-display-field {
+        float: left;
+        
+        margin: 0 0 0 0;
+        
+        font: $form-field-font;
+        color: $form-field-color;
+    }
+    
+    .#{$prefix}form-text,
+    textarea.#{$prefix}form-field {
+        padding: $form-field-padding;
+        
+        background: repeat-x 0 0;
+        border: $form-field-border-width solid;
+        
+        background-color: $form-field-background-color;
+        @if $form-field-background-image {
+            background-image: theme-image($theme-name, $form-field-background-image);
+        }
+        
+        border-color: $form-field-border-color;
+    }
+    
+    $form-field-content-height: $form-field-height - top($form-field-padding) - top($form-field-border-width) - bottom($form-field-padding) - bottom($form-field-border-width);
+
+    .#{$prefix}form-text {
+        height: $form-field-content-height;
+        line-height: $form-field-content-height;
+        vertical-align: middle;
+    }
+    
+    .#{$prefix}ie6,
+    .#{$prefix}ie7,
+    .#{$prefix}ie8 {
+        .#{$prefix}form-text {
+            line-height: $form-field-content-height - 3px;
+        }
+    }
+
+    .#{$prefix}border-box .#{$prefix}form-text {
+        height: $form-field-height;
+    }
+
+    textarea.#{$prefix}form-field {
+        color: $form-field-color;
+        overflow: auto;
+        height: auto;
+        line-height: normal;
+        background: repeat-x 0 0;
+        background-color: $form-field-background-color;
+        @if $form-field-background-image {
+            background-image: theme-image($theme-name, $form-field-background-image);
+        }
+        resize: none; //Disable browser resizable textarea
+    }
+
+    .#{$prefix}border-box textarea.#{$prefix}form-field {
+        height: auto;
+    }
+
+    @if $include-safari {
+        .#{$prefix}safari.#{$prefix}mac textarea.#{$prefix}form-field {
+            margin-bottom: -2px; // another bogus margin bug, safari/mac only
+        }
+    }
+
+    .#{$prefix}form-focus,
+    textarea.#{$prefix}form-focus {
+               border-color: $form-field-focus-border-color;
+    }
+    
+    .#{$prefix}form-invalid-field,
+    textarea.#{$prefix}form-invalid-field {
+        background-color: $form-field-invalid-background-color;
+        @if $form-field-invalid-background-image {
+            background-image: theme-image($theme-name, $form-field-invalid-background-image);
+            background-repeat: $form-field-invalid-background-repeat;
+            background-position: $form-field-invalid-background-position;
+        }
+        border-color: $form-field-invalid-border-color;
+    }
+    
+    .#{$prefix}form-item {
+        font: $form-label-font;
+    }
+
+    .#{$prefix}form-empty-field {
+        color: $form-field-empty-color;
+    }
+    
+    .#{$prefix}webkit {
+        .#{$prefix}form-empty-field {
+            line-height: 15px;
+        }
+    }
+    
+    .#{$prefix}form-display-field {
+        padding-top: 2px;
+    }
+
+    @if $include-ff {
+        .#{$prefix}gecko .#{$prefix}form-display-field {
+            padding-top: 1px;
+        }
+    }
+    
+    @if $include-ie {
+        .#{$prefix}ie .#{$prefix}form-file {
+            height: $form-field-height + 1;
+            
+            line-height: 18px;
+            
+            vertical-align: middle;
+        }
+
+        .#{$prefix}strict .#{$prefix}ie7 .#{$prefix}form-display-field {
+            padding-top: 1px;
+        }
+
+        .#{$prefix}ie .#{$prefix}form-display-field {
+            padding-top: 3px;
+        }
+
+        .#{$prefix}strict .#{$prefix}ie8 .#{$prefix}form-display-field {
+            padding-top: 0;
+        }
+    }
+    
+    .#{$prefix}field-default-toolbar .#{$prefix}form-text {
+        height: $form-toolbar-field-height - vertical($form-field-padding) - vertical($form-field-border-width);
+    }
+    
+    .#{$prefix}border-box .#{$prefix}field-default-toolbar .#{$prefix}form-text {
+        height: $form-toolbar-field-height;
+    }
+    
+    .#{$prefix}field-default-toolbar .#{$prefix}form-item-label-left {
+        padding-left: 4px;
+    }
+}
\ No newline at end of file