You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
265 lines
4.3 KiB
CSS
265 lines
4.3 KiB
CSS
5 years ago
|
/*
|
||
|
* qTip2 - Pretty powerful tooltips - v2.1.1
|
||
|
* http://qtip2.com
|
||
|
*
|
||
|
* Copyright (c) 2013 Craig Michael Thompson
|
||
|
* Released under the MIT, GPL licenses
|
||
|
* http://jquery.org/license
|
||
|
*
|
||
|
* Date: Fri Aug 30 2013 08:44 UTC+0000
|
||
|
* Plugins: tips
|
||
|
* Styles: basic
|
||
|
*/
|
||
|
.qtip{
|
||
|
position: absolute;
|
||
|
left: -28000px;
|
||
|
top: -28000px;
|
||
|
display: none;
|
||
|
|
||
|
max-width: 280px;
|
||
|
min-width: 50px;
|
||
|
|
||
|
font-size: 10.5px;
|
||
|
line-height: 12px;
|
||
|
|
||
|
direction: ltr;
|
||
|
|
||
|
box-shadow: none;
|
||
|
padding: 0;
|
||
|
}
|
||
|
|
||
|
.qtip-content{
|
||
|
position: relative;
|
||
|
padding: 5px 9px;
|
||
|
overflow: hidden;
|
||
|
|
||
|
text-align: left;
|
||
|
word-wrap: break-word;
|
||
|
}
|
||
|
|
||
|
.qtip-titlebar{
|
||
|
position: relative;
|
||
|
padding: 5px 35px 5px 10px;
|
||
|
overflow: hidden;
|
||
|
|
||
|
border-width: 0 0 1px;
|
||
|
font-weight: bold;
|
||
|
}
|
||
|
|
||
|
.qtip-titlebar + .qtip-content{ border-top-width: 0 !important; }
|
||
|
|
||
|
/* Default close button class */
|
||
|
.qtip-close{
|
||
|
position: absolute;
|
||
|
right: -9px; top: -9px;
|
||
|
|
||
|
cursor: pointer;
|
||
|
outline: medium none;
|
||
|
|
||
|
border-width: 1px;
|
||
|
border-style: solid;
|
||
|
border-color: transparent;
|
||
|
}
|
||
|
|
||
|
.qtip-titlebar .qtip-close{
|
||
|
right: 4px; top: 50%;
|
||
|
margin-top: -9px;
|
||
|
}
|
||
|
|
||
|
* html .qtip-titlebar .qtip-close{ top: 16px; } /* IE fix */
|
||
|
|
||
|
.qtip-titlebar .ui-icon,
|
||
|
.qtip-icon .ui-icon{
|
||
|
display: block;
|
||
|
text-indent: -1000em;
|
||
|
direction: ltr;
|
||
|
}
|
||
|
|
||
|
.qtip-icon, .qtip-icon .ui-icon{
|
||
|
-moz-border-radius: 3px;
|
||
|
-webkit-border-radius: 3px;
|
||
|
border-radius: 3px;
|
||
|
text-decoration: none;
|
||
|
}
|
||
|
|
||
|
.qtip-icon .ui-icon{
|
||
|
width: 18px;
|
||
|
height: 14px;
|
||
|
|
||
|
line-height: 14px;
|
||
|
text-align: center;
|
||
|
text-indent: 0;
|
||
|
font: normal bold 10px/13px Tahoma,sans-serif;
|
||
|
|
||
|
color: inherit;
|
||
|
background: transparent none no-repeat -100em -100em;
|
||
|
}
|
||
|
|
||
|
/* Applied to 'focused' tooltips e.g. most recently displayed/interacted with */
|
||
|
.qtip-focus{}
|
||
|
|
||
|
/* Applied on hover of tooltips i.e. added/removed on mouseenter/mouseleave respectively */
|
||
|
.qtip-hover{}
|
||
|
|
||
|
/* Default tooltip style */
|
||
|
.qtip-default{
|
||
|
border-width: 1px;
|
||
|
border-style: solid;
|
||
|
border-color: #F1D031;
|
||
|
|
||
|
background-color: #FFFFA3;
|
||
|
color: #555;
|
||
|
}
|
||
|
|
||
|
.qtip-default .qtip-titlebar{
|
||
|
background-color: #FFEF93;
|
||
|
}
|
||
|
|
||
|
.qtip-default .qtip-icon{
|
||
|
border-color: #CCC;
|
||
|
background: #F1F1F1;
|
||
|
color: #777;
|
||
|
}
|
||
|
|
||
|
.qtip-default .qtip-titlebar .qtip-close{
|
||
|
border-color: #AAA;
|
||
|
color: #111;
|
||
|
}
|
||
|
|
||
|
|
||
|
|
||
|
/*! Light tooltip style */
|
||
|
.qtip-light{
|
||
|
background-color: white;
|
||
|
border-color: #E2E2E2;
|
||
|
color: #454545;
|
||
|
}
|
||
|
|
||
|
.qtip-light .qtip-titlebar{
|
||
|
background-color: #f1f1f1;
|
||
|
}
|
||
|
|
||
|
|
||
|
/*! Dark tooltip style */
|
||
|
.qtip-dark{
|
||
|
background-color: #505050;
|
||
|
border-color: #303030;
|
||
|
color: #f3f3f3;
|
||
|
}
|
||
|
|
||
|
.qtip-dark .qtip-titlebar{
|
||
|
background-color: #404040;
|
||
|
}
|
||
|
|
||
|
.qtip-dark .qtip-icon{
|
||
|
border-color: #444;
|
||
|
}
|
||
|
|
||
|
.qtip-dark .qtip-titlebar .ui-state-hover{
|
||
|
border-color: #303030;
|
||
|
}
|
||
|
|
||
|
|
||
|
/*! Cream tooltip style */
|
||
|
.qtip-cream{
|
||
|
background-color: #FBF7AA;
|
||
|
border-color: #F9E98E;
|
||
|
color: #A27D35;
|
||
|
}
|
||
|
|
||
|
.qtip-cream .qtip-titlebar{
|
||
|
background-color: #F0DE7D;
|
||
|
}
|
||
|
|
||
|
.qtip-cream .qtip-close .qtip-icon{
|
||
|
background-position: -82px 0;
|
||
|
}
|
||
|
|
||
|
|
||
|
/*! Red tooltip style */
|
||
|
.qtip-red{
|
||
|
background-color: #F78B83;
|
||
|
border-color: #D95252;
|
||
|
color: #912323;
|
||
|
}
|
||
|
|
||
|
.qtip-red .qtip-titlebar{
|
||
|
background-color: #F06D65;
|
||
|
}
|
||
|
|
||
|
.qtip-red .qtip-close .qtip-icon{
|
||
|
background-position: -102px 0;
|
||
|
}
|
||
|
|
||
|
.qtip-red .qtip-icon{
|
||
|
border-color: #D95252;
|
||
|
}
|
||
|
|
||
|
.qtip-red .qtip-titlebar .ui-state-hover{
|
||
|
border-color: #D95252;
|
||
|
}
|
||
|
|
||
|
|
||
|
/*! Green tooltip style */
|
||
|
.qtip-green{
|
||
|
background-color: #CAED9E;
|
||
|
border-color: #90D93F;
|
||
|
color: #3F6219;
|
||
|
}
|
||
|
|
||
|
.qtip-green .qtip-titlebar{
|
||
|
background-color: #B0DE78;
|
||
|
}
|
||
|
|
||
|
.qtip-green .qtip-close .qtip-icon{
|
||
|
background-position: -42px 0;
|
||
|
}
|
||
|
|
||
|
|
||
|
/*! Blue tooltip style */
|
||
|
.qtip-blue{
|
||
|
background-color: #E5F6FE;
|
||
|
border-color: #ADD9ED;
|
||
|
color: #5E99BD;
|
||
|
}
|
||
|
|
||
|
.qtip-blue .qtip-titlebar{
|
||
|
background-color: #D0E9F5;
|
||
|
}
|
||
|
|
||
|
.qtip-blue .qtip-close .qtip-icon{
|
||
|
background-position: -2px 0;
|
||
|
}
|
||
|
|
||
|
|
||
|
|
||
|
.qtip .qtip-tip{
|
||
|
margin: 0 auto;
|
||
|
overflow: hidden;
|
||
|
z-index: 10;
|
||
|
|
||
|
}
|
||
|
|
||
|
/* Opera bug #357 - Incorrect tip position
|
||
|
https://github.com/Craga89/qTip2/issues/367 */
|
||
|
x:-o-prefocus, .qtip .qtip-tip{
|
||
|
visibility: hidden;
|
||
|
}
|
||
|
|
||
|
.qtip .qtip-tip,
|
||
|
.qtip .qtip-tip .qtip-vml,
|
||
|
.qtip .qtip-tip canvas{
|
||
|
position: absolute;
|
||
|
|
||
|
color: #123456;
|
||
|
background: transparent;
|
||
|
border: 0 dashed transparent;
|
||
|
}
|
||
|
|
||
|
.qtip .qtip-tip canvas{ top: 0; left: 0; }
|
||
|
|
||
|
.qtip .qtip-tip .qtip-vml{
|
||
|
behavior: url(#default#VML);
|
||
|
display: inline-block;
|
||
|
visibility: visible;
|
||
|
}
|