Changeset 11632 for trunk/src/bp-templates/bp-legacy/css/buddypress.css

Timestamp:

07/08/2017 08:45:29 AM (8 years ago)

Author:

mercime

Message:

Adjust and organize BP Tooltip styles.

Fixes #7188.

File:

• trunk/src/bp-templates/bp-legacy/css/buddypress.css (modified) (6 diffs)

trunk/src/bp-templates/bp-legacy/css/buddypress.css

@@ -1866 +1866 @@
 }
 
-.message-metadata .bp-tooltip:hover:after,
-.message-metadata .bp-tooltip:active:after,
-.message-metadata .bp-tooltip:focus:after {
-    margin-top: 10px;
-    max-width: 240px;
-    right: 0;
-    text-align: right;
-}
-
 .message-star-actions {
     position: absolute;
@@ -2036 +2027 @@
 }
 
-.widget.buddypress .item-avatar a.bp-tooltip {
+.widget.buddypress .item-avatar a {
     float: left;
     margin-bottom: 15px;
@@ -2125 +2116 @@
     line-height: 1.5;
     margin-top: 10px;
-    max-width: 200px;
+    max-width: 240px;
     opacity: 0;
     padding: 3px 6px;
@@ -2135 +2126 @@
     text-transform: none;
     top: 100%;
+    -webkit-transform: translateX(50%);
+    -ms-transform: translateX(50%);
     transform: translateX(50%);
+    -webkit-transition: opacity 2s ease-out;
+    -ms-transition: opacity 2s ease-out;
     transition: opacity 2s ease-out;
     white-space: pre;
@@ -2142 +2137 @@
 }
 
-.bp-tooltip:hover:before,
 .bp-tooltip:hover:after,
-.bp-tooltip:active:before,
 .bp-tooltip:active:after,
-.bp-tooltip:focus:before,
 .bp-tooltip:focus:after {
     display: inline-block;
@@ -2155 +2147 @@
 }
 
-.bp-site-wide-message .bp-tooltip:hover:after,
-.bp-site-wide-message .bp-tooltip:active:after,
-.bp-site-wide-message .bp-tooltip:focus:after,
-.admin-bar-on .bp-tooltip:hover:after,
-.admin-bar-on .bp-tooltip:active:after,
-.admin-bar-on .bp-tooltip:focus:after {
+#group-admins .bp-tooltip:after,
+#group-mods .bp-tooltip:after,
+.message-metadata .bp-tooltip:after {
+    right: 0;
+    text-align: right;
+    -webkit-transform: translateX(0);
+    -ms-transform: translateX(0);
+    transform: translateX(0);
+}
+
+.feed .bp-tooltip:after,
+.item-list .bp-tooltip:after,
+.messages-notices .bp-tooltip:after {
+    left: 0;
+    right: auto;
+    text-align: left;
+    -webkit-transform: translateX(0);
+    -ms-transform: translateX(0);
+    transform: translateX(0);
+}
+
+.bp-site-wide-message .bp-tooltip:after,
+.admin-bar-on .bp-tooltip:after {
     right: 50px;
 }