mirror of
https://github.com/Oreolek/ifhub.club.git
synced 2024-07-03 06:55:03 +03:00
75 lines
2.6 KiB
CSS
75 lines
2.6 KiB
CSS
/**
|
|
* Tooltip
|
|
*
|
|
* @license GNU General Public License, version 2
|
|
* @copyright 2013 OOO "ЛС-СОФТ" {@link http://livestreetcms.com}
|
|
* @author Denis Shakhov <denis.shakhov@gmail.com>
|
|
*/
|
|
|
|
.ls-tooltip {
|
|
display: none;
|
|
position: absolute;
|
|
z-index: 9999;
|
|
min-width: 50px;
|
|
max-width: 300px;
|
|
background-color: #222;
|
|
font-size: 11px;
|
|
line-height: 16px;
|
|
color: #fff;
|
|
-webkit-box-shadow: 0 0 15px rgba(0,0,0,.3);
|
|
box-shadow: 0 0 15px rgba(0,0,0,.3);
|
|
-webkit-border-radius: 5px;
|
|
-moz-border-radius: 5px;
|
|
border-radius: 5px;
|
|
}
|
|
.ls-tooltip-title { padding: 13px 15px 0; font-weight: bold; }
|
|
.ls-tooltip-content { padding: 10px 15px; }
|
|
|
|
/* Loading */
|
|
.ls-tooltip-content.ls-loading { width: 50px; height: 50px; }
|
|
|
|
/* Arrow */
|
|
.ls-tooltip:after,
|
|
.ls-tooltip:before {
|
|
content: '';
|
|
position: absolute;
|
|
top: auto;
|
|
right: auto;
|
|
bottom: auto;
|
|
left: auto;
|
|
width: 0;
|
|
height: 0;
|
|
border: 6px solid transparent;
|
|
}
|
|
.ls-tooltip:before { border-width: 7px; }
|
|
|
|
.ls-tooltip.position-y-top:after { left: 50%; top: -12px; margin-left: -6px; border-bottom-color: #222; }
|
|
.ls-tooltip.position-y-top:before { left: 50%; top: -14px; margin-left: -7px; border-bottom-color: #222; }
|
|
|
|
.ls-tooltip.position-y-bottom:after { left: 50%; bottom: -12px; margin-left: -6px; border-top-color: #222; }
|
|
.ls-tooltip.position-y-bottom:before { left: 50%; bottom: -14px; margin-left: -7px; border-top-color: #222; }
|
|
|
|
.ls-tooltip.position-x-right:after { top: 50%; right: -12px; margin-top: -6px; border-left-color: #222; }
|
|
.ls-tooltip.position-x-right:before { top: 50%; right: -14px; margin-top: -7px; border-left-color: #222; }
|
|
|
|
.ls-tooltip.position-x-left:after { top: 50%; left: -12px; margin-top: -6px; border-right-color: #222; }
|
|
.ls-tooltip.position-x-left:before { top: 50%; left: -14px; margin-top: -7px; border-right-color: #222; }
|
|
|
|
|
|
/**
|
|
* Light skin
|
|
*/
|
|
.ls-tooltip-light { background: #fff; color: #000; border: 1px solid #ddd; }
|
|
.ls-tooltip-light .ls-tooltip-title { color: #000; }
|
|
|
|
.ls-tooltip-light.position-y-top:after { border-bottom-color: #fff; }
|
|
.ls-tooltip-light.position-y-top:before { border-bottom-color: #ccc; }
|
|
|
|
.ls-tooltip-light.position-y-bottom:after { border-top-color: #fff; }
|
|
.ls-tooltip-light.position-y-bottom:before { border-top-color: #ccc; }
|
|
|
|
.ls-tooltip-light.position-x-right:after { border-left-color: #fff; }
|
|
.ls-tooltip-light.position-x-right:before { border-left-color: #ccc; }
|
|
|
|
.ls-tooltip-light.position-x-left:after { border-right-color: #fff; }
|
|
.ls-tooltip-light.position-x-left:before { border-right-color: #ccc; } |