philo/contrib/gilbert/static/gilbert/murano/sass/murano/components/_datepicker.scss

   1 .x-datepicker{
   2         background-color: #000;
   3         @include background-image(linear-gradient(#333, #000));
   4         border-left:1px solid #000;
   5         border-right:1px solid #000;
   6 }
   7 .x-datepicker-prev, .x-datepicker-next{
   8         position:absolute;
   9         top:8px;
  10         left:5px;
  11         a{
  12                 display:block;
  13                 height:15px;
  14                 width:15px;
  15                 background: theme-image($theme-name, 'shared/btn-left.png');
  16         }
  17 }
  18 .x-datepicker-next{
  19         right:5px;
  20         left:auto;
  21         a{
  22                 background: theme-image($theme-name, 'shared/btn-right.png');
  23         }
  24 }
  25 .x-datepicker-header, .x-datepicker-footer{
  26         @include background-image(linear-gradient(#333, #111));
  27         border-bottom:1px solid #000;
  28         border-top:1px solid #444;
  29         padding:3px 28px;
  30         text-align:center;
  31 }
  32 .x-datepicker-inner{
  33         font-size:inherit;
  34         margin-bottom:0;
  35         width:100%;
  36         th, td{
  37                 text-align:center;
  38         }
  39         thead{
  40                 border-top:1px solid #777;
  41                 color:#CCC;
  42                 @include background-image(linear-gradient(#666, #444));
  43                 border-bottom:1px solid #222;
  44         }
  45         table-layout: fixed;
  46 }
  47
  48 .x-datepicker-inner a{
  49         display:block;
  50         text-decoration:none;
  51         color:#CCC;
  52         border:1px solid transparent;
  53         em, span{
  54                 display:block;
  55         }
  56         em{
  57                 border:1px solid transparent;
  58         }
  59 }
  60 .x-datepicker-prevday a{
  61         color: #666;
  62 }
  63 .x-datepicker-today span{
  64         background-color:#555;
  65         @include border-radius(2px);
  66 }
  67 .x-datepicker-selected a{
  68         border-color:bla(.25);
  69         em{
  70                 border-color:$accent-color;
  71                 border-top-color:lighten($accent-color, 20%);
  72                 border-bottom-color:darken($accent-color, 10%);
  73         }
  74         span{
  75                 @include background-image($gloss-gradient);
  76                 color:#FFF;
  77                 @include border-radius(0);
  78         }
  79 }
  80
  81 .x-monthpicker{
  82         background:#000;
  83         a{
  84                 text-decoration:none;
  85                 color:#CCC;
  86         }
  87         font-size:11px;
  88 }
  89 .x-monthpicker-years{
  90         width:88px;
  91         float:right;
  92 }
  93 .x-monthpicker-months{
  94         width:87px;
  95         float:left;
  96         border-right:1px solid #444;
  97 }
  98 .x-monthpicker-item{
  99         width:43px;
 100         float:left;
 101         margin:4px 0;
 102         text-align:center;
 103         a{
 104                 display:block;
 105                 border:1px solid transparent;
 106                 &:hover{
 107                         background-color:#333;
 108                 }
 109                 margin:0 3px;
 110                 padding:2px 0;
 111                 @include border-radius(3px);
 112         }
 113         .x-monthpicker-selected{
 114                 background-color:#333;
 115                 border:1px solid #555;
 116                 border-top-color:#999;
 117                 border-bottom-color:#444;
 118                 @include background-image($gloss-gradient);
 119                 color:#FFF;
 120         }
 121 }
 122 .x-monthpicker-yearnav-prev, .x-monthpicker-yearnav-next{
 123         margin:6px 12px 6px 15px;
 124         float:left;
 125         display:block;
 126         height:15px;
 127         width:15px;
 128         background: theme-image($theme-name, 'shared/btn-left.png');
 129 }
 130 .x-monthpicker-yearnav-next{
 131         background: theme-image($theme-name, 'shared/btn-right.png');
 132 }
 133 .x-monthpicker .x-btn{
 134         width:80px;
 135         float:left;
 136         margin:4px;
 137 }
 138 .x-monthpicker-buttons{
 139         border-top:1px solid #777;
 140         @include background-image(linear-gradient(#666, #444));
 141         padding:2px 1px;
 142         @include clearfix;
 143 }
 144
 145 .x-datepicker-footer{
 146         @include background-image(linear-gradient(#666, #444));
 147         border-top-color:#777;
 148         border-bottom-color:#222;
 149 }