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}splitter-over {
|
---|
14 | background: rgba(0,0,0,.3);
|
---|
15 | }
|
---|
16 |
|
---|
17 | .#{$prefix}layout-split-left,
|
---|
18 | .#{$prefix}layout-split-right {
|
---|
19 | top: 50%;
|
---|
20 |
|
---|
21 | margin-top: -17px;
|
---|
22 |
|
---|
23 | width: 5px;
|
---|
24 | height: 35px;
|
---|
25 | }
|
---|
26 |
|
---|
27 | .#{$prefix}layout-split-top,
|
---|
28 | .#{$prefix}layout-split-bottom {
|
---|
29 | left: 50%;
|
---|
30 |
|
---|
31 | width: 35px;
|
---|
32 | height: 5px;
|
---|
33 |
|
---|
34 | margin-left: -17px;
|
---|
35 | }
|
---|
36 |
|
---|
37 | .#{$prefix}layout-split-left {
|
---|
38 | background: no-repeat top right;
|
---|
39 | background-image: theme-background-image($theme-name, 'util/splitter/mini-left.gif');
|
---|
40 | }
|
---|
41 |
|
---|
42 | .#{$prefix}layout-split-right {
|
---|
43 | background: no-repeat top left;
|
---|
44 | background-image: theme-background-image($theme-name, 'util/splitter/mini-right.gif');
|
---|
45 | }
|
---|
46 |
|
---|
47 | .#{$prefix}layout-split-top {
|
---|
48 | background: no-repeat top left;
|
---|
49 | background-image: theme-background-image($theme-name, 'util/splitter/mini-top.gif');
|
---|
50 | }
|
---|
51 |
|
---|
52 | .#{$prefix}layout-split-bottom {
|
---|
53 | background: no-repeat top left;
|
---|
54 | background-image: theme-background-image($theme-name, 'util/splitter/mini-bottom.gif');
|
---|
55 | }
|
---|
56 |
|
---|
57 | .#{$prefix}splitter-collapsed {
|
---|
58 | .#{$prefix}layout-split-left {
|
---|
59 | background: no-repeat top left;
|
---|
60 | background-image: theme-background-image($theme-name, 'util/splitter/mini-right.gif');
|
---|
61 | }
|
---|
62 |
|
---|
63 | .#{$prefix}layout-split-right {
|
---|
64 | background: no-repeat top right;
|
---|
65 | background-image: theme-background-image($theme-name, 'util/splitter/mini-left.gif');
|
---|
66 | }
|
---|
67 |
|
---|
68 | .#{$prefix}layout-split-top {
|
---|
69 | background: no-repeat top left;
|
---|
70 | background-image: theme-background-image($theme-name, 'util/splitter/mini-bottom.gif');
|
---|
71 | }
|
---|
72 |
|
---|
73 | .#{$prefix}layout-split-bottom {
|
---|
74 | background: no-repeat top left;
|
---|
75 | background-image: theme-background-image($theme-name, 'util/splitter/mini-top.gif');
|
---|
76 | }
|
---|
77 | }
|
---|
78 |
|
---|
79 | .#{$prefix}splitter-horizontal {
|
---|
80 | cursor: e-resize;
|
---|
81 | cursor: row-resize;
|
---|
82 | font-size:1px;
|
---|
83 | }
|
---|
84 | .#{$prefix}splitter-vertical {
|
---|
85 | cursor: e-resize;
|
---|
86 | cursor: col-resize;
|
---|
87 | font-size:1px;
|
---|
88 | }
|
---|
89 | .#{$prefix}splitter-collapsed {
|
---|
90 | cursor: default;
|
---|
91 | }
|
---|
92 |
|
---|
93 | .#{$prefix}splitter-active {
|
---|
94 | z-index: 4;
|
---|
95 | font-size:1px;
|
---|
96 | background :#000;
|
---|
97 | // background-color: rgb(180, 180, 180);
|
---|
98 | // @include opacity(0.8);
|
---|
99 | }
|
---|
100 | .#{$prefix}splitter-active {
|
---|
101 | .#{$prefix}collapse-el {
|
---|
102 | @include opacity(0.3);
|
---|
103 | }
|
---|
104 | }
|
---|
105 |
|
---|
106 | .#{$prefix}proxy-el {
|
---|
107 | position: absolute;
|
---|
108 | background: #000
|
---|
109 | }
|
---|
110 | } |
---|