src/themes/tizen/common/jquery.mobile.tizen.scrollview.less

   1 @import "config.less";
   2
   3 .ui-scrollview-clip {
   4         position: relative;
   5 }
   6
   7 .ui-scrollview-view {
   8 }
   9
  10 .ui-scrolllistview .ui-li-divider {
  11         z-index: 10;
  12 }
  13
  14 .ui-scrollbar {
  15         position: absolute;
  16         overflow: hidden;
  17
  18         opacity: 0;
  19 }
  20
  21 .ui-scrollbar-visible {
  22         opacity: 1;
  23 }
  24
  25 .ui-scrollbar-y {
  26         top: 2 * @unit_base;
  27         right: 2 * @unit_base;
  28         bottom: 2 * @unit_base;
  29         width: 10 * @unit_base;
  30 }
  31
  32 .ui-scrollbar-x {
  33         right: 2 * @unit_base;
  34         bottom: 2 * @unit_base;
  35         left: 2 * @unit_base;
  36         height: 10 * @unit_base;
  37 }
  38
  39 .ui-scrollbar-track {
  40         position: relative;
  41         width: 100%;
  42         height: 100%;
  43 }
  44
  45 .ui-scrollbar-thumb {
  46         position: absolute;
  47         top: 0;
  48         left: 0;
  49         background-color: @color_scrollbar;
  50 }
  51
  52 .ui-scrollbar-y .ui-scrollbar-thumb {
  53         width:  10 * @unit_base;
  54         height: 100%;
  55 }
  56
  57 .ui-scrollbar-x .ui-scrollbar-thumb {
  58         width: 100%;
  59         height: 10 * @unit_base;
  60 }
  61
  62 .ui-scroll-jump-top-bg {
  63         position: absolute;
  64         top: 16 * @unit_base;
  65         right: 16 * @unit_base;
  66         width: 76 * @unit_base;
  67         height: 70 * @unit_base;
  68         background: url(images/00_scroll_jump_bg.png) no-repeat;
  69         .LESSbackground-size(76 * @unit_base, 70 * @unit_base);
  70 }
  71
  72 .ui-scroll-jump-left-bg {
  73         position: absolute;
  74         bottom: 16 * @unit_base;
  75         left: 16 * @unit_base;
  76         width: 76 * @unit_base;
  77         height: 70 * @unit_base;
  78         background: url(images/00_scroll_jump_bg.png) no-repeat;
  79         .LESSbackground-size(76 * @unit_base, 70 * @unit_base);
  80 }
  81
  82 .ui-scroll-jump-top,
  83 .ui-scroll-jump-left {
  84         position: relative;
  85         top: 14 * @unit_base;
  86         left: 17 * @unit_base;
  87         width: 42 * @unit_base;
  88         height: 42 * @unit_base;
  89         background: url(images/00_scroll_icon_jump.png) no-repeat;
  90         .LESSbackground-size(42 * @unit_base, 42 * @unit_base);
  91 }
  92
  93 .ui-scroll-jump-left {
  94         background: url(images/00_scroll_icon_jump_left.png) no-repeat;
  95         .LESSbackground-size(42 * @unit_base, 42 * @unit_base);
  96 }
  97
  98 /*
  99  * the values below are for the group index
 100  */
 101
 102 /*
 103  * padding here set to zero - otherwise the list scrolls underneith the top heading and can be seen above it
 104  */
 105 .ui-content.ui-scrollview-clip {
 106         padding: 0;
 107         padding-bottom: 16 * @unit_base;
 108 }
 109 .ui-content.ui-scrollview-clip > div.ui-scrollview-view {
 110         margin: 0;
 111         padding: 16 * @unit_base;
 112 }
 113
 114 /*
 115  * this seems to effect how far the top divider is place wrt to the scrollview
 116  * without this, it is placed too high, so it is clipped in half
 117  */
 118 .ui-content.ui-scrollview-clip > .ui-listview.ui-scrollview-view {
 119         margin: 0;
 120 }