Revert "[TASK] Migrate to ExtJS 4: Migrate Backend Base Components"
[Packages/TYPO3.CMS.git] / typo3 / sysext / t3skin / extjs / themes / stylesheets / ext4 / default / widgets / _slider.scss
1 @mixin extjs-slider {
2     .#{$prefix}slider {
3         zoom:1;
4     }
5
6     .#{$prefix}slider-inner {
7         position:relative;
8         left:0;
9         top:0;
10         overflow:visible;
11         zoom:1;
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         -moz-outline:0 none;
23         outline:0 none;
24         -moz-user-select: none;
25         -khtml-user-select:none;
26         -webkit-user-select:ignore;
27         display:block;
28         overflow:hidden;  
29     }
30
31     /* Horizontal styles */
32     .#{$prefix}slider-horz {
33         padding-left:7px;
34         background:transparent no-repeat 0 -24px;
35     }
36
37     .#{$prefix}slider-horz .#{$prefix}slider-end {
38         padding-right:7px;
39         zoom:1;
40         background:transparent no-repeat right -46px;
41     }
42
43     .#{$prefix}slider-horz .#{$prefix}slider-inner {
44         background:transparent repeat-x 0 -2px;
45         height:18px;
46     }
47
48     .#{$prefix}slider-horz .#{$prefix}slider-thumb {
49         width:14px;
50         height:15px;
51         position:absolute;
52         left:0;
53         top:1px;
54         background:transparent no-repeat 0 0;
55     }
56
57     .#{$prefix}slider-horz .#{$prefix}slider-thumb-over {
58         background-position: -14px -15px;
59     }
60
61     .#{$prefix}slider-horz .#{$prefix}slider-thumb-drag {
62         background-position: -28px -30px;
63     }
64
65     /* Vertical styles */
66     .#{$prefix}slider-vert {
67         padding-top:7px;
68         background:transparent no-repeat -44px 0;
69     }
70
71     .#{$prefix}slider-vert .#{$prefix}slider-end {
72         padding-bottom:7px;
73         zoom:1;
74         background:transparent no-repeat -22px bottom;
75         width:22px;
76     }
77
78     .#{$prefix}slider-vert .#{$prefix}slider-inner {
79         background:transparent repeat-y 0 0;
80         width:22px;
81     }
82
83     .#{$prefix}slider-vert .#{$prefix}slider-thumb {
84         width:15px;
85         height:14px;
86         position:absolute;
87         left:3px;
88         bottom:0;
89         background:transparent no-repeat 0 0;
90     }
91
92     .#{$prefix}slider-vert .#{$prefix}slider-thumb-over {
93         background-position: -15px -14px;
94     }
95
96     .#{$prefix}slider-vert .#{$prefix}slider-thumb-drag {
97         background-position: -30px -28px;
98     }
99     
100     .#{$prefix}slider-horz,
101     .#{$prefix}slider-horz .#{$prefix}slider-end,
102     .#{$prefix}slider-horz .#{$prefix}slider-inner {
103         background-image: theme-image($theme-name, 'slider/slider-bg.png');
104     }
105
106     .#{$prefix}slider-horz .#{$prefix}slider-thumb {
107         background-image: theme-image($theme-name, 'slider/slider-thumb.png');
108     }
109
110     .#{$prefix}slider-vert,
111     .#{$prefix}slider-vert .#{$prefix}slider-end,
112     .#{$prefix}slider-vert .#{$prefix}slider-inner {
113         background-image: theme-image($theme-name, 'slider/slider-v-bg.png');
114     }
115
116     .#{$prefix}slider-vert .#{$prefix}slider-thumb {
117         background-image: theme-image($theme-name, 'slider/slider-v-thumb.png');
118     }
119     
120     @if $include-ie {
121         .#{$prefix}ie6 {
122             .#{$prefix}slider-horz,
123             .#{$prefix}slider-horz .#{$prefix}slider-end,
124             .#{$prefix}slider-horz .#{$prefix}slider-inner {
125                 background-image: theme-image($theme-name, 'slider/slider-bg.gif');
126             }
127
128             .#{$prefix}slider-horz .#{$prefix}slider-thumb {
129                 background-image: theme-image($theme-name, 'slider/slider-thumb.gif');
130             }
131
132             .#{$prefix}slider-vert,
133             .#{$prefix}slider-vert .#{$prefix}slider-end,
134             .#{$prefix}slider-vert .#{$prefix}slider-inner {
135                 background-image: theme-image($theme-name, 'slider/slider-v-bg.gif');
136             }
137
138             .#{$prefix}slider-vert .#{$prefix}slider-thumb {
139                 background-image: theme-image($theme-name, 'slider/slider-v-thumb.gif');
140             }
141         }
142     }
143 }