jquery-qtip2-wrapper-rails 2.2.0

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