Upgrade to ExtJS 4.0.2 - Released 06/09/2011

[extjs.git] / resources / themes / stylesheets / ext4 / default / widgets / _datepicker.scss

diff --git a/resources/themes/stylesheets/ext4/default/widgets/_datepicker.scss b/resources/themes/stylesheets/ext4/default/widgets/_datepicker.scss
index adcf3ee..459409c 100644 (file)
--- a/resources/themes/stylesheets/ext4/default/widgets/_datepicker.scss
+++ b/resources/themes/stylesheets/ext4/default/widgets/_datepicker.scss
@@ -53,6 +53,8 @@
             cursor: pointer;
             
             text-decoration: none !important;
+
+            @include opacity(.7);
             
             &:hover {
                 @include opacity(1);
@@ -64,7 +66,7 @@
         right: 5px;
 
         a {
-            background-image: theme-image($theme-name, $datepicker-next-image);
+            @include theme-background-image($theme-name, $datepicker-next-image);
         }
     }
 
@@ -72,7 +74,7 @@
         left: 5px;
 
         a {
-            background-image: theme-image($theme-name, $datepicker-prev-image);
+            @include theme-background-image($theme-name, $datepicker-prev-image);
         }
     }      
             
@@ -104,7 +106,8 @@
         }
         
         .#{$prefix}btn-split-right {
-            background: theme-image($theme-name, $datepicker-month-arrow-image) no-repeat right center !important;
+            background: no-repeat right center !important;
+            @include theme-background-image($theme-name, $datepicker-month-arrow-image);
             
             padding-right: 12px;
         }
@@ -253,14 +256,15 @@
     }
 
     // month picker
-    .#{$prefix}monthpicker {
+    .#{$prefix}datepicker .#{$prefix}monthpicker {
         position: absolute;
         left: 0;
         top: 0;
-        
+    }
+    
+    
+    .#{$prefix}monthpicker {        
         border: $datepicker-border;
-        //
-        
         background-color: $datepicker-background-color;
     }
 
@@ -291,6 +295,10 @@
             
             margin: 0 5px 0 5px;
             
+            text-decoration: none;
+            
+            color: $datepicker-monthpicker-item-color;
+            
             border: $datepicker-monthpicker-item-border;
             
             line-height: 17px;
@@ -319,7 +327,7 @@
         height: 28px;
         
         button {
-            background-image: theme-image($theme-name, $datepicker-tool-sprite-image);
+            @include theme-background-image($theme-name, $datepicker-tool-sprite-image);
             height: 15px;
             width: 15px;
             padding: 0;
@@ -353,6 +361,20 @@
         background-position: -15px -105px;
     }
     
+    .#{$prefix}monthpicker-small {
+        .#{$prefix}monthpicker-item {
+            margin: 2px 0 2px 0;
+        }
+        
+        .#{$prefix}monthpicker-yearnav {
+            height: 23px;
+        }
+        
+        .#{$prefix}monthpicker-months, .#{$prefix}monthpicker-years {
+            height: 136px;
+        }
+    }
+    
     @if $include-ie {
         .#{$prefix}quirks {
             .#{$prefix}ie7,
@@ -363,6 +385,16 @@
                     }
                 }
             }
+            
+            .#{$prefix}monthpicker-small .#{$prefix}monthpicker-yearnav button {
+                margin-top: 3px;
+                margin-bottom: 3px;
+            }
+        }
+        
+        .#{$prefix}ie6 .#{$prefix}monthpicker-small .#{$prefix}monthpicker-yearnav button {
+            margin-top: 3px;
+            margin-bottom: 3px;
         }
     }
 
@@ -371,7 +403,7 @@
         .#{$prefix}nlg {
             @if $datepicker-header-background-gradient != null {
                 .#{$prefix}datepicker-header {
-                    background-image: theme-image($theme-name, 'datepicker/datepicker-header-bg.gif');
+                    @include theme-background-image($theme-name, 'datepicker/datepicker-header-bg.gif');
                     background-repeat: repeat-x;
                     background-position: top left;
                 }
@@ -380,7 +412,7 @@
             @if $datepicker-footer-background-gradient != null {
                 .#{$prefix}datepicker-footer,
                 .#{$prefix}monthpicker-buttons {
-                    background-image: theme-image($theme-name, 'datepicker/datepicker-footer-bg.gif');
+                    @include theme-background-image($theme-name, 'datepicker/datepicker-footer-bg.gif');
                     background-repeat: repeat-x;
                     background-position: top left;
                 }