1 | @mixin extjs-qtip {
|
---|
2 | .#{$prefix}tip {
|
---|
3 | position: absolute;
|
---|
4 | overflow: visible; /*pointer needs to be able to stick out*/
|
---|
5 | border-color: $tip-border-color;
|
---|
6 |
|
---|
7 | .#{$prefix}tip-header {
|
---|
8 | .#{$prefix}box-item {
|
---|
9 | padding: $tip-header-padding;
|
---|
10 | }
|
---|
11 |
|
---|
12 | .#{$prefix}tool {
|
---|
13 | padding: 0px 1px 0 0 !important;
|
---|
14 | }
|
---|
15 | }
|
---|
16 | }
|
---|
17 |
|
---|
18 | @include x-frame(
|
---|
19 | $cls: 'tip',
|
---|
20 | $border-radius: $tip-border-radius,
|
---|
21 | $border-width: $tip-border-width,
|
---|
22 | $background-color: $tip-background-color,
|
---|
23 | $background-gradient: $tip-background-gradient,
|
---|
24 | $table: true
|
---|
25 | );
|
---|
26 |
|
---|
27 | .#{$prefix}tip-header-text {
|
---|
28 | @extend .no-select;
|
---|
29 |
|
---|
30 | color: $tip-header-color;
|
---|
31 | font-size: $tip-header-font-size;
|
---|
32 | font-weight: $tip-header-font-weight;
|
---|
33 | }
|
---|
34 |
|
---|
35 | .#{$prefix}tip-header-draggable .#{$prefix}tip-header-text {
|
---|
36 | cursor: move;
|
---|
37 | }
|
---|
38 |
|
---|
39 | // Tip is a Panel. It uses dock layout. Body style must be the same
|
---|
40 | .#{$prefix}tip-body,
|
---|
41 | .#{$prefix}form-invalid-tip-body {
|
---|
42 | overflow: hidden;
|
---|
43 | position: relative;
|
---|
44 | padding: $tip-body-padding;
|
---|
45 | }
|
---|
46 |
|
---|
47 | .#{$prefix}tip-header,
|
---|
48 | .#{$prefix}tip-body,
|
---|
49 | .#{$prefix}form-invalid-tip-body {
|
---|
50 | color: $tip-body-color;
|
---|
51 | font-size: $tip-body-font-size;
|
---|
52 | font-weight: $tip-body-font-weight;
|
---|
53 | @if $include-tip-highlights {
|
---|
54 | @include inset-by-background($tip-background-color);
|
---|
55 | }
|
---|
56 |
|
---|
57 | a {
|
---|
58 | color: $tip-body-link-color;
|
---|
59 | }
|
---|
60 | }
|
---|
61 |
|
---|
62 | .#{$prefix}tip-anchor {
|
---|
63 | position: absolute;
|
---|
64 | overflow: hidden;
|
---|
65 | height: 0;
|
---|
66 | width: 0;
|
---|
67 | border-style: solid;
|
---|
68 | border-width: 5px;
|
---|
69 | border-color: $tip-border-color;
|
---|
70 | // @tag iezoomhack
|
---|
71 | }
|
---|
72 |
|
---|
73 | .#{$prefix}border-box .#{$prefix}tip-anchor {
|
---|
74 | width: 10px;
|
---|
75 | height: 10px;
|
---|
76 | }
|
---|
77 |
|
---|
78 | .#{$prefix}tip-anchor-top {
|
---|
79 | border-top-color: transparent;
|
---|
80 | border-left-color: transparent;
|
---|
81 | border-right-color: transparent;
|
---|
82 |
|
---|
83 | @if $include_ie {
|
---|
84 | _border-top-color: pink;
|
---|
85 | _border-left-color: pink;
|
---|
86 | _border-right-color: pink;
|
---|
87 | _filter: chroma(color=pink);
|
---|
88 | }
|
---|
89 | }
|
---|
90 |
|
---|
91 | .#{$prefix}tip-anchor-bottom {
|
---|
92 | border-bottom-color: transparent;
|
---|
93 | border-left-color: transparent;
|
---|
94 | border-right-color: transparent;
|
---|
95 |
|
---|
96 | @if $include_ie {
|
---|
97 | _border-bottom-color: pink;
|
---|
98 | _border-left-color: pink;
|
---|
99 | _border-right-color: pink;
|
---|
100 | _filter: chroma(color=pink);
|
---|
101 | }
|
---|
102 | }
|
---|
103 |
|
---|
104 | .#{$prefix}tip-anchor-left {
|
---|
105 | border-top-color: transparent;
|
---|
106 | border-bottom-color: transparent;
|
---|
107 | border-left-color: transparent;
|
---|
108 |
|
---|
109 | @if $include-ie {
|
---|
110 | _border-top-color: pink;
|
---|
111 | _border-bottom-color: pink;
|
---|
112 | _border-left-color: pink;
|
---|
113 | _filter: chroma(color=pink);
|
---|
114 | }
|
---|
115 | }
|
---|
116 |
|
---|
117 | .#{$prefix}tip-anchor-right {
|
---|
118 | border-top-color: transparent;
|
---|
119 | border-bottom-color: transparent;
|
---|
120 | border-right-color: transparent;
|
---|
121 |
|
---|
122 | @if $include-ie {
|
---|
123 | _border-top-color: pink;
|
---|
124 | _border-bottom-color: pink;
|
---|
125 | _border-right-color: pink;
|
---|
126 | _filter: chroma(color=pink);
|
---|
127 | }
|
---|
128 | }
|
---|
129 |
|
---|
130 | //error qtip
|
---|
131 | .#{$prefix}form-invalid-tip {
|
---|
132 | border-color: $tip-error-border-color;
|
---|
133 |
|
---|
134 | @include inner-border(
|
---|
135 | $width: 1px,
|
---|
136 | $color: $tip-error-inner-border-color
|
---|
137 | );
|
---|
138 | }
|
---|
139 |
|
---|
140 | .#{$prefix}form-invalid-tip-body {
|
---|
141 | background: 1px 1px no-repeat;
|
---|
142 | background-image: theme-background-image($theme-name, 'form/exclamation.gif');
|
---|
143 | padding-left: 22px;
|
---|
144 |
|
---|
145 | li {
|
---|
146 | margin-bottom: 4px;
|
---|
147 | &.last {
|
---|
148 | margin-bottom: 0;
|
---|
149 | }
|
---|
150 | }
|
---|
151 | }
|
---|
152 |
|
---|
153 | @include x-frame(
|
---|
154 | $cls: 'form-invalid-tip',
|
---|
155 | $ui: 'default',
|
---|
156 | $border-radius: $tip-error-border-radius,
|
---|
157 | $border-width: $tip-error-border-width,
|
---|
158 | $background-color: $tip-error-background-color,
|
---|
159 | $background-gradient: $tip-background-gradient,
|
---|
160 | $table: true
|
---|
161 | );
|
---|
162 | } |
---|