]> git.mxchange.org Git - friendica.git/commitdiff
hovercard: some css cleanup (remove unneeded css)
authorrabuzarus <>
Fri, 6 May 2016 20:58:26 +0000 (22:58 +0200)
committerrabuzarus <>
Fri, 6 May 2016 20:58:26 +0000 (22:58 +0200)
css/hovercard.css
js/hovercard.js

index b646bf4f28ad6281d3f2badb0f02948ca08cdc32..47d8de9001dc0339fc15d5c8687efbb52892bdcd 100644 (file)
@@ -1,62 +1,4 @@
-html {\r
-  font-family: sans-serif;\r
-  -ms-text-size-adjust: 100%;\r
-  -webkit-text-size-adjust: 100%;\r
-}\r
-body {\r
-  margin: 0;\r
-}\r
-a {\r
-  background: transparent;\r
-}\r
-a:active,\r
-a:hover {\r
-  outline: 0;\r
-}\r
-* {\r
-  -webkit-box-sizing: border-box;\r
-  -moz-box-sizing: border-box;\r
-  box-sizing: border-box;\r
-}\r
-*:before,\r
-*:after {\r
-  -webkit-box-sizing: border-box;\r
-  -moz-box-sizing: border-box;\r
-  box-sizing: border-box;\r
-}\r
-html {\r
-  font-size: 10px;\r
-  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);\r
-}\r
-body {\r
-  font-family: "Lato", Helvetica, Arial, sans-serif;\r
-  font-size: 14px;\r
-  line-height: 1.42857143;\r
-  color: #333333;\r
-  background-color: #e9ecf0;\r
-}\r
 \r
-a {\r
-  color: #587c9b;\r
-  text-decoration: none;\r
-}\r
-a:hover,\r
-a:focus {\r
-  color: #3c556a;\r
-  text-decoration: underline;\r
-}\r
-a:focus {\r
-  outline: thin dotted;\r
-  outline: 5px auto -webkit-focus-ring-color;\r
-  outline-offset: -2px;\r
-}\r
-.main-container {\r
-  min-height: 100%;\r
-  padding-bottom: 2em;\r
-  position: relative;\r
-  margin: 0 auto;\r
-  width: 100%;\r
-}\r
 .hovercard {\r
   position: absolute;\r
   top: 0;\r
@@ -100,8 +42,6 @@ a:focus {
   display: none;\r
 }\r
 .hovercard-content {\r
-/*  padding: 9px 14px;*/\r
-  \r
   color: #777;\r
   padding: 0;\r
 }\r
@@ -192,48 +132,48 @@ a:focus {
   display: none !important;\r
   visibility: hidden !important;\r
 }\r
-h1,\r
-.h1,\r
-h2,\r
-.h2,\r
-h3,\r
-.h3 {\r
+.hovercard h1,\r
+.hovercard .h1,\r
+.hovercard h2,\r
+.hovercard .h2,\r
+.hovercard h3,\r
+.hovercard .h3 {\r
   margin: 0;\r
   padding: 0;\r
 }\r
-h3 {\r
+.hovercard h3 {\r
   font-size: 24px;\r
 }\r
-h4,\r
-.h4,\r
-h5,\r
-.h5,\r
-h6,\r
-.h6 {\r
+.hovercard h4,\r
+.hovercard .h4,\r
+.hovercard h5,\r
+.hovercard .h5,\r
+.hovercard h6,\r
+.hovercard .h6 {\r
   margin: 0;\r
   padding: 0;\r
 }\r
-h4.text-center {\r
+.hovercard h4.text-center {\r
   margin-top: 10px;\r
   margin-bottom: 5px;\r
 }\r
-sup {\r
+.hovercard sup {\r
   top: 0;\r
 }\r
-small,\r
-.small {\r
+.hovercard small,\r
+.hovercard .small {\r
   font-size: 85%;\r
 }\r
-ul,\r
-ol {\r
+.hovercard ul,\r
+.hovercard ol {\r
   margin: 0;\r
   padding: 0;\r
   margin-bottom: 0;\r
 }\r
-a:hover,\r
-a:active,\r
-a:focus,\r
-a:visited {\r
+.hovercard a:hover,\r
+.hovercard a:active,\r
+.hovercard a:focus,\r
+.hovercard a:visited {\r
   text-decoration: none !important;\r
 }\r
 \r
@@ -242,108 +182,9 @@ a:visited {
 .basic-content {\r
   padding: 9px;\r
 }\r
-.basic-image-wrapper {\r
-  background: #fff;\r
-  border: 2px #fff solid;\r
-  margin-top:10px;\r
-  display: block;\r
-  overflow: hidden;\r
-}\r
-.basic-image-wrapper > a,\r
-.basic-image-wrapper > span {\r
-  background-size: 100% !important;\r
-}\r
-\r
-/*.basic-image-wrapper:hover {\r
-  box-shadow: 0 0 0.2em #7595b1;\r
-  cursor: pointer;\r
-}*/\r
-.basic-image-wrapper.mini {\r
-  max-width: 40px;\r
-  max-height: 40px;\r
-}\r
-.basic-image-wrapper.mini > a,\r
-.basic-image-wrapper.mini > span {\r
-  height: 40px;\r
-  width: 40px;\r
-  content: " ";\r
-  display: block;\r
-}\r
-.basic-image-wrapper.mini .image-l {\r
-  width: 30px;\r
-  display: block;\r
-  height: 40px;\r
-  overflow: hidden;\r
-  float: left;\r
-  text-align: center;\r
-  margin-left: -14px;\r
-}\r
-.basic-image-wrapper.mini .image-l > span {\r
-  display: block;\r
-  width: 40px;\r
-  height: 40px;\r
-  background-size: 100% !important;\r
-}\r
-.basic-image-wrapper.mini > .image-ur,\r
-.basic-image-wrapper.mini > .image-lr {\r
-  width: 19px;\r
-  display: block;\r
-  height: 23px;\r
-  margin-top: -2px;\r
-  overflow: hidden;\r
-  float: right;\r
-  text-align: center;\r
-  z-index: -99;\r
-  margin-left: -1px;\r
-}\r
-.basic-image-wrapper.mini > .image-ur > span,\r
-.basic-image-wrapper.mini > .image-lr > span {\r
-  display: block;\r
-  width: 20px;\r
-  height: 20px;\r
-  background-size: 100% !important;\r
-}\r
-.basic-image-wrapper.normal {\r
-  max-width: 60px;\r
-  max-height: 60px;\r
-}\r
-.basic-image-wrapper.normal > a,\r
-.basic-image-wrapper.normal > span {\r
-  height: 60px;\r
-  width: 60px;\r
-  content: " ";\r
-  display: block;\r
-}\r
-.basic-image-wrapper.medium {\r
-  max-width: 70px;\r
-  max-height: 70px;\r
-}\r
-.basic-image-wrapper.medium > a,\r
-.basic-image-wrapper.medium > span {\r
-  height: 70px;\r
-  width: 70px;\r
-  content: " ";\r
-  display: block;\r
-}\r
-.basic-image-wrapper.large {\r
-  max-width: 140px;\r
-  max-height: 140px;\r
-}\r
-.basic-image-wrapper.large > a,\r
-.basic-image-wrapper.large > span {\r
-  height: 140px;\r
-  width: 140px;\r
-  content: " ";\r
-  display: block;\r
-}\r
-\r
-/* Google like */\r
 .image-wrapper {\r
   background: #fff;\r
   border: 2px #fff solid;\r
-/*  -webkit-border-radius: 200px;\r
-  -moz-border-radius: 200px;\r
-  border-radius: 200px;*/\r
   display: block;\r
   overflow: hidden;\r
 }\r
@@ -351,74 +192,8 @@ a:visited {
 .image-wrapper > span {\r
   background-size: 100% !important;\r
 }\r
-/*.image-wrapper:hover {\r
-  box-shadow: 0 0 0.2em #7595b1;\r
-  cursor: pointer;\r
-}*/\r
-.image-wrapper.mini {\r
-  max-width: 40px;\r
-  max-height: 40px;\r
-}\r
-.image-wrapper.mini > a,\r
-.image-wrapper.mini > span {\r
-  height: 40px;\r
-  width: 40px;\r
-  content: " ";\r
-  display: block;\r
-}\r
-.image-wrapper.mini .image-l {\r
-  width: 30px;\r
-  display: block;\r
-  height: 40px;\r
-  overflow: hidden;\r
-  float: left;\r
-  text-align: center;\r
-  margin-left: -14px;\r
-}\r
-.image-wrapper.mini .image-l > span {\r
-  display: block;\r
-  width: 40px;\r
-  height: 40px;\r
-  background-size: 100% !important;\r
-}\r
-.image-wrapper.mini > .image-ur,\r
-.image-wrapper.mini > .image-lr {\r
-  width: 19px;\r
-  display: block;\r
-  height: 23px;\r
-  margin-top: -2px;\r
-  overflow: hidden;\r
-  float: right;\r
-  text-align: center;\r
-  z-index: -99;\r
-  margin-left: -1px;\r
-}\r
-.image-wrapper.mini > .image-ur > span,\r
-.image-wrapper.mini > .image-lr > span {\r
-  display: block;\r
-  width: 20px;\r
-  height: 20px;\r
-  background-size: 100% !important;\r
-}\r
-.image-wrapper.normal {\r
-  max-width: 60px;\r
-  max-height: 60px;\r
-}\r
-.image-wrapper.normal > a,\r
-.image-wrapper.normal > span {\r
-  height: 60px;\r
-  width: 60px;\r
-  content: " ";\r
-  display: block;\r
-}\r
-.image-wrapper.medium {\r
-/*  max-width: 80px;\r
-  max-height: 80px;*/\r
-}\r
 .image-wrapper.medium > a,\r
 .image-wrapper.medium > span {\r
-/*  height: 80px;\r
-  width: 80px;*/\r
   content: " ";\r
   display: block;\r
 }\r
@@ -427,25 +202,6 @@ a:visited {
   width: 80px;\r
   margin-bottom: 0;\r
 }\r
-.image-wrapper.large {\r
-  max-width: 140px;\r
-  max-height: 140px;\r
-}\r
-.image-wrapper.large > a,\r
-.image-wrapper.large > span {\r
-  height: 140px;\r
-  width: 140px;\r
-  content: " ";\r
-  display: block;\r
-}\r
-.main-body {\r
-  background: #fff;\r
-  padding: 1.25em 2em;\r
-  -webkit-border-radius: 8px;\r
-  -moz-border-radius: 8px;\r
-  border-radius: 8px;\r
-  line-height: 1.75em;\r
-}\r
 .hovercard {\r
   -webkit-border-radius: 4px;\r
   -moz-border-radius: 4px;\r
@@ -489,37 +245,24 @@ a:visited {
 \r
 .hover-card-header {\r
   width: 100%;\r
-  /*height: 60px;*/\r
 }\r
 .hover-card-header h4 {\r
-  /*float: left;*/\r
   display: block;\r
-  /*width: 310px;*/\r
-  /*margin-top: 25px;*/\r
-  /*clear: right;*/\r
+\r
 }\r
 .hover-card-header h4 a {\r
   font-size: 18px;\r
   font-weight: bold;\r
   letter-spacing: 0.03rem;\r
 }\r
-.hover-card-header .member-title {\r
-  display: block;\r
-  color: #888;\r
-  line-height: 15px;\r
-  font-size: 13px;\r
-}\r
 .hover-card-details {\r
   width: 100%;\r
 }\r
 .hover-card-pic {\r
   margin-top: 0px;\r
-  /*width: 95px;*/\r
   display: block;\r
-  /*height: 90px;*/\r
 }\r
 .hover-card-pic .image-wrapper {\r
-  /*margin: 0.5em 0.75em;*/\r
   margin-right: 0.75em;\r
   float: left;\r
   position: relative;\r
@@ -539,40 +282,6 @@ a:visited {
   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
-}\r
-.hover-card-content li.right-aligned .content {\r
-  font-size: 14px;\r
-}\r
-.hover-card-content li.right-aligned:last-child {\r
-  border-left: none;\r
-}\r
-.hover-card-content .reputation-bar {\r
-  position: absolute;\r
-}\r
-.hover-card-content .reputation-bar span {\r
-  width: 65px;\r
-  position: absolute;\r
-  margin: 1em auto;\r
-  margin-left: 15px;\r
-  text-align: center;\r
-  border-radius: 2em;\r
-  padding: .15em 0;\r
-  background-color: #ccc;\r
-  color: #fff;\r
-}\r
-.hover-card-content .desc,\r
-.profile-label {\r
-  text-transform: uppercase;\r
-  font-size: 11px;\r
-  letter-spacing: 0.05rem;\r
-  padding-bottom: 0.5em;\r
-  padding-top: .15em;\r
-  opacity: 0.8;\r
-  display: block;\r
-}\r
 .hover-card-actions {\r
   display: flex;\r
 }\r
@@ -582,74 +291,9 @@ a:visited {
 .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
-  width: 430px;\r
-  float: left;\r
-  background: #F5F5F5;\r
-  padding: 0 .5em;\r
-  margin-bottom: 0.5em;\r
-  clear: both;\r
-  height: 40px;\r
-}\r
-.hover-card-options-wrapper ul {\r
-  padding: .65em 0;\r
-}\r
-.hover-card-options-wrapper li {\r
-  list-style-type: none;\r
-  line-height: 0;\r
-  display: inline-block;\r
-  padding: 0 .75em;\r
-}\r
-.hover-card-options-wrapper li i {\r
-  padding: 5px 3px;\r
-  -webkit-border-radius: 100%;\r
-  -moz-border-radius: 100%;\r
-  border-radius: 100%;\r
-  font-size: 12px;\r
-}\r
-.hover-card-options-wrapper li a {\r
-  color: #444;\r
-  padding: 0;\r
-  font-size: 13px;\r
-  font-weight: normal;\r
-  opacity: 0.8;\r
-}\r
-.hover-card-options {\r
-  color: #eee;\r
-}\r
-.hover-card-options .dropdown-menu a {\r
-  text-shadow: none;\r
-}\r
 .hover-card-footer {\r
   background-color: #f7f7f7;\r
   border-top: 1px solid #ebebeb;\r
   padding: 0 10px;\r
 }\r
-.col-sm-10 label {\r
-  font-weight: normal;\r
-}\r
-.demo-content {\r
-       width: 100%;\r
-       background: #dadada;\r
-       border: solid 3px #ccc;\r
-       font-size: 12px;\r
-       width: 38%;\r
-       float: left;\r
-       margin-right: 2%;\r
-       margin: 20px 0 30px;\r
-}\r
-.demo-live {\r
-       padding: 20px;\r
-       background: #fff;\r
-       line-height: 1.4em;\r
-       min-height: 218px;\r
-}\r
-p {\r
-       display: block;\r
-       -webkit-margin-before: 1em;\r
-       -webkit-margin-after: 1em;\r
-       -webkit-margin-start: 0px;\r
-       -webkit-margin-end: 0px;\r
-}
\ No newline at end of file
+\r
index 55d2b2496d16315b810d2a85695f0d420d83a0b5..c42b0ce2f175cd208c5cccd3c9f394da46941348 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