src/resources/themes/stylesheets/sencha-touch/default/src/picker/_Picker.scss

   1 /**
   2  * @class Ext.picker.Picker
   3  */
   4
   5 .x-picker .x-picker-inner {
   6     background-color: #fff;
   7     overflow: hidden;
   8     margin: $sheet-padding;
   9
  10     @if $include-border-radius {
  11         @include border-radius($picker-sheet-radius);
  12     }
  13     @include background-clip(padding-box);
  14
  15     @if $include-picker-highlights {
  16         background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#bbbbbb), color-stop(30%,#ffffff), color-stop(70%,#ffffff), color-stop(100%,#bbbbbb));
  17         background: -webkit-linear-gradient(top,  #bbbbbb 0%,#ffffff 30%,#ffffff 70%,#bbbbbb 100%);
  18     }
  19 }
  20
  21 .x-picker-slot .x-scroll-view {
  22     @if $include-highlights {
  23         @include box-shadow(rgba(#000,.4) -1px 0 1px);
  24     }
  25
  26     &:first-child {
  27         @include box-shadow(none);
  28     }
  29 }
  30
  31 .x-picker-bar {
  32     border-top: .12em solid $picker-active-border-color;
  33     border-bottom: .12em solid $picker-active-border-color;
  34     height: $picker-row-height;
  35     @include background-gradient(hsla(hue($active-color), 90, 50, .3), $picker-bar-gradient);
  36
  37     @if $include-highlights {
  38         @include box-shadow(rgba(#000,0.2) 0 .2em .2em);
  39     }
  40 }
  41
  42 .x-use-titles {
  43     .x-picker-bar {
  44         margin-top: 1.5em;
  45     }
  46 }
  47
  48 .x-picker-slot-title {
  49     height: 1.5em;
  50     border-top: 1px solid $picker-title-bg-color;
  51     border-bottom: 1px solid darken($picker-title-bg-color, 20%);
  52     padding: 0.2em 1.02em;
  53
  54     @include box-shadow(rgba(0, 0, 0, 0.3) 0px .1em .3em);
  55     @include background-gradient($picker-title-bg-color, $picker-title-bg-gradient);
  56
  57     > div {
  58         font-size: 0.8em;
  59         color: $picker-title-color;
  60         @if $include-picker-highlights {
  61             @include bevel-text('light');
  62         }
  63     }
  64 }
  65
  66 .x-picker-slot {
  67     border-left: 2px solid #acacac;
  68
  69     .x-dataview-item {
  70         height: $picker-row-height;
  71         line-height: $picker-row-height;
  72         font-weight: bold;
  73         padding: 0 10px;
  74     }
  75
  76     &:first-child {
  77         border-left: 0;
  78     }
  79 }