Archived
Style tooltips
This commit is contained in:
nikolark committed
1 parent
11397beebc
commit
b8bfec6809
9 files changed
+3851
-22
No files matched your search
@@ -0,0 +1,556 @@
|
||||
/*
|
||||
* qTip2 - Pretty powerful tooltips
|
||||
* http://craigsworks.com/projects/qtip2/
|
||||
*
|
||||
* Version: nightly
|
||||
* Copyright 2009-2010 Craig Michael Thompson - http://craigsworks.com
|
||||
*
|
||||
* Dual licensed under MIT or GPLv2 licenses
|
||||
* http://en.wikipedia.org/wiki/MIT_License
|
||||
* http://en.wikipedia.org/wiki/GNU_General_Public_License
|
||||
*
|
||||
* Date: Mon Dec 19 15:43:28.0000000000 2011
|
||||
*/
|
||||
|
||||
/* Core qTip styles */
|
||||
.ui-tooltip, .qtip{
|
||||
position: absolute;
|
||||
left: -28000px;
|
||||
top: -28000px;
|
||||
display: none;
|
||||
|
||||
max-width: 280px;
|
||||
min-width: 50px;
|
||||
|
||||
font-size: 10.5px;
|
||||
line-height: 12px;
|
||||
}
|
||||
|
||||
/* Fluid class for determining actual width in IE */
|
||||
.ui-tooltip-fluid{
|
||||
display: block;
|
||||
visibility: hidden;
|
||||
position: static !important;
|
||||
float: left !important;
|
||||
}
|
||||
|
||||
.ui-tooltip-content{
|
||||
position: relative;
|
||||
padding: 5px 9px;
|
||||
overflow: hidden;
|
||||
|
||||
border: 1px solid #000001;
|
||||
|
||||
text-align: left;
|
||||
word-wrap: break-word;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.ui-tooltip-titlebar{
|
||||
position: relative;
|
||||
min-height: 14px;
|
||||
padding: 5px 35px 5px 10px;
|
||||
overflow: hidden;
|
||||
|
||||
border: 1px solid #000001;
|
||||
border-width: 1px 1px 0;
|
||||
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.ui-tooltip-titlebar + .ui-tooltip-content{ border-top-width: 0px !important; }
|
||||
|
||||
/*! Default close button class */
|
||||
.ui-tooltip-titlebar .ui-state-default{
|
||||
position: absolute;
|
||||
right: 4px;
|
||||
top: 50%;
|
||||
margin-top: -9px;
|
||||
|
||||
cursor: pointer;
|
||||
outline: medium none;
|
||||
|
||||
border-width: 1px;
|
||||
border-style: solid;
|
||||
}
|
||||
|
||||
* html .ui-tooltip-titlebar .ui-state-default{ top: 16px; } /* IE fix */
|
||||
|
||||
.ui-tooltip-titlebar .ui-icon,
|
||||
.ui-tooltip-icon .ui-icon{
|
||||
display: block;
|
||||
text-indent: -1000em;
|
||||
}
|
||||
|
||||
.ui-tooltip-icon, .ui-tooltip-icon .ui-icon{
|
||||
-moz-border-radius: 3px;
|
||||
-webkit-border-radius: 3px;
|
||||
border-radius: 3px;
|
||||
}
|
||||
|
||||
.ui-tooltip-icon .ui-icon{
|
||||
width: 18px;
|
||||
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 */
|
||||
.ui-tooltip-focus{
|
||||
|
||||
}
|
||||
|
||||
/* Applied on hover of tooltips i.e. added/removed on mouseenter/mouseleave respectively */
|
||||
.ui-tooltip-hover{
|
||||
|
||||
}
|
||||
|
||||
|
||||
/*! Default tooltip style */
|
||||
.ui-tooltip-default .ui-tooltip-titlebar,
|
||||
.ui-tooltip-default .ui-tooltip-content{
|
||||
border-color: #F1D031;
|
||||
background-color: #FFFFA3;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
.ui-tooltip-default .ui-tooltip-titlebar{
|
||||
background-color: #FFEF93;
|
||||
}
|
||||
|
||||
.ui-tooltip-default .ui-tooltip-icon{
|
||||
border-color: #CCC;
|
||||
background: #F1F1F1;
|
||||
color: #777;
|
||||
}
|
||||
|
||||
.ui-tooltip-default .ui-tooltip-titlebar .ui-state-hover{
|
||||
border-color: #AAA;
|
||||
color: #111;
|
||||
}
|
||||
|
||||
/* Tips plugin */
|
||||
.ui-tooltip .ui-tooltip-tip{
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.ui-tooltip .ui-tooltip-tip,
|
||||
.ui-tooltip .ui-tooltip-tip *{
|
||||
position: absolute;
|
||||
|
||||
line-height: 0.1px !important;
|
||||
font-size: 0.1px !important;
|
||||
color: #123456;
|
||||
|
||||
background: transparent;
|
||||
border: 0px dashed transparent;
|
||||
}
|
||||
|
||||
.ui-tooltip .ui-tooltip-tip canvas{ top: 0; left: 0; }
|
||||
|
||||
|
||||
/* Modal plugin */
|
||||
#qtip-overlay{
|
||||
position: fixed;
|
||||
left: -10000em;
|
||||
top: -10000em;
|
||||
}
|
||||
|
||||
/* Applied to modals with show.modal.blur set to true */
|
||||
#qtip-overlay.blurs{ cursor: pointer; }
|
||||
|
||||
/* Change opacity of overlay here */
|
||||
#qtip-overlay div{
|
||||
position: absolute;
|
||||
left: 0; top: 0;
|
||||
width: 100%; height: 100%;
|
||||
|
||||
background-color: black;
|
||||
|
||||
opacity: 0.7;
|
||||
filter:alpha(opacity=70);
|
||||
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";
|
||||
}
|
||||
|
||||
/*! Light tooltip style */
|
||||
.ui-tooltip-light .ui-tooltip-titlebar,
|
||||
.ui-tooltip-light .ui-tooltip-content{
|
||||
border-color: #E2E2E2;
|
||||
color: #454545;
|
||||
}
|
||||
|
||||
.ui-tooltip-light .ui-tooltip-content{
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
.ui-tooltip-light .ui-tooltip-titlebar{
|
||||
background-color: #f1f1f1;
|
||||
}
|
||||
|
||||
|
||||
/*! Dark tooltip style */
|
||||
.ui-tooltip-dark .ui-tooltip-titlebar,
|
||||
.ui-tooltip-dark .ui-tooltip-content{
|
||||
border-color: #303030;
|
||||
color: #f3f3f3;
|
||||
}
|
||||
|
||||
.ui-tooltip-dark .ui-tooltip-content{
|
||||
background-color: #505050;
|
||||
}
|
||||
|
||||
.ui-tooltip-dark .ui-tooltip-titlebar{
|
||||
background-color: #404040;
|
||||
}
|
||||
|
||||
.ui-tooltip-dark .ui-tooltip-icon{
|
||||
border-color: #444;
|
||||
}
|
||||
|
||||
.ui-tooltip-dark .ui-tooltip-titlebar .ui-state-hover{
|
||||
border-color: #303030;
|
||||
}
|
||||
|
||||
|
||||
/*! Cream tooltip style */
|
||||
.ui-tooltip-cream .ui-tooltip-titlebar,
|
||||
.ui-tooltip-cream .ui-tooltip-content{
|
||||
border-color: #F9E98E;
|
||||
color: #A27D35;
|
||||
}
|
||||
|
||||
.ui-tooltip-cream .ui-tooltip-content{
|
||||
background-color: #FBF7AA;
|
||||
}
|
||||
|
||||
.ui-tooltip-cream .ui-tooltip-titlebar{
|
||||
background-color: #F0DE7D;
|
||||
}
|
||||
|
||||
.ui-tooltip-cream .ui-state-default .ui-tooltip-icon{
|
||||
background-position: -82px 0;
|
||||
}
|
||||
|
||||
|
||||
/*! Red tooltip style */
|
||||
.ui-tooltip-red .ui-tooltip-titlebar,
|
||||
.ui-tooltip-red .ui-tooltip-content{
|
||||
border-color: #D95252;
|
||||
color: #912323;
|
||||
}
|
||||
|
||||
.ui-tooltip-red .ui-tooltip-content{
|
||||
background-color: #F78B83;
|
||||
}
|
||||
|
||||
.ui-tooltip-red .ui-tooltip-titlebar{
|
||||
background-color: #F06D65;
|
||||
}
|
||||
|
||||
.ui-tooltip-red .ui-state-default .ui-tooltip-icon{
|
||||
background-position: -102px 0;
|
||||
}
|
||||
|
||||
.ui-tooltip-red .ui-tooltip-icon{
|
||||
border-color: #D95252;
|
||||
}
|
||||
|
||||
.ui-tooltip-red .ui-tooltip-titlebar .ui-state-hover{
|
||||
border-color: #D95252;
|
||||
}
|
||||
|
||||
|
||||
/*! Green tooltip style */
|
||||
.ui-tooltip-green .ui-tooltip-titlebar,
|
||||
.ui-tooltip-green .ui-tooltip-content{
|
||||
border-color: #90D93F;
|
||||
color: #3F6219;
|
||||
}
|
||||
|
||||
.ui-tooltip-green .ui-tooltip-content{
|
||||
background-color: #CAED9E;
|
||||
}
|
||||
|
||||
.ui-tooltip-green .ui-tooltip-titlebar{
|
||||
background-color: #B0DE78;
|
||||
}
|
||||
|
||||
.ui-tooltip-green .ui-state-default .ui-tooltip-icon{
|
||||
background-position: -42px 0;
|
||||
}
|
||||
|
||||
|
||||
/*! Blue tooltip style */
|
||||
.ui-tooltip-blue .ui-tooltip-titlebar,
|
||||
.ui-tooltip-blue .ui-tooltip-content{
|
||||
border-color: #ADD9ED;
|
||||
color: #5E99BD;
|
||||
}
|
||||
|
||||
.ui-tooltip-blue .ui-tooltip-content{
|
||||
background-color: #E5F6FE;
|
||||
}
|
||||
|
||||
.ui-tooltip-blue .ui-tooltip-titlebar{
|
||||
background-color: #D0E9F5;
|
||||
}
|
||||
|
||||
.ui-tooltip-blue .ui-state-default .ui-tooltip-icon{
|
||||
background-position: -2px 0;
|
||||
}
|
||||
|
||||
/*! Add shadows to your tooltips in: FF3+, Chrome 2+, Opera 10.6+, IE6+, Safari 2+ */
|
||||
.ui-tooltip-shadow{
|
||||
-webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
|
||||
-moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
|
||||
box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
|
||||
}
|
||||
|
||||
.ui-tooltip-shadow .ui-tooltip-titlebar,
|
||||
.ui-tooltip-shadow .ui-tooltip-content{
|
||||
filter: progid:DXImageTransform.Microsoft.Shadow(Color='gray', Direction=135, Strength=3);
|
||||
-ms-filter:"progid:DXImageTransform.Microsoft.Shadow(Color='gray', Direction=135, Strength=3)";
|
||||
|
||||
_margin-bottom: -3px; /* IE6 */
|
||||
.margin-bottom: -3px; /* IE7 */
|
||||
}
|
||||
|
||||
|
||||
/*! Add rounded corners to your tooltips in: FF3+, Chrome 2+, Opera 10.6+, IE9+, Safari 2+ */
|
||||
.ui-tooltip-rounded,
|
||||
.ui-tooltip-rounded .ui-tooltip-content,
|
||||
.ui-tooltip-tipsy,
|
||||
.ui-tooltip-tipsy .ui-tooltip-content,
|
||||
.ui-tooltip-youtube,
|
||||
.ui-tooltip-youtube .ui-tooltip-content{
|
||||
-moz-border-radius: 4px;
|
||||
-webkit-border-radius: 4px;
|
||||
border-radius: 4px;
|
||||
}
|
||||
|
||||
.ui-tooltip-rounded .ui-tooltip-titlebar,
|
||||
.ui-tooltip-tipsy .ui-tooltip-titlebar,
|
||||
.ui-tooltip-youtube .ui-tooltip-titlebar{
|
||||
-moz-border-radius: 5px 5px 0 0;
|
||||
-webkit-border-radius: 5px 5px 0 0;
|
||||
border-radius: 5px 5px 0 0;
|
||||
}
|
||||
|
||||
.ui-tooltip-rounded .ui-tooltip-titlebar + .ui-tooltip-content,
|
||||
.ui-tooltip-tipsy .ui-tooltip-titlebar + .ui-tooltip-content,
|
||||
.ui-tooltip-youtube .ui-tooltip-titlebar + .ui-tooltip-content{
|
||||
-moz-border-radius: 0 0 5px 5px;
|
||||
-webkit-border-radius: 0 0 5px 5px;
|
||||
border-radius: 0 0 5px 5px;
|
||||
}
|
||||
|
||||
|
||||
/*! Youtube tooltip style */
|
||||
.ui-tooltip-youtube{
|
||||
-webkit-box-shadow: 0 0 3px #333;
|
||||
-moz-box-shadow: 0 0 3px #333;
|
||||
box-shadow: 0 0 3px #333;
|
||||
}
|
||||
|
||||
.ui-tooltip-youtube .ui-tooltip-titlebar,
|
||||
.ui-tooltip-youtube .ui-tooltip-content{
|
||||
_margin-bottom: 0; /* IE6 */
|
||||
.margin-bottom: 0; /* IE7 */
|
||||
|
||||
background: transparent;
|
||||
background: rgba(0, 0, 0, 0.85);
|
||||
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#D9000000,endColorstr=#D9000000);
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#D9000000,endColorstr=#D9000000)";
|
||||
|
||||
color: white;
|
||||
border-color: #CCCCCC;
|
||||
}
|
||||
|
||||
.ui-tooltip-youtube .ui-tooltip-icon{
|
||||
border-color: #222;
|
||||
}
|
||||
|
||||
.ui-tooltip-youtube .ui-tooltip-titlebar .ui-state-hover{
|
||||
border-color: #303030;
|
||||
}
|
||||
|
||||
|
||||
/* jQuery TOOLS Tooltip style */
|
||||
.ui-tooltip-jtools{
|
||||
background: #232323;
|
||||
background: rgba(0, 0, 0, 0.7);
|
||||
background-image: -moz-linear-gradient(top, #717171, #232323);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#717171), to(#232323));
|
||||
|
||||
border: 2px solid #ddd;
|
||||
border: 2px solid rgba(241,241,241,1);
|
||||
|
||||
-moz-border-radius: 2px;
|
||||
-webkit-border-radius: 2px;
|
||||
border-radius: 2px;
|
||||
|
||||
-webkit-box-shadow: 0 0 12px #333;
|
||||
-moz-box-shadow: 0 0 12px #333;
|
||||
box-shadow: 0 0 12px #333;
|
||||
}
|
||||
|
||||
/* IE Specific */
|
||||
.ui-tooltip-jtools .ui-tooltip-titlebar{
|
||||
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#717171,endColorstr=#4A4A4A);
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#717171,endColorstr=#4A4A4A)";
|
||||
}
|
||||
.ui-tooltip-jtools .ui-tooltip-content{
|
||||
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#4A4A4A,endColorstr=#232323);
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#4A4A4A,endColorstr=#232323)";
|
||||
}
|
||||
|
||||
.ui-tooltip-jtools .ui-tooltip-titlebar,
|
||||
.ui-tooltip-jtools .ui-tooltip-content{
|
||||
background: transparent;
|
||||
color: white;
|
||||
border: 0 dashed transparent;
|
||||
}
|
||||
|
||||
.ui-tooltip-jtools .ui-tooltip-icon{
|
||||
border-color: #555;
|
||||
}
|
||||
|
||||
.ui-tooltip-jtools .ui-tooltip-titlebar .ui-state-hover{
|
||||
border-color: #333;
|
||||
}
|
||||
|
||||
|
||||
/* Cluetip style */
|
||||
.ui-tooltip-cluetip{
|
||||
-webkit-box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);
|
||||
-moz-box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);
|
||||
box-shadow: 4px 4px 5px rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
|
||||
.ui-tooltip-cluetip .ui-tooltip-titlebar{
|
||||
background-color: #87876A;
|
||||
color: white;
|
||||
border: 0 dashed transparent;
|
||||
}
|
||||
|
||||
.ui-tooltip-cluetip .ui-tooltip-content{
|
||||
background-color: #D9D9C2;
|
||||
color: #111;
|
||||
border: 0 dashed transparent;
|
||||
}
|
||||
|
||||
.ui-tooltip-cluetip .ui-tooltip-icon{
|
||||
border-color: #808064;
|
||||
}
|
||||
|
||||
.ui-tooltip-cluetip .ui-tooltip-titlebar .ui-state-hover{
|
||||
border-color: #696952;
|
||||
color: #696952;
|
||||
}
|
||||
|
||||
|
||||
/* Tipsy style */
|
||||
.ui-tooltip-tipsy{
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.ui-tooltip-tipsy .ui-tooltip-titlebar,
|
||||
.ui-tooltip-tipsy .ui-tooltip-content{
|
||||
_margin-bottom: 0; /* IE6 */
|
||||
.margin-bottom: 0; /* IE7 */
|
||||
|
||||
background: transparent;
|
||||
background: rgba(0, 0, 0, .87);
|
||||
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#D9000000,endColorstr=#D9000000);
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#D9000000,endColorstr=#D9000000)";
|
||||
|
||||
color: white;
|
||||
border: 0px transparent;
|
||||
|
||||
font-size: 11px;
|
||||
font-family: 'Lucida Grande', sans-serif;
|
||||
font-weight: bold;
|
||||
line-height: 16px;
|
||||
text-shadow: 0 1px black;
|
||||
}
|
||||
|
||||
.ui-tooltip-tipsy .ui-tooltip-titlebar{
|
||||
padding: 6px 35px 0 10;
|
||||
}
|
||||
|
||||
.ui-tooltip-tipsy .ui-tooltip-content{
|
||||
padding: 6px 10;
|
||||
}
|
||||
|
||||
.ui-tooltip-tipsy .ui-tooltip-icon{
|
||||
border-color: #222;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
.ui-tooltip-tipsy .ui-tooltip-titlebar .ui-state-hover{
|
||||
border-color: #303030;
|
||||
}
|
||||
|
||||
|
||||
/* Tipped style */
|
||||
.ui-tooltip-tipped{
|
||||
|
||||
}
|
||||
|
||||
.ui-tooltip-tipped .ui-tooltip-titlebar,
|
||||
.ui-tooltip-tipped .ui-tooltip-content{
|
||||
border: 3px solid #959FA9;
|
||||
|
||||
filter: none; -ms-filter: none;
|
||||
}
|
||||
|
||||
.ui-tooltip-tipped .ui-tooltip-titlebar{
|
||||
background: #3A79B8;
|
||||
background-image: -moz-linear-gradient(top, #3A79B8, #2E629D);
|
||||
background-image: -webkit-gradient(linear, left top, left bottom, from(#3A79B8), to(#2E629D));
|
||||
filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#3A79B8,endColorstr=#2E629D);
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#3A79B8,endColorstr=#2E629D)";
|
||||
|
||||
color: white;
|
||||
font-weight: normal;
|
||||
font-family: serif;
|
||||
|
||||
border-bottom-width: 0;
|
||||
-moz-border-radius: 3px 3px 0 0;
|
||||
-webkit-border-radius: 3px 3px 0 0;
|
||||
border-radius: 3px 3px 0 0;
|
||||
}
|
||||
|
||||
.ui-tooltip-tipped .ui-tooltip-content{
|
||||
background-color: #F9F9F9;
|
||||
color: #454545;
|
||||
|
||||
-moz-border-radius: 0 0 3px 3px;
|
||||
-webkit-border-radius: 0 0 3px 3px;
|
||||
border-radius: 0 0 3px 3px;
|
||||
}
|
||||
|
||||
.ui-tooltip-tipped .ui-tooltip-icon{
|
||||
border: 2px solid #285589;
|
||||
background: #285589;
|
||||
}
|
||||
|
||||
.ui-tooltip-tipped .ui-tooltip-icon .ui-icon{
|
||||
background-color: #FBFBFB;
|
||||
color: #555;
|
||||
}
|
||||
|
||||
/* IE9 fix - removes all filters */
|
||||
.ui-tooltip:not(.ie9haxors) div.ui-tooltip-content,
|
||||
.ui-tooltip:not(.ie9haxors) div.ui-tooltip-titlebar{
|
||||
filter: none;
|
||||
-ms-filter: none;
|
||||
}
|
||||
File diff suppressed because it is too large.
Load diff
Vendored
+1
@@ -0,0 +1 @@
|
||||
.ui-tooltip,.qtip{position:absolute;left:-28000px;top:-28000px;display:none;max-width:280px;min-width:50px;font-size:10.5px;line-height:12px;}.ui-tooltip-fluid{display:block;visibility:hidden;position:static!important;float:left!important;}.ui-tooltip-content{position:relative;padding:5px 9px;overflow:hidden;border:1px solid #000001;text-align:left;word-wrap:break-word;overflow:hidden;}.ui-tooltip-titlebar{position:relative;min-height:14px;padding:5px 35px 5px 10px;overflow:hidden;border:1px solid #000001;border-width:1px 1px 0;font-weight:bold;}.ui-tooltip-titlebar+.ui-tooltip-content{border-top-width:0!important;}/*!Default close button class */ .ui-tooltip-titlebar .ui-state-default{position:absolute;right:4px;top:50%;margin-top:-9px;cursor:pointer;outline:medium none;border-width:1px;border-style:solid;}* html .ui-tooltip-titlebar .ui-state-default{top:16px;}.ui-tooltip-titlebar .ui-icon,.ui-tooltip-icon .ui-icon{display:block;text-indent:-1000em;}.ui-tooltip-icon,.ui-tooltip-icon .ui-icon{-moz-border-radius:3px;-webkit-border-radius:3px;border-radius:3px;}.ui-tooltip-icon .ui-icon{width:18px;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;}/*!Default tooltip style */ .ui-tooltip-default .ui-tooltip-titlebar,.ui-tooltip-default .ui-tooltip-content{border-color:#F1D031;background-color:#FFFFA3;color:#555;}.ui-tooltip-default .ui-tooltip-titlebar{background-color:#FFEF93;}.ui-tooltip-default .ui-tooltip-icon{border-color:#CCC;background:#F1F1F1;color:#777;}.ui-tooltip-default .ui-tooltip-titlebar .ui-state-hover{border-color:#AAA;color:#111;}.ui-tooltip .ui-tooltip-tip{margin:0 auto;overflow:hidden;z-index:10;}.ui-tooltip .ui-tooltip-tip,.ui-tooltip .ui-tooltip-tip *{position:absolute;line-height:.1px!important;font-size:.1px!important;color:#123456;background:transparent;border:0 dashed transparent;}.ui-tooltip .ui-tooltip-tip canvas{top:0;left:0;}#qtip-overlay{position:fixed;left:-10000em;top:-10000em;}#qtip-overlay.blurs{cursor:pointer;}#qtip-overlay div{position:absolute;left:0;top:0;width:100%;height:100%;background-color:black;opacity:.7;filter:alpha(opacity=70);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";}/*!Light tooltip style */ .ui-tooltip-light .ui-tooltip-titlebar,.ui-tooltip-light .ui-tooltip-content{border-color:#E2E2E2;color:#454545;}.ui-tooltip-light .ui-tooltip-content{background-color:white;}.ui-tooltip-light .ui-tooltip-titlebar{background-color:#f1f1f1;}/*!Dark tooltip style */ .ui-tooltip-dark .ui-tooltip-titlebar,.ui-tooltip-dark .ui-tooltip-content{border-color:#303030;color:#f3f3f3;}.ui-tooltip-dark .ui-tooltip-content{background-color:#505050;}.ui-tooltip-dark .ui-tooltip-titlebar{background-color:#404040;}.ui-tooltip-dark .ui-tooltip-icon{border-color:#444;}.ui-tooltip-dark .ui-tooltip-titlebar .ui-state-hover{border-color:#303030;}/*!Cream tooltip style */ .ui-tooltip-cream .ui-tooltip-titlebar,.ui-tooltip-cream .ui-tooltip-content{border-color:#F9E98E;color:#A27D35;}.ui-tooltip-cream .ui-tooltip-content{background-color:#FBF7AA;}.ui-tooltip-cream .ui-tooltip-titlebar{background-color:#F0DE7D;}.ui-tooltip-cream .ui-state-default .ui-tooltip-icon{background-position:-82px 0;}/*!Red tooltip style */ .ui-tooltip-red .ui-tooltip-titlebar,.ui-tooltip-red .ui-tooltip-content{border-color:#D95252;color:#912323;}.ui-tooltip-red .ui-tooltip-content{background-color:#F78B83;}.ui-tooltip-red .ui-tooltip-titlebar{background-color:#F06D65;}.ui-tooltip-red .ui-state-default .ui-tooltip-icon{background-position:-102px 0;}.ui-tooltip-red .ui-tooltip-icon{border-color:#D95252;}.ui-tooltip-red .ui-tooltip-titlebar .ui-state-hover{border-color:#D95252;}/*!Green tooltip style */ .ui-tooltip-green .ui-tooltip-titlebar,.ui-tooltip-green .ui-tooltip-content{border-color:#90D93F;color:#3F6219;}.ui-tooltip-green .ui-tooltip-content{background-color:#CAED9E;}.ui-tooltip-green .ui-tooltip-titlebar{background-color:#B0DE78;}.ui-tooltip-green .ui-state-default .ui-tooltip-icon{background-position:-42px 0;}/*!Blue tooltip style */ .ui-tooltip-blue .ui-tooltip-titlebar,.ui-tooltip-blue .ui-tooltip-content{border-color:#ADD9ED;color:#5E99BD;}.ui-tooltip-blue .ui-tooltip-content{background-color:#E5F6FE;}.ui-tooltip-blue .ui-tooltip-titlebar{background-color:#D0E9F5;}.ui-tooltip-blue .ui-state-default .ui-tooltip-icon{background-position:-2px 0;}/*!Add shadows to your tooltips in:FF3+,Chrome 2+,Opera 10.6+,IE6+,Safari 2+*/ .ui-tooltip-shadow{-webkit-box-shadow:1px 1px 3px 1px rgba(0,0,0,0.15);-moz-box-shadow:1px 1px 3px 1px rgba(0,0,0,0.15);box-shadow:1px 1px 3px 1px rgba(0,0,0,0.15);}.ui-tooltip-shadow .ui-tooltip-titlebar,.ui-tooltip-shadow .ui-tooltip-content{filter:progid:DXImageTransform.Microsoft.Shadow(Color='gray',Direction=135,Strength=3);-ms-filter:"progid:DXImageTransform.Microsoft.Shadow(Color='gray',Direction=135,Strength=3)";_margin-bottom:-3px;.margin-bottom:-3px;}/*!AdLine truncated
|
||||
Vendored
+13
@@ -0,0 +1,13 @@
|
||||
/*
|
||||
* qTip2 - Pretty powerful tooltips
|
||||
* http://craigsworks.com/projects/qtip2/
|
||||
*
|
||||
* Version: nightly
|
||||
* Copyright 2009-2010 Craig Michael Thompson - http://craigsworks.com
|
||||
*
|
||||
* Dual licensed under MIT or GPLv2 licenses
|
||||
* http://en.wikipedia.org/wiki/MIT_License
|
||||
* http://en.wikipedia.org/wiki/GNU_General_Public_License
|
||||
*
|
||||
* Date: Mon Dec 19 15:43:28.0000000000 2011
|
||||
*//*jslint browser: true, onevar: true, undef: true, nomen: true, bitwise: true, regexp: true, newcap: true, immed: true, strict: true *//*global window: false, jQuery: false, console: false */(function(a,b,c){function E(b){var c=this,d=b.elements,e=d.tooltip,f=".bgiframe-"+b.id;a.extend(c,{init:function(){d.bgiframe=a('<iframe class="ui-tooltip-bgiframe" frameborder="0" tabindex="-1" src="javascript:\'\';" style="display:block; position:absolute; z-index:-1; filter:alpha(opacity=0); -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";"></iframe>'),d.bgiframe.appendTo(e),e.bind("tooltipmove"+f,c.adjust)},adjust:function(){var a=b.get("dimensions"),c=b.plugins.tip,f=d.tip,g,h;h=parseInt(e.css("border-left-width"),10)||0,h={left:-h,top:-h},c&&f&&(g=c.corner.precedance==="x"?["width","left"]:["height","top"],h[g[1]]-=f[g[0]]()),d.bgiframe.css(h).css(a)},destroy:function(){d.bgiframe.remove(),e.unbind(f)}}),c.init()}function D(c){var f=this,g=c.options.show.modal,i=c.elements,j=i.tooltip,k="#qtip-overlay",l=".qtipmodal",m=l+c.id,o="is-modal-qtip",q=a(document.body),r;c.checks.modal={"^show.modal.(on|blur)$":function(){f.init(),i.overlay.toggle(j.is(":visible"))}},a.extend(f,{init:function(){if(!g.on)return f;r=f.create(),j.attr(o,d).css("z-index",h.modal.zindex+a(n+"["+o+"]").length).unbind(l).unbind(m).bind("tooltipshow"+l+" tooltiphide"+l,function(b,c,d){var e=b.originalEvent;if(e&&b.type==="tooltiphide"&&/mouse(leave|enter)/.test(e.type)&&a(e.relatedTarget).closest(r[0]).length)try{b.preventDefault()}catch(g){}else(!e||e&&!e.solo)&&f[b.type.replace("tooltip","")](b,d)}).bind("tooltipfocus"+l,function(b){if(!b.isDefaultPrevented()){var c=a(n).filter("["+o+"]"),d=h.modal.zindex+c.length,e=parseInt(j[0].style.zIndex,10);r[0].style.zIndex=d-1,c.each(function(){this.style.zIndex>e&&(this.style.zIndex-=1)}),c.end().filter("."+p).qtip("blur",b.originalEvent),j.addClass(p)[0].style.zIndex=d;try{b.preventDefault()}catch(f){}}}).bind("tooltiphide"+l,function(b){a("["+o+"]").filter(":visible").not(j).last().qtip("focus",b)}),g.escape&&a(b).unbind(m).bind("keydown"+m,function(a){a.keyCode===27&&j.hasClass(p)&&c.hide(a)}),g.blur&&i.overlay.unbind(m).bind("click"+m,function(a){j.hasClass(p)&&c.hide(a)});return f},create:function(){var c=a(k);if(c.length)return i.overlay=c.insertAfter(a(n).last());r=i.overlay=a("<div />",{id:k.substr(1),html:"<div></div>",mousedown:function(){return e}}).insertAfter(a(n).last()),a(b).unbind(l).bind("resize"+l,function(){r.css({height:a(b).height(),width:a(b).width()})}).triggerHandler("resize");return r},toggle:function(b,c,h){if(b&&b.isDefaultPrevented())return f;var i=g.effect,k=c?"show":"hide",l=r.is(":visible"),p=a("["+o+"]").filter(":visible").not(j),s;r||(r=f.create());if(r.is(":animated")&&l===c||!c&&p.length)return f;c?(r.css({left:0,top:0}),r.toggleClass("blurs",g.blur),q.bind("focusin"+m,function(b){var c=a(b.target),d=c.closest(".qtip"),f=d.length<1?e:parseInt(d[0].style.zIndex,10)>parseInt(j[0].style.zIndex,10);!f&&a(b.target).closest(n)[0]!==j[0]&&j.find("input:visible").filter(":first").focus()})):q.undelegate("*","focusin"+m),r.stop(d,e),a.isFunction(i)?i.call(r,c):i===e?r[k]():r.fadeTo(parseInt(h,10)||90,c?1:0,function(){c||a(this).hide()}),c||r.queue(function(a){r.css({left:"",top:""}),a()});return f},show:function(a,b){return f.toggle(a,d,b)},hide:function(a,b){return f.toggle(a,e,b)},destroy:function(){var d=r;d&&(d=a("["+o+"]").not(j).length<1,d?(i.overlay.remove(),a(b).unbind(l)):i.overlay.unbind(l+c.id),q.undelegate("*","focusin"+m));return j.removeAttr(o).unbind(l)}}),f.init()}function C(b,g){function w(a){var b=a.precedance==="y",c=n[b?"width":"height"],d=n[b?"height":"width"],e=a.string().indexOf("center")>-1,f=c*(e?.5:1),g=Math.pow,h=Math.round,i,j,k,l=Math.sqrt(g(f,2)+g(d,2)),m=[p/f*l,p/d*l];m[2]=Math.sqrt(g(m[0],2)-g(p,2)),m[3]=Math.sqrt(g(m[1],2)-g(p,2)),i=l+m[2]+m[3]+(e?0:m[0]),j=i/l,k=[h(j*d),h(j*c)];return{height:k[b?0:1],width:k[b?1:0]}}function v(b){var c=k.titlebar&&b.y==="top",d=c?k.titlebar:k.content,e=a.browser.mozilla,f=e?"-moz-":a.browser.webkit?"-webkit-":"",g=b.y+(e?"":"-")+b.x,h=f+(e?"border-radius-"+g:"border-"+g+"-radius");return parseInt(d.css(h),10)||parseInt(l.css(h),10)||0}function u(a,b,c){b=b?b:a[a.precedance];var d=l.hasClass(r),e=k.titlebar&&a.y==="top",f=e?k.titlebar:k.content,g="border-"+b+"-width",h;l.addClass(r),h=parseInt(f.css(g),10),h=(c?h||parseInt(l.css(g),10):h)||0,l.toggleClass(r,d);return h}function t(a,f,g,h){if(k.tip){var l=i.corner.clone(),n=g.adjusted,o=b.options.position.adjust.method.split(" "),p=o[0],q=o[1]||o[0],r={left:e,top:e,x:0,y:0},s,t={},u;i.corner.fixed!==d&&(p==="shift"&&l.precedance==="x"&&n.left&&l.y!=="center"?l.precedance=l.precedance==="x"?"y":"x":p==="flip"&&n.left&&(l.x=l.x==="center"?n.left>0?"left":"right":l.x==="left"?"right":"left"),q==="shift"&&l.precedance==="y"&&n.top&&l.x!=="center"?l.precedance=l.precedance==="y"?"x":"y":q==="flip"&&n.top&&(l.y=l.y==="center"?n.top>0?"top":"bottom
Line truncated
|
||||
+16
-17
@@ -1,31 +1,30 @@
|
||||
|
||||
/*$( document ).ajaxStart( function() {
|
||||
$( '#spinner' ).show();
|
||||
}).ajaxStop( function() {
|
||||
$( '#spinner' ).hide();
|
||||
});
|
||||
*/
|
||||
/* Get the service status of the user */
|
||||
$(function() {
|
||||
var img_check = ' <img src="/static/check.png" alt="OK"';
|
||||
var img_error = ' <img src="/static/exclamation_mark.png" alt="ERROR"';
|
||||
/* Display the service status of the user */
|
||||
var img_check = ' <img src="/static/check.png" alt="OK" />';
|
||||
var img_error = ' <img src="/static/exclamation_mark.png" alt="ERROR" />';
|
||||
var image = '';
|
||||
var title = '';
|
||||
|
||||
$.getJSON("/userstatus/client/?format=json", function(data) {
|
||||
if(data.active) {
|
||||
image = img_check + ' title="Du har en bruker til foreningsmaskinene. \nSiste vellykkede pålogging: ' + data.last_successful_auth + '" />';
|
||||
image = img_check;
|
||||
title = "Du har en bruker til foreningsmaskinene. \nSiste vellykkede pålogging: " + data.last_successful_auth;
|
||||
} else {
|
||||
image = img_error + ' title="Ingen konto (mangler Kerberos principal)." />';
|
||||
image = img_error;
|
||||
title = "Ingen konto (mangler Kerberos principal).";
|
||||
}
|
||||
$("#client_status").html(image);
|
||||
$("#client_status").append(image).prop('title', title).qtip();
|
||||
});
|
||||
$.getJSON('/userstatus/wireless/?format=json', function(data) {
|
||||
if(data.active) {
|
||||
image = img_check + ' title="Du har tilgang til trådløst nettverk. \nSiste vellykkede pålogging: ' + data.last_successful_auth + '" />';
|
||||
image = img_check;
|
||||
title = 'Du har tilgang til trådløst nettverk. \nSiste vellykkede pålogging: ' + data.last_successful_auth;
|
||||
} else {
|
||||
image = img_error + ' title="Ingen trådløskonto (i Radius)." />';
|
||||
image = img_error;
|
||||
title = 'Ingen trådløskonto (i Radius).';
|
||||
}
|
||||
$("#wireless_status").html(image);
|
||||
$("#wireless_status").append(image).prop('title', title).qtip();
|
||||
});
|
||||
|
||||
/* Any element with a title attribute gets a pretty qtip */
|
||||
$("[title]").qtip();
|
||||
});
|
||||
@@ -89,4 +89,8 @@ body {
|
||||
background-color: $error-bg-color;
|
||||
border: solid 2px $error-border-color;
|
||||
}
|
||||
.ui-tooltip {
|
||||
font-size: $blueprint-font-size - 2;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
}
|
||||
@@ -570,3 +570,7 @@ body ul.errorlist, body ul.errorlist li {
|
||||
padding: 0px;
|
||||
display: inline;
|
||||
}
|
||||
body .ui-tooltip {
|
||||
font-size: 14px;
|
||||
line-height: 1.2em;
|
||||
}
|
||||
+3
-3
@@ -3,10 +3,10 @@
|
||||
<head>
|
||||
<title>{%block title%}Userinfo{%endblock%}</title>
|
||||
<meta charset="utf-8" />
|
||||
<link rel="stylesheet" href="/static/style/stylesheets/screen.css" type="text/css" media="screen, projection">
|
||||
<link rel="stylesheet" href="/static/style/stylesheets/print.css" type="text/css" media="print">
|
||||
<link rel="stylesheet" href="/static/style/stylesheets/screen.css" type="text/css" media="screen, projection" /)>
|
||||
<link rel="stylesheet" href="/static/style/stylesheets/print.css" type="text/css" media="print" />
|
||||
<!--[if lt IE 8]>
|
||||
<link rel="stylesheet" href="/static/style/stylesheets/ie.css" type="text/css" media="screen, projection">
|
||||
<link rel="stylesheet" href="/static/style/stylesheets/ie.css" type="text/css" media="screen, projection" />
|
||||
<![endif]-->
|
||||
{%block headinc %}
|
||||
{%endblock%}
|
||||
|
||||
@@ -1,7 +1,10 @@
|
||||
{% extends "base.html" %}
|
||||
{% block headinc %}
|
||||
<script type="text/javascript" src="/static/js/jquery-1.6.1.min.js"></script>
|
||||
<script type="text/javascript" src="/static/js/jquery.qtip.min.js"></script>
|
||||
<script type="text/javascript" src="/static/js/status.js"></script>
|
||||
|
||||
<link rel="stylesheet" href="/static/js/jquery.qtip.min.css" type="text/css" />
|
||||
{% endblock %}
|
||||
{%block header%}
|
||||
{% include "nav.html" with active="profile" %}
|
||||
@@ -35,8 +38,8 @@
|
||||
<section class="column last">
|
||||
<h2>Dine tjenester</h2>
|
||||
<ul>
|
||||
<li>Trådløst nettverk<span id="wireless_status"></span></li>
|
||||
<li>Foreningsmaskiner<span id="client_status"></span></li>
|
||||
<li><span id="wireless_status">Trådløst nettverk</span></li>
|
||||
<li><span id="client_status">Foreningsmaskiner</span></li>
|
||||
</ul>
|
||||
</section>
|
||||
{%endblock%}
|
||||
Reference in new issue
Block a user