]> git.mxchange.org Git - friendica.git/commitdiff
hovercard: some polishing
authorrabuzarus <>
Fri, 6 May 2016 20:28:12 +0000 (22:28 +0200)
committerrabuzarus <>
Fri, 6 May 2016 20:28:12 +0000 (22:28 +0200)
css/hovercard.css
css/style.css
js/hovercard.js
templates/search_item.tpl
templates/wall_thread.tpl

index 54dff6a402563053d83aee533ab15a21e03ec18b..b646bf4f28ad6281d3f2badb0f02948ca08cdc32 100644 (file)
@@ -240,7 +240,7 @@ a:visited {
 \r
 /* Basic hovercard */\r
 .basic-content {\r
-  padding: 9px 14px;\r
+  padding: 9px;\r
 }\r
 .basic-image-wrapper {\r
   background: #fff;\r
@@ -425,6 +425,7 @@ a:visited {
 .image-wrapper.medium > a img {\r
   height: 80px;\r
   width: 80px;\r
+  margin-bottom: 0;\r
 }\r
 .image-wrapper.large {\r
   max-width: 140px;\r
@@ -451,7 +452,7 @@ a:visited {
   border-radius: 4px;\r
   /*max-width: 250px;*/\r
   max-width: 400px;\r
-  width: 400px;\r
+  width: 350px;\r
   -webkit-box-shadow: 0 10px 100px rgba(0, 0, 0, 0.25);\r
   -moz-box-shadow: 0 10px 100px rgba(0, 0, 0, 0.25);\r
   box-shadow: 0 10px 100px rgba(0, 0, 0, 0.25);\r
@@ -493,7 +494,7 @@ a:visited {
 .hover-card-header h4 {\r
   /*float: left;*/\r
   display: block;\r
-  width: 310px;\r
+  /*width: 310px;*/\r
   /*margin-top: 25px;*/\r
   /*clear: right;*/\r
 }\r
@@ -533,6 +534,11 @@ a:visited {
 .hover-card-content .profile-details {\r
     font-size: 13px;\r
 }\r
+.hover-card-content .profile-addr {\r
+  overflow: hidden;\r
+  display: block;\r
+  text-overflow: ellipsis;\r
+}\r
 .hover-card-content li.right-aligned {\r
   padding: .15em 1.25em;\r
   border-left: 1px #F3F2F2 solid;\r
@@ -573,6 +579,9 @@ a:visited {
 .hover-card-actions-connection {\r
   margin-left: 30px;\r
 }\r
+.hovercard .hovercard-content .hover-card-actions a.btn {\r
+  display: inline-block;\r
+}\r
 .hover-card-options-wrapper {\r
   position: relative;\r
   display: block;\r
index f06481112af691480872354e4a6436d6f814d713..d17e2835030856821d6bfe9a3330fb2f37fc0698 100644 (file)
@@ -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 {
index c42b0ce2f175cd208c5cccd3c9f394da46941348..55d2b2496d16315b810d2a85695f0d420d83a0b5 100644 (file)
@@ -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
index cffcf3fb1581afc6d3931f4913537a115eeaf8db..da5b0d8e98a1f350ec1c4d5b1003d1fb9618bf68 100644 (file)
@@ -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}}&nbsp;&mdash;&nbsp;({{$item.location}}){{/if}}</small>
                                        </p>
index 37971b3bc2fe8f9709df2b3d3d1f366bb249fb58..eaeb23c98e788cadffd997e26d38c8294d6cb2c4 100644 (file)
@@ -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}}&nbsp;&mdash;&nbsp;({{$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}}&nbsp;&mdash;&nbsp;({{$item.location}}){{/if}}</small>
                                </span>