Upgrade to ExtJS 4.0.1 - Released 05/18/2011
[extjs.git] / resources / themes / stylesheets / ext4 / default / util / _splitter.scss
1 @mixin extjs-splitter {
2     .#{$prefix}splitter {
3         .#{$prefix}collapse-el {
4             position: absolute;
5
6             cursor: pointer;
7
8             background-color: transparent;
9             background-repeat: no-repeat !important;
10         }
11     }
12
13     .#{$prefix}layout-split-left,
14     .#{$prefix}layout-split-right {
15         top: 50%;
16
17         margin-top: -17px;
18
19         width: 5px;
20         height: 35px;
21     }
22
23     .#{$prefix}layout-split-top,
24     .#{$prefix}layout-split-bottom {
25         left: 50%;
26
27         width: 35px;
28         height: 5px;
29
30         margin-left: -17px;
31     }
32
33     .#{$prefix}layout-split-left {
34         background: theme-image($theme-name, 'util/splitter/mini-left.gif') no-repeat top right;
35     }
36
37     .#{$prefix}layout-split-right {
38         background: theme-image($theme-name, 'util/splitter/mini-right.gif') no-repeat top left;
39     }
40
41     .#{$prefix}layout-split-top {
42         background: theme-image($theme-name, 'util/splitter/mini-top.gif') no-repeat top left;
43     }
44
45     .#{$prefix}layout-split-bottom {
46         background: theme-image($theme-name, 'util/splitter/mini-bottom.gif') no-repeat top left;
47     }
48
49     .#{$prefix}splitter-collapsed {
50         .#{$prefix}layout-split-left {
51             background: theme-image($theme-name, 'util/splitter/mini-right.gif') no-repeat top left;
52         }
53
54         .#{$prefix}layout-split-right {
55             background: theme-image($theme-name, 'util/splitter/mini-left.gif') no-repeat top right;
56         }
57
58         .#{$prefix}layout-split-top {
59             background: theme-image($theme-name, 'util/splitter/mini-bottom.gif') no-repeat top left;
60         }
61
62         .#{$prefix}layout-split-bottom {
63             background: theme-image($theme-name, 'util/splitter/mini-top.gif') no-repeat top left;
64         }
65     }
66
67     .#{$prefix}splitter-horizontal {
68         cursor: e-resize;
69         cursor: row-resize;
70         font-size:1px;
71     }
72     .#{$prefix}splitter-vertical {
73         cursor: e-resize;
74         cursor: col-resize;
75         font-size:1px;
76     }
77     .#{$prefix}splitter-collapsed {
78         cursor: default;
79     }
80
81     .#{$prefix}splitter-active {
82         z-index: 4;
83         font-size:1px;
84         background-color: rgb(180, 180, 180);
85         @include opacity(0.8);
86     }
87     .#{$prefix}splitter-active {
88         .#{$prefix}collapse-el {
89             @include opacity(0.3);
90         }
91     }
92
93     .#{$prefix}proxy-el {
94         position: absolute;
95         background: rgb(180, 180, 180);
96         @include opacity(0.8);
97     }
98 }