Show More
@@ -16,6 +16,11 b'' | |||||
16 | * have some strange ccs to have the scroll bar on |
|
16 | * have some strange ccs to have the scroll bar on | |
17 | * the left of the left with fix button on the top right of the tooltip |
|
17 | * the left of the left with fix button on the top right of the tooltip | |
18 | */ |
|
18 | */ | |
|
19 | .dropshadow { | |||
|
20 | -moz-box-shadow: 0px 6px 10px -1px #adadad; | |||
|
21 | -webkit-box-shadow: 0px 6px 10px -1px #adadad; | |||
|
22 | box-shadow: 0px 6px 10px -1px #adadad; | |||
|
23 | } | |||
19 | @-moz-keyframes fadeOut { |
|
24 | @-moz-keyframes fadeOut { | |
20 | from { |
|
25 | from { | |
21 | opacity: 1; |
|
26 | opacity: 1; | |
@@ -87,8 +92,10 b'' | |||||
87 | } |
|
92 | } | |
88 | .tooltip { |
|
93 | .tooltip { | |
89 | max-width: 700px; |
|
94 | max-width: 700px; | |
90 |
border-radius: |
|
95 | border-radius: 4px; | |
91 |
box-shadow: |
|
96 | -moz-box-shadow: 0px 6px 10px -1px #adadad; | |
|
97 | -webkit-box-shadow: 0px 6px 10px -1px #adadad; | |||
|
98 | box-shadow: 0px 6px 10px -1px #adadad; | |||
92 | /*fade-in animation when inserted*/ |
|
99 | /*fade-in animation when inserted*/ | |
93 |
|
100 | |||
94 | -webkit-animation: fadeOut 800ms; |
|
101 | -webkit-animation: fadeOut 800ms; | |
@@ -99,12 +106,6 b'' | |||||
99 | animation: fadeIn 800ms; |
|
106 | animation: fadeIn 800ms; | |
100 | vertical-align: middle; |
|
107 | vertical-align: middle; | |
101 | background-color: #f7f7f7; |
|
108 | background-color: #f7f7f7; | |
102 | background-image: -webkit-linear-gradient(center bottom, #d7d7d7 13%, #d2d2d2 39%, #e3e3e3 56%, #f7f7f7 91%); |
|
|||
103 | background-image: -webkit-gradient(linear, left bottom, left top, color-stop(13%, #d7d7d7), color-stop(39%, #d2d2d2), color-stop(56%, #e3e3e3), color-stop(91%, #f7f7f7)); |
|
|||
104 | background-image: -moz-linear-gradient(center bottom, #d7d7d7 13%, #d2d2d2 39%, #e3e3e3 56%, #f7f7f7 91%); |
|
|||
105 | background-image: -ms-linear-gradient(center bottom, #d7d7d7 13%, #d2d2d2 39%, #e3e3e3 56%, #f7f7f7 91%); |
|
|||
106 | background-image: -o-linear-gradient(center bottom, #d7d7d7 13%, #d2d2d2 39%, #e3e3e3 56%, #f7f7f7 91%); |
|
|||
107 | background-image: linear-gradient(center bottom, #d7d7d7 13%, #d2d2d2 39%, #e3e3e3 56%, #f7f7f7 91%); |
|
|||
108 | overflow: visible; |
|
109 | overflow: visible; | |
109 | color: #000000; |
|
110 | color: #000000; | |
110 | border: #bbbbbb 1px solid; |
|
111 | border: #bbbbbb 1px solid; |
@@ -32,6 +32,12 b'' | |||||
32 | @borderwidth : 1px; |
|
32 | @borderwidth : 1px; | |
33 | @textColor : #000; |
|
33 | @textColor : #000; | |
34 |
|
34 | |||
|
35 | .dropshadow{ | |||
|
36 | -moz-box-shadow: 0px 6px 10px -1px #adadad; | |||
|
37 | -webkit-box-shadow: 0px 6px 10px -1px #adadad; | |||
|
38 | box-shadow: 0px 6px 10px -1px #adadad; | |||
|
39 | } | |||
|
40 | ||||
35 | // smoth height adaptation |
|
41 | // smoth height adaptation | |
36 | .smoothheight(@t:1s) { |
|
42 | .smoothheight(@t:1s) { | |
37 | -webkit-transition-property: height; |
|
43 | -webkit-transition-property: height; | |
@@ -72,25 +78,6 b'' | |||||
72 | // to {opacity:1;} |
|
78 | // to {opacity:1;} | |
73 | //} |
|
79 | //} | |
74 |
|
80 | |||
75 | .linearGradient(@stop1:0, @color1:#ccc, @stop2:33%, @color2:#ddd, @stop3:66%, @color3:#ccc, @stop4:100%, @color4:#ddd){ |
|
|||
76 | background-color:@color4; |
|
|||
77 | background-image: -webkit-linear-gradient(center bottom, @color1 @stop1, @color2 @stop2, @color3 @stop3, @color4 @stop4); |
|
|||
78 | background-image: -webkit-gradient( |
|
|||
79 | linear, |
|
|||
80 | left bottom, |
|
|||
81 | left top, |
|
|||
82 | color-stop(@stop1, @color1), |
|
|||
83 | color-stop(@stop2, @color2), |
|
|||
84 | color-stop(@stop3, @color3), |
|
|||
85 | color-stop(@stop4, @color4) |
|
|||
86 | ); |
|
|||
87 | background-image:-moz-linear-gradient(center bottom, @color1 @stop1, @color2 @stop2, @color3 @stop3, @color4 @stop4); |
|
|||
88 | background-image:-ms-linear-gradient(center bottom, @color1 @stop1, @color2 @stop2, @color3 @stop3, @color4 @stop4); |
|
|||
89 | background-image:-o-linear-gradient(center bottom, @color1 @stop1, @color2 @stop2, @color3 @stop3, @color4 @stop4); |
|
|||
90 | background-image:linear-gradient(center bottom, @color1 @stop1, @color2 @stop2, @color3 @stop3, @color4 @stop4); |
|
|||
91 |
|
||||
92 | } |
|
|||
93 |
|
||||
94 | .tooltip a { |
|
81 | .tooltip a { | |
95 | float:right; |
|
82 | float:right; | |
96 | } |
|
83 | } | |
@@ -124,8 +111,8 b'' | |||||
124 |
|
111 | |||
125 | .tooltip { |
|
112 | .tooltip { | |
126 | max-width:700px; |
|
113 | max-width:700px; | |
127 |
border-radius: |
|
114 | border-radius: 4px; | |
128 | box-shadow: 3px 3px 5px #999; |
|
115 | .dropshadow; | |
129 | /*fade-in animation when inserted*/ |
|
116 | /*fade-in animation when inserted*/ | |
130 | -webkit-animation: fadeOut 800ms; |
|
117 | -webkit-animation: fadeOut 800ms; | |
131 | -moz-animation: fadeOut 800ms; |
|
118 | -moz-animation: fadeOut 800ms; | |
@@ -134,8 +121,8 b'' | |||||
134 | -moz-animation: fadeIn 800ms; |
|
121 | -moz-animation: fadeIn 800ms; | |
135 | animation: fadeIn 800ms; |
|
122 | animation: fadeIn 800ms; | |
136 | vertical-align: middle; |
|
123 | vertical-align: middle; | |
|
124 | background-color: @c4; | |||
137 |
|
125 | |||
138 | .linearGradient(13%,@c1, 39%, @c2 , 56%,@c3, 91% , @c4) ; |
|
|||
139 | overflow : visible; |
|
126 | overflow : visible; | |
140 | color: @textColor; |
|
127 | color: @textColor; | |
141 | border: @bordercolor @borderwidth solid; |
|
128 | border: @bordercolor @borderwidth solid; |
General Comments 0
You need to be logged in to leave comments.
Login now