Sutty/trabajo-afectivo
5
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

First version of own tooltip.

Browse source
This commit is contained in:
Martin Edenhofer 2014-08-28 09:25:04 +02:00
parent 1f9e7e37b1
commit 5a16c4bd1f
2 changed files with 45 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
app/assets/javascripts/app/controllers/_application_controller.js.coffee
View file

@ -207,7 +207,7 @@ class App.Controller extends Spine.Controller
# console.log('rewrite frontendTimeUpdate', this, $(this).hasClass('escalation')) # console.log('rewrite frontendTimeUpdate', this, $(this).hasClass('escalation'))
timestamp = $(this).data('time') timestamp = $(this).data('time')
time = ui.humanTime( timestamp, $(this).hasClass('escalation') ) time = ui.humanTime( timestamp, $(this).hasClass('escalation') )
$(this).attr( 'title', App.i18n.translateTimestamp(timestamp) ) $(this).attr( 'data-tooltip', App.i18n.translateTimestamp(timestamp) )
$(this).html( time ) $(this).html( time )
) )
App.Interval.set( update, 30000, 'frontendTimeUpdate', 'ui' ) App.Interval.set( update, 30000, 'frontendTimeUpdate', 'ui' )

44
app/assets/stylesheets/zzz.css.erb
View file

@ -19,6 +19,50 @@ small {
z-index: 1; z-index: 1;
} }
/* tooltip */
a[data-tooltip],
time[data-tooltip],
span[data-tooltip] {
position: relative;
z-index: 99000;
}
a[data-tooltip]:before,
time[data-tooltip]:before,
span[data-tooltip]:before {
position: absolute;
left: 0;
top: -34px;
background-color: #c6c6c5;
color: #ffffff;
height: 26px;
line-height: 27px;
border-radius: 5px;
padding: 0 13px;
content: attr(data-tooltip);
white-space: nowrap;
display: none;
}
a[data-tooltip]:after,
time[data-tooltip]:after,
span[data-tooltip]:after {
position: absolute;
left: 13px;
top: -8px;
border-top: 7px solid #c6c6c5;
border-left: 7px solid transparent;
border-right: 7px solid transparent;
content: "";
display: none;
}
a[data-tooltip]:hover:after,
a[data-tooltip]:hover:before,
time[data-tooltip]:hover:after,
time[data-tooltip]:hover:before,
span[data-tooltip]:hover:after,
span[data-tooltip]:hover:before {
display: block;
}
.glyphicon { .glyphicon {
font-size: 13px; font-size: 13px;
} }