qtip2-jquery-rails 2.0.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,608 @@
1
+ /*! qTip2 - Pretty powerful tooltips - v2.0.0 - 2012-10-25
2
+ * http://craigsworks.com/projects/qtip2/
3
+ * Copyright (c) 2012 Craig Michael Thompson; Licensed MIT, GPL */
4
+
5
+ /* Fluid class for determining actual width in IE */
6
+ #qtip-rcontainer{
7
+ position: absolute;
8
+ left: -28000px;
9
+ top: -28000px;
10
+ display: block;
11
+ visibility: hidden;
12
+ }
13
+
14
+ /* Fluid class for determining actual width in IE */
15
+ #qtip-rcontainer .ui-tooltip{
16
+ display: block !important;
17
+ visibility: hidden !important;
18
+ position: static !important;
19
+ float: left !important;
20
+ }
21
+
22
+ /* Core qTip styles */
23
+ .ui-tooltip, .qtip{
24
+ position: absolute;
25
+ left: -28000px;
26
+ top: -28000px;
27
+ display: none;
28
+
29
+ max-width: 280px;
30
+ min-width: 50px;
31
+
32
+ font-size: 10.5px;
33
+ line-height: 12px;
34
+ }
35
+
36
+ .ui-tooltip-content{
37
+ position: relative;
38
+ padding: 5px 9px;
39
+ overflow: hidden;
40
+
41
+ text-align: left;
42
+ word-wrap: break-word;
43
+ }
44
+
45
+ .ui-tooltip-titlebar{
46
+ position: relative;
47
+ min-height: 14px;
48
+ padding: 5px 35px 5px 10px;
49
+ overflow: hidden;
50
+
51
+ border-width: 0 0 1px;
52
+ font-weight: bold;
53
+ }
54
+
55
+ .ui-tooltip-titlebar + .ui-tooltip-content{ border-top-width: 0 !important; }
56
+
57
+ /* Default close button class */
58
+ .ui-tooltip-titlebar .ui-state-default{
59
+ position: absolute;
60
+ right: 4px;
61
+ top: 50%;
62
+ margin-top: -9px;
63
+
64
+ cursor: pointer;
65
+ outline: medium none;
66
+
67
+ border-width: 1px;
68
+ border-style: solid;
69
+ }
70
+
71
+ * html .ui-tooltip-titlebar .ui-state-default{ top: 16px; } /* IE fix */
72
+
73
+ .ui-tooltip-titlebar .ui-icon,
74
+ .ui-tooltip-icon .ui-icon{
75
+ display: block;
76
+ text-indent: -1000em;
77
+ direction: ltr;
78
+ }
79
+
80
+ .ui-tooltip-icon, .ui-tooltip-icon .ui-icon{
81
+ -moz-border-radius: 3px;
82
+ -webkit-border-radius: 3px;
83
+ border-radius: 3px;
84
+ text-decoration: none;
85
+ }
86
+
87
+ .ui-tooltip-icon .ui-icon{
88
+ width: 18px;
89
+ height: 14px;
90
+
91
+ text-align: center;
92
+ text-indent: 0;
93
+ font: normal bold 10px/13px Tahoma,sans-serif;
94
+
95
+ color: inherit;
96
+ background: transparent none no-repeat -100em -100em;
97
+ }
98
+
99
+
100
+ /* Applied to 'focused' tooltips e.g. most recently displayed/interacted with */
101
+ .ui-tooltip-focus{}
102
+
103
+ /* Applied on hover of tooltips i.e. added/removed on mouseenter/mouseleave respectively */
104
+ .ui-tooltip-hover{}
105
+
106
+ /* Default tooltip style */
107
+ .ui-tooltip-default{
108
+ border-width: 1px;
109
+ border-style: solid;
110
+ border-color: #F1D031;
111
+
112
+ background-color: #FFFFA3;
113
+ color: #555;
114
+ }
115
+
116
+ .ui-tooltip-default .ui-tooltip-titlebar{
117
+ background-color: #FFEF93;
118
+ }
119
+
120
+ .ui-tooltip-default .ui-tooltip-icon{
121
+ border-color: #CCC;
122
+ background: #F1F1F1;
123
+ color: #777;
124
+ }
125
+
126
+ .ui-tooltip-default .ui-tooltip-titlebar .ui-state-hover{
127
+ border-color: #AAA;
128
+ color: #111;
129
+ }
130
+
131
+
132
+ /*! Light tooltip style */
133
+ .ui-tooltip-light{
134
+ background-color: white;
135
+ border-color: #E2E2E2;
136
+ color: #454545;
137
+ }
138
+
139
+ .ui-tooltip-light .ui-tooltip-titlebar{
140
+ background-color: #f1f1f1;
141
+ }
142
+
143
+
144
+ /*! Dark tooltip style */
145
+ .ui-tooltip-dark{
146
+ background-color: #505050;
147
+ border-color: #303030;
148
+ color: #f3f3f3;
149
+ }
150
+
151
+ .ui-tooltip-dark .ui-tooltip-titlebar{
152
+ background-color: #404040;
153
+ }
154
+
155
+ .ui-tooltip-dark .ui-tooltip-icon{
156
+ border-color: #444;
157
+ }
158
+
159
+ .ui-tooltip-dark .ui-tooltip-titlebar .ui-state-hover{
160
+ border-color: #303030;
161
+ }
162
+
163
+
164
+ /*! Cream tooltip style */
165
+ .ui-tooltip-cream{
166
+ background-color: #FBF7AA;
167
+ border-color: #F9E98E;
168
+ color: #A27D35;
169
+ }
170
+
171
+ .ui-tooltip-cream .ui-tooltip-titlebar{
172
+ background-color: #F0DE7D;
173
+ }
174
+
175
+ .ui-tooltip-cream .ui-state-default .ui-tooltip-icon{
176
+ background-position: -82px 0;
177
+ }
178
+
179
+
180
+ /*! Red tooltip style */
181
+ .ui-tooltip-red{
182
+ background-color: #F78B83;
183
+ border-color: #D95252;
184
+ color: #912323;
185
+ }
186
+
187
+ .ui-tooltip-red .ui-tooltip-titlebar{
188
+ background-color: #F06D65;
189
+ }
190
+
191
+ .ui-tooltip-red .ui-state-default .ui-tooltip-icon{
192
+ background-position: -102px 0;
193
+ }
194
+
195
+ .ui-tooltip-red .ui-tooltip-icon{
196
+ border-color: #D95252;
197
+ }
198
+
199
+ .ui-tooltip-red .ui-tooltip-titlebar .ui-state-hover{
200
+ border-color: #D95252;
201
+ }
202
+
203
+
204
+ /*! Green tooltip style */
205
+ .ui-tooltip-green{
206
+ background-color: #CAED9E;
207
+ border-color: #90D93F;
208
+ color: #3F6219;
209
+ }
210
+
211
+ .ui-tooltip-green .ui-tooltip-titlebar{
212
+ background-color: #B0DE78;
213
+ }
214
+
215
+ .ui-tooltip-green .ui-state-default .ui-tooltip-icon{
216
+ background-position: -42px 0;
217
+ }
218
+
219
+
220
+ /*! Blue tooltip style */
221
+ .ui-tooltip-blue{
222
+ background-color: #E5F6FE;
223
+ border-color: #ADD9ED;
224
+ color: #5E99BD;
225
+ }
226
+
227
+ .ui-tooltip-blue .ui-tooltip-titlebar{
228
+ background-color: #D0E9F5;
229
+ }
230
+
231
+ .ui-tooltip-blue .ui-state-default .ui-tooltip-icon{
232
+ background-position: -2px 0;
233
+ }
234
+
235
+
236
+ /* Add shadows to your tooltips in: FF3+, Chrome 2+, Opera 10.6+, IE9+, Safari 2+ */
237
+ .ui-tooltip-shadow{
238
+ -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
239
+ -moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
240
+ box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
241
+ }
242
+
243
+ /* Add rounded corners to your tooltips in: FF3+, Chrome 2+, Opera 10.6+, IE9+, Safari 2+ */
244
+ .ui-tooltip-rounded,
245
+ .ui-tooltip-tipsy,
246
+ .ui-tooltip-bootstrap{
247
+ -moz-border-radius: 5px;
248
+ -webkit-border-radius: 5px;
249
+ border-radius: 5px;
250
+ }
251
+
252
+ /* Youtube tooltip style */
253
+ .ui-tooltip-youtube{
254
+ -moz-border-radius: 2px;
255
+ -webkit-border-radius: 2px;
256
+ border-radius: 2px;
257
+
258
+ -webkit-box-shadow: 0 0 3px #333;
259
+ -moz-box-shadow: 0 0 3px #333;
260
+ box-shadow: 0 0 3px #333;
261
+
262
+ color: white;
263
+ border-width: 0;
264
+
265
+ background: #4A4A4A;
266
+ background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0,#4A4A4A),color-stop(100%,black));
267
+ background-image: -webkit-linear-gradient(top,#4A4A4A 0,black 100%);
268
+ background-image: -moz-linear-gradient(top,#4A4A4A 0,black 100%);
269
+ background-image: -ms-linear-gradient(top,#4A4A4A 0,black 100%);
270
+ background-image: -o-linear-gradient(top,#4A4A4A 0,black 100%);
271
+ }
272
+
273
+ .ui-tooltip-youtube .ui-tooltip-titlebar{
274
+ background-color: #4A4A4A;
275
+ background-color: rgba(0,0,0,0);
276
+ }
277
+
278
+ .ui-tooltip-youtube .ui-tooltip-content{
279
+ padding: .75em;
280
+ font: 12px arial,sans-serif;
281
+
282
+ filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#4a4a4a,EndColorStr=#000000);
283
+ -ms-filter: "progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#4a4a4a,EndColorStr=#000000);";
284
+ }
285
+
286
+ .ui-tooltip-youtube .ui-tooltip-icon{
287
+ border-color: #222;
288
+ }
289
+
290
+ .ui-tooltip-youtube .ui-tooltip-titlebar .ui-state-hover{
291
+ border-color: #303030;
292
+ }
293
+
294
+
295
+ /* jQuery TOOLS Tooltip style */
296
+ .ui-tooltip-jtools{
297
+ background: #232323;
298
+ background: rgba(0, 0, 0, 0.7);
299
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#717171), to(#232323));
300
+ background-image: -moz-linear-gradient(top, #717171, #232323);
301
+ background-image: -webkit-linear-gradient(top, #717171, #232323);
302
+ background-image: -ms-linear-gradient(top, #717171, #232323);
303
+ background-image: -o-linear-gradient(top, #717171, #232323);
304
+
305
+ border: 2px solid #ddd;
306
+ border: 2px solid rgba(241,241,241,1);
307
+
308
+ -moz-border-radius: 2px;
309
+ -webkit-border-radius: 2px;
310
+ border-radius: 2px;
311
+
312
+ -webkit-box-shadow: 0 0 12px #333;
313
+ -moz-box-shadow: 0 0 12px #333;
314
+ box-shadow: 0 0 12px #333;
315
+ }
316
+
317
+ /* IE Specific */
318
+ .ui-tooltip-jtools .ui-tooltip-titlebar{
319
+ background-color: transparent;
320
+ filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#717171,endColorstr=#4A4A4A);
321
+ -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#717171,endColorstr=#4A4A4A)";
322
+ }
323
+ .ui-tooltip-jtools .ui-tooltip-content{
324
+ filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4A4A4A,endColorstr=#232323);
325
+ -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#4A4A4A,endColorstr=#232323)";
326
+ }
327
+
328
+ .ui-tooltip-jtools .ui-tooltip-titlebar,
329
+ .ui-tooltip-jtools .ui-tooltip-content{
330
+ background: transparent;
331
+ color: white;
332
+ border: 0 dashed transparent;
333
+ }
334
+
335
+ .ui-tooltip-jtools .ui-tooltip-icon{
336
+ border-color: #555;
337
+ }
338
+
339
+ .ui-tooltip-jtools .ui-tooltip-titlebar .ui-state-hover{
340
+ border-color: #333;
341
+ }
342
+
343
+
344
+ /* Cluetip style */
345
+ .ui-tooltip-cluetip{
346
+ -webkit-box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);
347
+ -moz-box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);
348
+ box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);
349
+
350
+ background-color: #D9D9C2;
351
+ color: #111;
352
+ border: 0 dashed transparent;
353
+ }
354
+
355
+ .ui-tooltip-cluetip .ui-tooltip-titlebar{
356
+ background-color: #87876A;
357
+ color: white;
358
+ border: 0 dashed transparent;
359
+ }
360
+
361
+ .ui-tooltip-cluetip .ui-tooltip-icon{
362
+ border-color: #808064;
363
+ }
364
+
365
+ .ui-tooltip-cluetip .ui-tooltip-titlebar .ui-state-hover{
366
+ border-color: #696952;
367
+ color: #696952;
368
+ }
369
+
370
+
371
+ /* Tipsy style */
372
+ .ui-tooltip-tipsy{
373
+ background: black;
374
+ background: rgba(0, 0, 0, .87);
375
+
376
+ color: white;
377
+ border: 0 solid transparent;
378
+
379
+ font-size: 11px;
380
+ font-family: 'Lucida Grande', sans-serif;
381
+ font-weight: bold;
382
+ line-height: 16px;
383
+ text-shadow: 0 1px black;
384
+ }
385
+
386
+ .ui-tooltip-tipsy .ui-tooltip-titlebar{
387
+ padding: 6px 35px 0 10;
388
+ background-color: transparent;
389
+ }
390
+
391
+ .ui-tooltip-tipsy .ui-tooltip-content{
392
+ padding: 6px 10;
393
+ }
394
+
395
+ .ui-tooltip-tipsy .ui-tooltip-icon{
396
+ border-color: #222;
397
+ text-shadow: none;
398
+ }
399
+
400
+ .ui-tooltip-tipsy .ui-tooltip-titlebar .ui-state-hover{
401
+ border-color: #303030;
402
+ }
403
+
404
+
405
+ /* Tipped style */
406
+ .ui-tooltip-tipped{
407
+ border: 3px solid #959FA9;
408
+
409
+ -moz-border-radius: 3px;
410
+ -webkit-border-radius: 3px;
411
+ border-radius: 3px;
412
+
413
+ background-color: #F9F9F9;
414
+ color: #454545;
415
+
416
+ font-weight: normal;
417
+ font-family: serif;
418
+ }
419
+
420
+ .ui-tooltip-tipped .ui-tooltip-titlebar{
421
+ border-bottom-width: 0;
422
+
423
+ color: white;
424
+ background: #3A79B8;
425
+ background-image: -webkit-gradient(linear, left top, left bottom, from(#3A79B8), to(#2E629D));
426
+ background-image: -webkit-linear-gradient(top, #3A79B8, #2E629D);
427
+ background-image: -moz-linear-gradient(top, #3A79B8, #2E629D);
428
+ background-image: -ms-linear-gradient(top, #3A79B8, #2E629D);
429
+ background-image: -o-linear-gradient(top, #3A79B8, #2E629D);
430
+ filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#3A79B8,endColorstr=#2E629D);
431
+ -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#3A79B8,endColorstr=#2E629D)";
432
+ }
433
+
434
+ .ui-tooltip-tipped .ui-tooltip-icon{
435
+ border: 2px solid #285589;
436
+ background: #285589;
437
+ }
438
+
439
+ .ui-tooltip-tipped .ui-tooltip-icon .ui-icon{
440
+ background-color: #FBFBFB;
441
+ color: #555;
442
+ }
443
+
444
+
445
+ /**
446
+ * Twitter Bootstrap style.
447
+ *
448
+ * Tested with IE 8, IE 9, Chrome 18, Firefox 9, Opera 11.
449
+ * Does not work with IE 7.
450
+ */
451
+ .ui-tooltip-bootstrap{
452
+ /** Taken from Bootstrap body */
453
+ font-size: 14px;
454
+ line-height: 20px;
455
+ color: #333333;
456
+
457
+ /** Taken from Bootstrap .popover */
458
+ padding: 1px;
459
+ background-color: #ffffff;
460
+ border: 1px solid #ccc;
461
+ border: 1px solid rgba(0, 0, 0, 0.2);
462
+ -webkit-border-radius: 6px;
463
+ -moz-border-radius: 6px;
464
+ border-radius: 6px;
465
+ -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
466
+ -moz-box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
467
+ box-shadow: 0 5px 10px rgba(0, 0, 0, 0.2);
468
+ -webkit-background-clip: padding-box;
469
+ -moz-background-clip: padding;
470
+ background-clip: padding-box;
471
+ }
472
+
473
+ .ui-tooltip-bootstrap .ui-tooltip-titlebar{
474
+ /** Taken from Bootstrap .popover-title */
475
+ padding: 8px 14px;
476
+ margin: 0;
477
+ font-size: 14px;
478
+ font-weight: normal;
479
+ line-height: 18px;
480
+ background-color: #f7f7f7;
481
+ border-bottom: 1px solid #ebebeb;
482
+ -webkit-border-radius: 5px 5px 0 0;
483
+ -moz-border-radius: 5px 5px 0 0;
484
+ border-radius: 5px 5px 0 0;
485
+ }
486
+
487
+ .ui-tooltip-bootstrap .ui-tooltip-titlebar .ui-state-default{
488
+ /**
489
+ * Overrides qTip2:
490
+ * .ui-tooltip-titlebar .ui-state-default{
491
+ * [...]
492
+ * right: 4px;
493
+ * top: 50%;
494
+ * [...]
495
+ * border-style: solid;
496
+ * }
497
+ */
498
+ right: 11px;
499
+ top: 45%;
500
+ border-style: none;
501
+ }
502
+
503
+ .ui-tooltip-bootstrap .ui-tooltip-content{
504
+ /** Taken from Bootstrap .popover-content */
505
+ padding: 9px 14px;
506
+ }
507
+
508
+ .ui-tooltip-bootstrap .ui-tooltip-icon{
509
+ /**
510
+ * Overrides qTip2:
511
+ * .ui-tooltip-default .ui-tooltip-icon {
512
+ * border-color: #CCC;
513
+ * background: #F1F1F1;
514
+ * color: #777;
515
+ * }
516
+ */
517
+ background: transparent;
518
+ }
519
+
520
+ .ui-tooltip-bootstrap .ui-tooltip-icon .ui-icon{
521
+ /**
522
+ * Overrides qTip2:
523
+ * .ui-tooltip-icon .ui-icon{
524
+ * width: 18px;
525
+ * height: 14px;
526
+ * }
527
+ */
528
+ width: auto;
529
+ height: auto;
530
+
531
+ /* Taken from Bootstrap .close */
532
+ float: right;
533
+ font-size: 20px;
534
+ font-weight: bold;
535
+ line-height: 18px;
536
+ color: #000000;
537
+ text-shadow: 0 1px 0 #ffffff;
538
+ opacity: 0.2;
539
+ filter: alpha(opacity=20);
540
+ }
541
+
542
+ .ui-tooltip-bootstrap .ui-tooltip-icon .ui-icon:hover{
543
+ /* Taken from Bootstrap .close:hover */
544
+ color: #000000;
545
+ text-decoration: none;
546
+ cursor: pointer;
547
+ opacity: 0.4;
548
+ filter: alpha(opacity=40);
549
+ }
550
+
551
+
552
+ /* IE9 fix - removes all filters */
553
+ .ui-tooltip:not(.ie9haxors) div.ui-tooltip-content,
554
+ .ui-tooltip:not(.ie9haxors) div.ui-tooltip-titlebar{
555
+ filter: none;
556
+ -ms-filter: none;
557
+ }
558
+
559
+
560
+ /* Tips plugin */
561
+ .ui-tooltip .ui-tooltip-tip{
562
+ margin: 0 auto;
563
+ overflow: hidden;
564
+ z-index: 10;
565
+ }
566
+
567
+ .ui-tooltip .ui-tooltip-tip,
568
+ .ui-tooltip .ui-tooltip-tip .qtip-vml{
569
+ position: absolute;
570
+
571
+ line-height: 0.1px !important;
572
+ font-size: 0.1px !important;
573
+ color: #123456;
574
+
575
+ background: transparent;
576
+ border: 0 dashed transparent;
577
+ }
578
+
579
+ .ui-tooltip .ui-tooltip-tip canvas{ top: 0; left: 0; }
580
+
581
+ .ui-tooltip .ui-tooltip-tip .qtip-vml{
582
+ behavior: url(#default#VML);
583
+ display: inline-block;
584
+ visibility: visible;
585
+ }
586
+ /* Modal plugin */
587
+ #qtip-overlay{
588
+ position: fixed;
589
+ left: -10000em;
590
+ top: -10000em;
591
+ }
592
+
593
+ /* Applied to modals with show.modal.blur set to true */
594
+ #qtip-overlay.blurs{ cursor: pointer; }
595
+
596
+ /* Change opacity of overlay here */
597
+ #qtip-overlay div{
598
+ position: absolute;
599
+ left: 0; top: 0;
600
+ width: 100%; height: 100%;
601
+
602
+ background-color: black;
603
+
604
+ opacity: 0.7;
605
+ filter:alpha(opacity=70);
606
+ -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
607
+ }
608
+