1 | @mixin extjs-slider {
|
---|
2 | .#{$prefix}slider {
|
---|
3 | // @tag iezoomhack
|
---|
4 | }
|
---|
5 |
|
---|
6 | .#{$prefix}slider-inner {
|
---|
7 | position:relative;
|
---|
8 | left:0;
|
---|
9 | top:0;
|
---|
10 | overflow:visible;
|
---|
11 | // @tag iezoomhack
|
---|
12 | }
|
---|
13 |
|
---|
14 | .#{$prefix}slider-focus {
|
---|
15 | position:absolute;
|
---|
16 | left:0;
|
---|
17 | top:0;
|
---|
18 | width:1px;
|
---|
19 | height:1px;
|
---|
20 | line-height:1px;
|
---|
21 | font-size:1px;
|
---|
22 | display:block;
|
---|
23 | overflow:hidden;
|
---|
24 | @extend .outline-none;
|
---|
25 | @extend .no-select;
|
---|
26 | }
|
---|
27 |
|
---|
28 | /* Horizontal styles */
|
---|
29 | .#{$prefix}slider-horz {
|
---|
30 | padding-left:7px;
|
---|
31 | background:transparent no-repeat 0 -24px;
|
---|
32 | }
|
---|
33 |
|
---|
34 | .#{$prefix}slider-horz .#{$prefix}slider-end {
|
---|
35 | padding-right:7px;
|
---|
36 | // @tag iezoomhack
|
---|
37 | background:transparent no-repeat right -46px;
|
---|
38 | }
|
---|
39 |
|
---|
40 | .#{$prefix}slider-horz .#{$prefix}slider-inner {
|
---|
41 | background:transparent repeat-x 0 -2px;
|
---|
42 | height:18px;
|
---|
43 | }
|
---|
44 |
|
---|
45 | .#{$prefix}slider-horz .#{$prefix}slider-thumb {
|
---|
46 | width: $horizontal-slider-thumb-width;
|
---|
47 | height: $horizontal-slider-thumb-height;
|
---|
48 | margin-left: -($horizontal-slider-thumb-width / 2);
|
---|
49 | position: absolute;
|
---|
50 | left: 0;
|
---|
51 | top: 1px;
|
---|
52 | background: transparent no-repeat 0 0;
|
---|
53 | }
|
---|
54 |
|
---|
55 | .#{$prefix}slider-horz .#{$prefix}slider-thumb-over {
|
---|
56 | background-position: -14px -15px;
|
---|
57 | }
|
---|
58 |
|
---|
59 | .#{$prefix}slider-horz .#{$prefix}slider-thumb-drag {
|
---|
60 | background-position: -28px -30px;
|
---|
61 | }
|
---|
62 |
|
---|
63 | /* Vertical styles */
|
---|
64 | .#{$prefix}slider-vert {
|
---|
65 | padding-top:7px;
|
---|
66 | background:transparent no-repeat -44px 0;
|
---|
67 | }
|
---|
68 |
|
---|
69 | .#{$prefix}slider-vert .#{$prefix}slider-end {
|
---|
70 | padding-bottom:7px;
|
---|
71 | // @tag iezoomhack
|
---|
72 | background:transparent no-repeat -22px bottom;
|
---|
73 | width:22px;
|
---|
74 | }
|
---|
75 |
|
---|
76 | .#{$prefix}slider-vert .#{$prefix}slider-inner {
|
---|
77 | background:transparent repeat-y 0 0;
|
---|
78 | width:22px;
|
---|
79 | }
|
---|
80 |
|
---|
81 | .#{$prefix}slider-vert .#{$prefix}slider-thumb {
|
---|
82 | width: $vertical-slider-thumb-width;
|
---|
83 | height: $vertical-slider-thumb-height;
|
---|
84 | margin-bottom: -($vertical-slider-thumb-height / 2);
|
---|
85 | position: absolute;
|
---|
86 | left: 3px;
|
---|
87 | bottom: 0;
|
---|
88 | background:transparent no-repeat 0 0;
|
---|
89 | }
|
---|
90 |
|
---|
91 | .#{$prefix}slider-vert .#{$prefix}slider-thumb-over {
|
---|
92 | background-position: -15px -14px;
|
---|
93 | }
|
---|
94 |
|
---|
95 | .#{$prefix}slider-vert .#{$prefix}slider-thumb-drag {
|
---|
96 | background-position: -30px -28px;
|
---|
97 | }
|
---|
98 |
|
---|
99 | .#{$prefix}slider-horz,
|
---|
100 | .#{$prefix}slider-horz .#{$prefix}slider-end,
|
---|
101 | .#{$prefix}slider-horz .#{$prefix}slider-inner {
|
---|
102 | background-image: theme-background-image($theme-name, 'slider/slider-bg.png');
|
---|
103 | }
|
---|
104 |
|
---|
105 | .#{$prefix}slider-horz .#{$prefix}slider-thumb {
|
---|
106 | background-image: theme-background-image($theme-name, 'slider/slider-thumb.png');
|
---|
107 | }
|
---|
108 |
|
---|
109 | .#{$prefix}slider-vert,
|
---|
110 | .#{$prefix}slider-vert .#{$prefix}slider-end,
|
---|
111 | .#{$prefix}slider-vert .#{$prefix}slider-inner {
|
---|
112 | background-image: theme-background-image($theme-name, 'slider/slider-v-bg.png');
|
---|
113 | }
|
---|
114 |
|
---|
115 | .#{$prefix}slider-vert .#{$prefix}slider-thumb {
|
---|
116 | background-image: theme-background-image($theme-name, 'slider/slider-v-thumb.png');
|
---|
117 | }
|
---|
118 |
|
---|
119 | @if $include-ie {
|
---|
120 | .#{$prefix}ie6 {
|
---|
121 | .#{$prefix}slider-horz,
|
---|
122 | .#{$prefix}slider-horz .#{$prefix}slider-end,
|
---|
123 | .#{$prefix}slider-horz .#{$prefix}slider-inner {
|
---|
124 | background-image: theme-background-image($theme-name, 'slider/slider-bg.gif');
|
---|
125 | }
|
---|
126 |
|
---|
127 | .#{$prefix}slider-horz .#{$prefix}slider-thumb {
|
---|
128 | background-image: theme-background-image($theme-name, 'slider/slider-thumb.gif');
|
---|
129 | }
|
---|
130 |
|
---|
131 | .#{$prefix}slider-vert,
|
---|
132 | .#{$prefix}slider-vert .#{$prefix}slider-end,
|
---|
133 | .#{$prefix}slider-vert .#{$prefix}slider-inner {
|
---|
134 | background-image: theme-background-image($theme-name, 'slider/slider-v-bg.gif');
|
---|
135 | }
|
---|
136 |
|
---|
137 | .#{$prefix}slider-vert .#{$prefix}slider-thumb {
|
---|
138 | background-image: theme-background-image($theme-name, 'slider/slider-v-thumb.gif');
|
---|
139 | }
|
---|
140 | }
|
---|
141 | }
|
---|
142 | } |
---|