hovercard: some polishing
This commit is contained in:
parent
415c36e4bb
commit
697104dcce
|
@ -240,7 +240,7 @@ a:visited {
|
|||
|
||||
/* Basic hovercard */
|
||||
.basic-content {
|
||||
padding: 9px 14px;
|
||||
padding: 9px;
|
||||
}
|
||||
.basic-image-wrapper {
|
||||
background: #fff;
|
||||
|
@ -425,6 +425,7 @@ a:visited {
|
|||
.image-wrapper.medium > a img {
|
||||
height: 80px;
|
||||
width: 80px;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
.image-wrapper.large {
|
||||
max-width: 140px;
|
||||
|
@ -451,7 +452,7 @@ a:visited {
|
|||
border-radius: 4px;
|
||||
/*max-width: 250px;*/
|
||||
max-width: 400px;
|
||||
width: 400px;
|
||||
width: 350px;
|
||||
-webkit-box-shadow: 0 10px 100px rgba(0, 0, 0, 0.25);
|
||||
-moz-box-shadow: 0 10px 100px rgba(0, 0, 0, 0.25);
|
||||
box-shadow: 0 10px 100px rgba(0, 0, 0, 0.25);
|
||||
|
@ -493,7 +494,7 @@ a:visited {
|
|||
.hover-card-header h4 {
|
||||
/*float: left;*/
|
||||
display: block;
|
||||
width: 310px;
|
||||
/*width: 310px;*/
|
||||
/*margin-top: 25px;*/
|
||||
/*clear: right;*/
|
||||
}
|
||||
|
@ -533,6 +534,11 @@ a:visited {
|
|||
.hover-card-content .profile-details {
|
||||
font-size: 13px;
|
||||
}
|
||||
.hover-card-content .profile-addr {
|
||||
overflow: hidden;
|
||||
display: block;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.hover-card-content li.right-aligned {
|
||||
padding: .15em 1.25em;
|
||||
border-left: 1px #F3F2F2 solid;
|
||||
|
@ -573,6 +579,9 @@ a:visited {
|
|||
.hover-card-actions-connection {
|
||||
margin-left: 30px;
|
||||
}
|
||||
.hovercard .hovercard-content .hover-card-actions a.btn {
|
||||
display: inline-block;
|
||||
}
|
||||
.hover-card-options-wrapper {
|
||||
position: relative;
|
||||
display: block;
|
||||
|
|
|
@ -1163,7 +1163,11 @@ section #jotOpen {
|
|||
.media .media-body h5.media-heading a {
|
||||
display: block;
|
||||
}
|
||||
.media .contact-info-xs h5 {
|
||||
.media .contact-info-comment {
|
||||
display: table-cell;
|
||||
}
|
||||
.media .contact-info-xs h5,
|
||||
.media .contact-info-comment {
|
||||
margin: 0 0 5px;
|
||||
}
|
||||
.media-heading {
|
||||
|
@ -1173,6 +1177,10 @@ section #jotOpen {
|
|||
font-size: 15px;
|
||||
font-weight: bold;
|
||||
}
|
||||
.wall-item-name.xs {
|
||||
font-weight: 700;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
/* The lock symbol popup */
|
||||
#panel {
|
||||
|
|
|
@ -95,19 +95,19 @@ $('body').on("mouseleave touchstart scroll click dblclick mousedown mouseup subm
|
|||
// removes all hover cards
|
||||
function removeAllhoverCards(event,priorTo) {
|
||||
// don't remove hovercards until after 100ms, so user have time to move the cursor to it (which gives it the dont-remove-card class)
|
||||
setTimeout(function(){
|
||||
$.each($('.hovercard'),function(){
|
||||
var title = $(this).attr("data-orig-title");
|
||||
// don't remove card if it was created after removeAllhoverCards() was called
|
||||
if($(this).data('card-created') < priorTo) {
|
||||
// don't remove it if we're hovering it right now!
|
||||
if(!$(this).hasClass('dont-remove-card')) {
|
||||
$('[data-hover-card-active="' + $(this).data('card-created') + '"]').removeAttr('data-hover-card-active');
|
||||
$(this).popover("hide");
|
||||
}
|
||||
}
|
||||
});
|
||||
},100);
|
||||
// setTimeout(function(){
|
||||
// $.each($('.hovercard'),function(){
|
||||
// var title = $(this).attr("data-orig-title");
|
||||
// // don't remove card if it was created after removeAllhoverCards() was called
|
||||
// if($(this).data('card-created') < priorTo) {
|
||||
// // don't remove it if we're hovering it right now!
|
||||
// if(!$(this).hasClass('dont-remove-card')) {
|
||||
// $('[data-hover-card-active="' + $(this).data('card-created') + '"]').removeAttr('data-hover-card-active');
|
||||
// $(this).popover("hide");
|
||||
// }
|
||||
// }
|
||||
// });
|
||||
// },100);
|
||||
}
|
||||
|
||||
// if we're hovering a hover card, give it a class, so we don't remove it
|
||||
|
|
|
@ -96,7 +96,7 @@
|
|||
{{* contact info header for smartphones *}}
|
||||
<div role="heading " class="contact-info-xs hidden-lg hidden-md">
|
||||
<h5 class="media-heading">
|
||||
<a href="{{$item.profile_url}}" title="{{$item.linktitle}}" class="wall-item-name-link userinfo"><strong>{{$item.name}}</strong></a>
|
||||
<a href="{{$item.profile_url}}" title="{{$item.linktitle}}" class="wall-item-name-link userinfo"><span>{{$item.name}}</span></a>
|
||||
<p class="text-muted"><small>
|
||||
<span class="wall-item-ago">{{$item.ago}}</span> {{if $item.location}} — ({{$item.location}}){{/if}}</small>
|
||||
</p>
|
||||
|
|
|
@ -205,7 +205,7 @@ as the value of $top_child_total (this is done at the end of this file)
|
|||
{{* contact info header for smartphones *}}
|
||||
<div role="heading " aria-level="{{$item.thread_level}}" class="contact-info-xs hidden-lg hidden-md"><!-- <= For smartphone (responsive) -->
|
||||
<h5 class="media-heading">
|
||||
<a href="{{$item.profile_url}}" title="{{$item.linktitle}}" class="wall-item-name-link userinfo"><strong>{{$item.name}}</strong></a>
|
||||
<a href="{{$item.profile_url}}" title="{{$item.linktitle}}" class="wall-item-name-link userinfo"><span>{{$item.name}}</span></a>
|
||||
<p class="text-muted">
|
||||
<small><span class="wall-item-ago">{{$item.ago}}</span> {{if $item.location}} — ({{$item.location}}){{/if}}</small>
|
||||
</p>
|
||||
|
@ -216,9 +216,9 @@ as the value of $top_child_total (this is done at the end of this file)
|
|||
{{* contact info header for comments *}}
|
||||
{{if $item.thread_level!=1}}
|
||||
<div class="media-body">{{*this is the media body for comments - this div must be closed at the end of the file *}}
|
||||
<div role="heading " aria-level="{{$item.thread_level}}" class="contact-info-xs">
|
||||
<div role="heading " aria-level="{{$item.thread_level}}" class="contact-info-comment">
|
||||
<h5 class="media-heading">
|
||||
<a href="{{$item.profile_url}}" title="{{$item.linktitle}}" class="wall-item-name-link userinfo"><strong class="btn-link">{{$item.name}}</strong></a>
|
||||
<a href="{{$item.profile_url}}" title="{{$item.linktitle}}" class="wall-item-name-link userinfo"><span class="btn-link">{{$item.name}}</span></a>
|
||||
<span class="text-muted">
|
||||
<small><span title="{{$item.localtime}}" data-toggle="tooltip">{{$item.ago}}</span> {{if $item.location}} — ({{$item.location}}){{/if}}</small>
|
||||
</span>
|
||||
|
|
Loading…
Reference in New Issue
Block a user